Day 3 of #100daysofcode

We’ll continue learning about reacting from egghead today. We learned how to use the createElement API in React, how to render that element, and how to get react and react-dom from a service call unpkg the day before. We’ll be changing the code from yesterday’s post. :

Today we’ll go over the reacts jsx syntax.

While using React’s createElement to create an element is acceptable, using react’s jsx syntax may be more convenient. In our JavaScript code, the jsx syntax of React is similar to that of HTML.

First we will comment this :

Following the commenting, we will write our jsx code, which will be :

If you reload your page, you will not see anything like “hello world” because the above code is jsx and the browser does not understand it; it must be compiled into something like the code above it, for which we will use babel. Babel is a JS compiler.

We will use this to include babel in our code :

This will also need to be changed :

The code will look like this after each and every changes :

And the code should be functional.

That’s all there is to toady.