From the course: React: Cloud-Powered Apps with Firebase

Generating a new React application

From the course: React: Cloud-Powered Apps with Firebase

Start my 1-month free trial

Generating a new React application

- [Instructor] The starting point for this course will be a React Application that has already been generated for you. But here, I want to show you how you can do that yourself. We can generate a brand new React Application using the Create React App Tool chain, which sets up they develop an environment so that we can use the latest JavaScript features. In addition to providing a great development experience, it will make it much easier for us to take care of common tasks, such as live-editing CSS and JS in development and optimizing the output for production. Let's head to our terminal and generate a brand new application. We can do that using NPX, Create React App, and then the name of the application. If you haven't used NPX before, it's simply a package runner tool that comes with MPM, starting from version 5.2. It will allow us to run, Create React App without installing it globally on our machine. Let's go ahead and run it now. This will fetch a tool, create a directory and files, initialize a repository and install the required tools and packages. Great, that is now complete. I will now change directories into my new application and open that up using visual studio code. Heading over to the package.json file, we see that we are given four simple commands. NPM start, to start the development server, NPM run build, to build and bundle the app for production. NPM tests, to run your tests and NPM run eject to get access to the configuration files. An option that you wouldn't really need as a tool is already great. Also, this course we'll assume you are using React version 16, so please ensure that you are using this as well. We'll be working with React Hooks, so we will need at least version 16.8. Let's go ahead now and run NPM start. We can open up a new terminal window and run NPM start. We will see our development service start and we now have a React Application running.

Contents