Today I went reviewed some React that I was having a hard time understanding. I saw they had a step-by-step guide for people who prefer to learn concepts from the ground up. This is what I learned so far:

1. JSX is basically what are in curly brackets {}. For example,
   const name = 'Josh Perez'
   const element =

   Hello, {name}

2. React elements are descriptions of what you want to see on the screen. For example,
   const element = {
   type: 'h1'
   props: {
   className: 'greeting'
   className:'Hello World'
   }
   };

3. render an element into the DOM:
   const element =

   Hello World

   ReactDOM.render(element, document.getElementById('root') The above to me means: create the variable and call it in the ReactDOM.render and specify where you are getting it from in html.

4. React elements are unchangeable and you cannot change the children or the attributes. When you want to update the UI create a new element and pass it to the ReactDOM.render(). React DOM compares the element and its children to the previous one and only applies necessary updates.

5. an example of a valid react component :
   function Welcome(props){
   return

   Hello, {props.name}

   }

I understand it as "

Hello, {props.name}

I reviewed some more but my notes are bit lengthly.

Until next time !