I needed a ready-to-go template for building React web applications. I built this template to meet that need. Note that the Javascript ecosystem is quite chaotic; there is not necessarily a right way to do anything.
React documentation: https://facebook.github.io/react/
Caveat utilitor.
Note:
Set up the development environment:
# Assume node and npm are already installed.
# Assume package.json exists.
npm install babel-cli babel-polyfill babel-core babel-loader babel-preset-env babel-preset-react webpack lite-server --save-dev
mkdir public src
# Inside package.json...
"scripts": {
"dev": "lite-server"
},- node
-
Javascript runtime. (https://nodejs.org/en/)
- npm
-
Javascript package manager. (https://www.npmjs.com/)
- babel
-
Used to transpile all Javascript code; compilation, linting, minification, codemods, code coverage, etc. (http://babeljs.io/)
- webpack
-
Asset bundling. (https://webpack.js.org/)
- lite-server
-
Basic web server with Browser Sync. (https://www.npmjs.com/package/lite-server)
- public/
-
The public web server directory.
- server/
-
The web application server.
- src/
-
The web application client source code.
- package.json
-
Npm package description. (Manually set name, version, description, license, private, and scripts.)
- .babelrc
-
Babel configuration. (Use presets es2015 and react.)
- webpack.config.js
-
Webpack configuration.
- bs-config.js
-
Browser Sync configuration for lite-server.