Click here to navigate the course.

Drag the edges to resize the window.

In Projects, you can keep track of your progress as you go throught the tasks. Check each item as you complete it!

Code Editor
Web Browser
Learn

A render function must have a return statement. However, that isn't all that it can have.

A render function can also be a fine place to put simple calculations that need to happen right before a component renders. Here's an example of some calculations inside of a render function:

var Random = React.createClass({ render: function () { // First, some logic that must happen // before rendering: var n = Math.floor(Math.random()*10+1); // Next, a return statement // using that logic: return <h1>The number is {n}!</h1>; } });

Watch out for this common mistake:

var Random = React.createClass({ // This should be in the render function: var n = Math.floor(Math.random()*10+1); render: function () { return <h1>The number is {n}!</h1>; } });
Report a Bug
If you see a bug or any other issue with this page, please report it here.