Getting started with react in 4 minutes

Welcome to this tutorial where I will teach you how to get started with react. I will assume that you have no prior knowledge about react so this tutorial will be very simple.
The first ting we need to do is to setup our project. For that we will use a tool called create-react-app. It is developed by facebook to make our lifes easier when creating react applications. You need to run this command in order to setup your project:
npx create-react-app my-appThis will setup your project in a folder called my-app. Below is the folder structure of this folder.
my-app
├── README.md
├── node_modules
├── package.json
├── .gitignore
├── public
│ ├── favicon.ico
│ ├── index.html
│ └── manifest.json
└── src
├── App.css
├── App.js
├── App.test.js
├── index.css
├── index.js
├── logo.svg
└── registerServiceWorker.jsAs you can see create react app has setup everything for us. The public folder is where you are going to upload your statics to and in the src folder you will have all of the source code. Now let’s run two commands to start our webserver for development.
cd my-app
yarn startThis will open a new tab in your browser where you should see an image similar to this one

Now let’s edit the App.js file to change “Welcome to React” to “Welcome to slugin.io” and save your changes.
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h1 className="App-title">Welcome to slugin.io</h1>
</header>
<p className="App-intro">
To get started, edit <code>src/App.js</code> and save to reload.
</p>
</div>You should now see that your browser has automatically been updated with the new text. How awesome is that?
We have setup everything we need to get started with creating react applications. You can now conquere the world! With “some” practice.
