Introduction to create-react-app

create-react-app is the easiest way to start a React application

create-react-appIt is a project designed to familiarize you with React immediately. It provides a ready-made React application launcher, so you can build your own applications without thinking about Webpack and Babel configuration.

It provides out-of-the-box features:

  • Development server with hot reload
  • Provide test environment with Jest
  • Allow building React applications
  • Prepare to use ES6+ syntax
  • Bundle all your JavaScript and assets
  • With CSS automatic prefix, SASS and CSS module support
  • And more!

You first usenpx, This is an easy way to download and execute Node.js commands without installation.npxWithnpm(Starting from version 5.2), if npm has not been installed, please download from is installed with Node).

If you are not sure which version you are using, we recommend that you check if you need to update.

Tip: Check out my terminal tutorial at the following location you are not familiar

When you runnpx create-react-app <app-name>,npxwilldownloadrecentcreate-react-appRelease it, run it, and then delete it from the system. This is great because your system will never have an outdated version, and every time you run it, you can get the latest and greatest code.

let us begin:

npx create-react-app todolist

This is when it finished running:

create-react-appCreated a file structure in the folder you told (todolistIn this case) and initialized aGitdatabase.

It's still inpackage.jsonFile, so you can start the application immediately by entering the folder and runningnpm start.

In additionnpm start,create-react-appSome other commands have been added:

  • npm run build: Build React application files in the following locationsbuildFolder, ready to be deployed to the server
  • npm test: Use the following command to run the test suitejoke
  • npm eject: From pop upcreate-react-app

Ejection is a decisioncreate-react-appEnough has been done for you, but what you want to do is beyond its allowable scope.

sincecreate-react-appIt is a set of common denominator conventions and a limited number of options, which can guarantee that your needs will require some unique things at some point, and these things have exceededcreate-react-app.

When it pops up, you will lose the ability to update automatically, but inTower of BabelwithWebpackConfiguration.

When ejected, the action is irreversible. You will get 2 new folders in the application directory,configwithscripts. These contain all the configurations you need, and now you can start editing them.

Download mine for freeResponse Handbook

More response tutorials: