Oh, yeah, it's time to create our first React project now.
I have excellent news for you.
You see, up until now, we've created everything from scratch ourselves.
But you see React is one of the most popular tools out there for a web developer.
So what does that mean?
That means that there's an entire community of developers of really, really smart people that want
to make react, a really good experience, a really good way for you to get started super fast and build
projects, beautiful projects right away.
Let's see how a normal developer would start a React project.
Now we can do what we've been doing up until now, which is to npm install react right.
We create a project folder, we install the React package and we are able to start using it.
But there's something even better than that.
And it's called Create React app.
It's actually on their documentation page for React.
It's a comfortable environment for learning, react and is the best way to start building a new single
page application.
It's the recommended way to start with react.
And we're going to see over the next couple of videos why this is such an awesome tool.
As a matter of fact, it has its own dedicated page, set up a modern web app by running one command.
Sounds pretty nice.
It essentially allows us to install a whole bunch of packages instead of doing npm install a thousand
times instead of sending up our developer environment, setting up our first page.
It does everything for you, and this is created by really, really smart developers that have worked
on React that are on the core React team so that this way, you know you're using the best tools, the
latest tools and using the best practices when creating a React app.
And this gets updated constantly, so you know that you're using the best of the best.
Now, if we go to the documentation, we see that we simply use this command and create React app and
then the name of your app.
So let's copy that.
And let me just explain the command for you now before you might be wondering, what does NPC's NPCs?
We've never seen that before.
I mean, back in the day, what we would do is, say 21:00 Install Dash G, Create, React app, install,
create, React app globally so we can run the Create React app command from our command line.
But doing an npm install DSG is a little messy.
And also, you have that thing where you have to run sudo if you don't have enough access.
Well.
Since 21:00, 5.2 NPCs actually comes out of the box for you.
So, for example, let me just clear this if I do 9pm Dash V, your version should be higher than this.
And if your version is higher than five point two, which trust me, if you're watching this video now
five point two is an old version, you definitely don't have it.
Otherwise, you can always upgrade, so NPCs actually comes out of the box already.
So again, if we copy this oop.
Can use NTPC's, create React app and my app.
Actually, let me cancel that, let's name our project because we want to have a proper project, name
robo friends and I'm going to create the React app.
Now, while this is loading, you can see it's installing React, React, React scripts.
We're going to talk about that later.
For now, you just need to know that NTPC's is a package runner.
I'm going to leave a resource for you in this video that you can read more about NPCs.
Essentially, what it does is it allows us to run this command of ampm installing globally to create
React app without actually having to install something globally.
While we wait for this to download, let's just find out what Ampex is and what is it?
You know, as developers, we're really good at Googling, right?
Oh, there you go.
There's an excellent article.
You have been the no package measure.
The package runner.
So it's a Seelye tool whose purpose is to make it easy to install and manage dependencies hosted in
the npm registry.
So it's now very easy to run any sort of nodes based executable that you would normally install.
Vietnam BPM executable means a package that you can execute.
What does that mean?
Well, it's this thing we can execute, create reactor.
Back in the day, we would have done npm installed DSG create React app.
Well, we can execute this create React app command that we would have been able to execute from here
after doing this now, just by using NPCs, just a simplified way of doing things.
So once that's installed, I then go into my folder and then run npm start.
Sounds pretty easy, right?
Let's go back to a terminal.
You see that everything has installed here.
We have ampm start, ampm run build, ampm test, ampm run, eject that we can use as commands.
Well, we can just run and start, right?
So let's go CD.
Wrobel friends, because we want to go into our new project folder.
If I do else here, check that out.
We already have all these things out of the box created for us by Create React app.
We have a no modules folder rimi package that JSON some public and source files folders.
Again, something we'll go over later on.
For now, let's just do ampm start.
Let's see what happens.
Hey, look at that.
Congratulations, you have your very first React app out of the box.
You didn't really do much.
You just installed Create React app, but there's your first app.
Pretty neat, right?
You now have to set up anything.
Create React app takes care of it for you.
So again, if we go to the career, we act up documentation, you can read more about it here.
But the idea is that the best of the best are creating these tools for reactive helpers so that out
of the box you're going to have limiting tank testing already set up again, things that we'll cover
later on.
In the course, you'll see why create React app is useful more and more as we progress the course.
So don't worry, so we have our app.
What do we do now?
Well, we open up our editor and we start.
Evolving this simple react, tap into what we want into robo friends.
So let's start doing that in the next video.