create-react-app and react-scripts

[atlaschiew]

react-scripts is a set of scripts from the create-react-app starter pack. create-react-app helps you kick off projects without configuring, so you do not have to setup your project by yourself.

react-scripts start sets up the development environment and starts a server, as well as hot module reloading. You can read here to see what everything it does for you.

with create-react-app you have following features out of the box.

• React, JSX, ES6, and Flow syntax support.
• Language extras beyond ES6 like the object spread operator.
• Autoprefixed CSS, so you don’t need -webkit- or other prefixes.
• A fast interactive unit test runner with built-in support for coverage reporting.
• A live development server that warns about common mistakes.
• A build script to bundle JS, CSS, and images for production, with hashes and sourcemaps.
• An offline-first service worker and a web app manifest, meeting all the Progressive Web App criteria.
• Hassle-free updates for the above tools with a single dependency.

[atlaschiew]

shortly, react-script configures webpack to use babel on code compilation.

[atlaschiew]

without create-react-app and react-scripts, you can also try to configure them from scratch following this article.

https://javascript.plainenglish.io/webpack-and-babel-setup-with-react-from-scratch-bef0fe2ae3e7

[atlaschiew]

react with js

npx create-react-app cra-js

react with ts

npx create-react-app cra-ts --template typescript