A starter project with React, Babel, and Webpack.
This starter is as minimal as possible while still including Babel and Webpack.
git clone git@github.com:ahfarmer/minimal-react-starter.git
npm install
-
node server.js -
Open http://localhost:3000/.
Starter projects can be difficult for beginners to use because of all the moving pieces. To help you understand this starter project, there is a 7-step walkthrough showing how to create it from scratch.
The primary purpose of this project is learning.
For learning, a minimal starter project is best. Too many dependencies can cause confusion for a beginner. The process of selecting and adding what you need to a minimal project can be a good way to learn.
Babel and Webpack are the two tools that I view as completely essential in a React project.
There are no other tools that I have used consistently in every single React project that I have built, no matter how large or how small.
Babel: Even if you are just writing a quick test, you will likely want to use JSX in your components rather than writing out React.createElement over and over.
Webpack: Webpack serves as both the web server and the JavaScript bundler. The only alternative to using a bundler would be to include a <script> tag for each of your .js files, and that gets messy very quickly, even in a simple project.
- No CSS. For experiments or tests, put your styles in
index.htmlin a<style>tag. For real projects, pick from these style tools. - No Flux. If you need it - try Redux or MobX!
- Webpack is run with the
expressandwebpack-dev-middleware. - The 'content base' is set to
www. Any files in that directory will be served by express.
HMR is not supported in the master branch for simplicity. If you would like HMR support, you can see the changes that add HMR support or you can directly clone the HMR branch:
git clone -b hmr git@github.com:ahfarmer/minimal-react-starter.git