From the course: MERN Essential Training (2020)

Install Node and React

From the course: MERN Essential Training (2020)

Start my 1-month free trial

Install Node and React

- [Instructor] So let's go ahead and install the main component that will allow us to build a full stack application. And then generate our first React application. So let's go to nodejs.org and then all you need to do is download the LTS version or the current version whichever version you feel comfortable with. So basically, the LTS version is the one that has long term support. The current version has the latest and the greatest features, but it's not as supported as this version here. So for safety precautions, I'm going to use the LTS version, but feel free to use this one. So I'm going to click here to download the file. And in theory, it should download the file for your operating system. If it doesn't, you can click on other downloads, and then find your operating system, and install the proper version. So once you have that open, you can go ahead and run the installer. And once you have it installed, you should be good to go. So the next step we need to go inside of our terminal, but I like to get started with VS code now. So I'm going to go into VS code, and what I'm going to do now is first create a folder on the desktop that will contain both my back end and my front end. So the first thing we need to do is create that particular folder on the desktop. So I'm going to go ahead and do a right-click, and then create a new folder that I'm going to call "Soccer". And then I'm going to drag and drop that folder inside of VS code. Like so. And now we're going to have the soccer main directory where we're going to have the back end and then the front end. So what I'd like to do is first create a folder that I will call this "backend". And then we'll create the front end as a React application. So let's go ahead and do that. So I'm going to bring up the terminal, so click on terminal, new terminal. And then the terminal will be already in the main directory, which is the Soccer directory. And what I'm going to do is use a command that you may not be familiar with. So, typically, what we do is do an npm install create react app, and then I would have it locally inside of my system, and then I would create the application. What I'd like to use is a command that is fairly efficient for saving space inside of your system. So it's called npx, and that will basically grab the files from the Create React repository, create the new application, and then clean that up. So I'm not going to have Create React app or react 16 dot, or whatever the version is at this point, inside of my system at all times. So it's only going to use it temporarily, to create my new application. So, let's go ahead and do that. So, let's do npx create-react-app, and then name the app. So, in this case this is going to be the front end, because it's going to create a brand new folder inside of the soccer directory, where the front end application is going to be. So let's go ahead and do that. And now it's going to fetch Create React app, create my new application, and then, clean that directory with Create React app. So this is a command that is really useful when you don't want to have anything installed globally, for example, Angular, React, or anything in your system. Okay, so now we have our back end folder, which is empty for now, but we'll start working on it in the following videos. And now we have also our front end that has been created through React. And we don't have the globally installed Create React app because we've used the command npx. So now we have a clean install of a front end application and then we'll work on the back end application next. So let's move on.

Contents