<h2>Prerequisites</h2>



<p>There are a few things you should know in advance before you start playing around with React.</p>



<p>Here are what I consider to be React prerequisites.</p>



<ul><li>Basic familiarity with HTML &amp; CSS.</li><li>Basic knowledge of JavaScript and programming.</li><li>Basic understanding of the <a rel="noreferrer noopener" aria-label="DOM (opens in a new tab)" href="https://www.w3schools.com/js/js_htmldom.asp" target="_blank">DOM</a>.</li><li>Familiarity with ES6 syntax and features.</li><li><a href="http://ec2-13-127-91-65.ap-south-1.compute.amazonaws.com/how-to-install-and-manage-node-js-via-nvm/">Node.js and npm</a> installed globally.</li></ul>



<h2>Setup and Installation</h2>



<p><strong><em>npx create-react-app</em></strong> is the command to setup and install a react app. Its a built in package comes with nodejs. Run the below command to create a react app. It will take some time, wait for it to complete the setup.</p>



<pre class="wp-block-code"><code>npx create-react-app react-app</code></pre>



<p>Here <strong><em>react-app</em></strong> is the folder name in which react config &amp; setup files will be created by react to run a react-app.</p>



<div class="wp-block-image"><figure class="aligncenter size-large"><img src="http://ec2-13-127-91-65.ap-south-1.compute.amazonaws.com/wp-content/uploads/2020/03/Screenshot-from-2020-03-01-14-19-45-1024x575.png" alt="" class="wp-image-676"/></figure></div>



<div class="wp-block-image"><figure class="aligncenter size-large"><img src="http://ec2-13-127-91-65.ap-south-1.compute.amazonaws.com/wp-content/uploads/2020/03/Screenshot-from-2020-03-01-14-19-55-1024x575.png" alt="" class="wp-image-677"/></figure></div>



<p>Go to newly created app and run the below command to run the app.</p>



<pre class="wp-block-code"><code>cd react-app
npm start</code></pre>



<p><strong><em>npm start</em></strong> will run your react app.</p>



<div class="wp-block-image"><figure class="aligncenter size-large"><img src="http://ec2-13-127-91-65.ap-south-1.compute.amazonaws.com/wp-content/uploads/2020/03/Screenshot-from-2020-03-01-14-22-32-1024x575.png" alt="" class="wp-image-678"/></figure></div>



<p>Now, Edit <strong><em>src/App.js</em></strong> and save to view the effect.</p>



<p>Feel free to leave a comment for any questions and issues.</p>

Prerequisites



There are a few things you should know in advance before you start playing around with React.



Here are what I consider to be ...

Getting Started with React