In order to bootstrap a fresh instance of reactor up, they suggest using and.
So essentially we won't need to install their Cielito on our machine, which is a setup they had before.
And as a side note, that's why our NPM version needs to be at least five point two cents.
We do want to use and be X..
So while we're still on a subject, their previous setup was that we had to install the Cielito the
Create React app globally.
How now they switch to NPCs and they're also suggesting that if you have already installed the creator
act globally.
So, for example, maybe you're watching some other tutorial and you already installed create react
app globally.
I suggest that you uninstall it.
So you need to run this command, the NPM install and then G create react app to uninstall the Sellitto,
because that way it ensures that Northparkes users always the latest version.
Now I already did that, so I'm good to go.
And we're only looking for Scarman now.
You can grab the whole thing.
That just means that your app will be called my app.
In my case, I'll just copy and create React app.
So I'm going to navigate back.
And by the way, if you want to check, what is your AMPM version?
Same as with Noad, we just run AMPM and then the dash version.
And of course I can see that I have six point twelve.
Now at this point I would want to navigate to a desktop Weichsel online copy and paste my command and
once I have command in place, I just need to come up with a name of my folder and in my case I'm going
to go with the trail and you'll see how the Create React app starts bootstrapping your react application.
Now, it does take a little bit of time, so I will stop the video and I'll resume it once all the dependencies
are in place and thus create react app is done installing all dependencies and essentially setting up
a ready to go react application we can see in the terminal.
Then we have quite a few commands that we can use.
Now, again, as we're progressing with tutorial, don't worry, we will cover other ones as well.
But for the time being, the one that we really need is the and RPM start, which starts the development
server.
Now, let me tell you right away that there are two places where you can run the commands.
So essentially start up the dev server or build the production ready application or for example, install
the dependency and an extra dependency, for example, react icon.
And these two places are following where I can run all my commands in the terminal.
However, I just need to make sure that of course, I'm located in my folder.
So, for example, in this case I would need to navigate tutorial and then I can run, for example,
command of NPM start.
And the other place is going to be our text error.
Now I'm going to run my commands in text error in the integrated terminal.
The reason why I'm showing her this is that once in a while, some students who use windows have complained
that unfortunately, when they run their commands and the integrated terminal in the Visual Studio code,
they're getting some issues.
So just keep in mind, you don't have to run your commands and integrate eternal.
Now, of course, I will do that throughout the course because I'm not having any issues once I do that.
However, if you do, just remember that you can always set them up in your terminal as well.
So in my case, I'm going to drag and drop my application.
And then all right away, set up side by side a browser, because that's just how I prefer while I'm
developing.
So this is going to be a fresh instance of the browser and this is going to be our project.
Now, don't worry.
In the next video, we'll take a closer look of what is our folder structure and what essentially we
can find in the fresh instance of creating app horror for now.
I would just want to speed up my dev server.
So like I said, I would open up the integrated terminal with Control and Tilde and then we run an RPM
and then start and run localhost three thousand.
We're going to get a brand new instance of our application.
So essentially we'll see what create RIAB created for us.
Now you see that we have some logo, we have some text.
And like I said in the next video, we'll take a closer look at the folder structure.
But for the time being, I would just want to showcase that the way the Dirceu works is each and every
time we'll make some change, if there is no error, will automatically get the latest version of Harrap
right away in the browser.
So, for example, if I change the text in the app and again, you don't have to do that, but I'll
change the text from the paragraph to a hello world.
So whatever I have over here, I'll just change the whole world and you'll see the moment I save, I
ride our way, get the latest version of my hand in the browser.
So I'll create react app.
Does this cool thing of heart reloading or essentially every time we'll make some changes unless we
have some bugs, meaning some errors, then it right away restarts the application for us.