Install create-react-app

The standard way to create react applications is with the create-react-app npm package:
npm install -g create-react-app

Creating the application

Once you have the create-react-app module installed, you can create your standard react application skeleton as follows:
npx create-react-app my-app

Common React CLI commands

Start the development server:
npm start

Bundle the app into static files for production:
npm run build

Start the test runner:
npm test

Clearing npx cache:
npx clear-npx-cache

react-scripts vulnerability

The npm audit for the front end React framework is not accurate because react-scripts is used during the build of the project, but is not included in the production build of the code, so it is not a true vulnerability and should be omitted from the audit. This is done by moving react-scripts to devDependencies in the package.json file:
"devDependencies": {
"react-scripts": "5.0.1"
},

Then when you audit the module, you should omit the dev dependencies:
npm audit --omit=dev

Reference: https://github.com/facebook/create-react-app/issues/11174

HTML

class to className

HTML properties become camelCase. Ex. maxlength to maxLength

Numbers must be in curly braces. Ex. maxLength = {13}

If conditions must be done outside of JSX, but ternary expressions are allowed. Ex. {(x) < 10 ? "Hello" : "Goodbye"}

In-Line CSS Styles must be objects. Ex. style={{color: "red"}}

Bundling

JSX is our source code.

Babel converts JSX to JavaScript.

WebPack merges all our our code into a single bundle.js file.