boilerplates-and-starter-kits

Suggested Starter Kits for Learners

NOTE: It's easy for someone new to the React/Redux ecosystem to get confused by some of these boilerplates and starter kits. Many of them include dozens of specifically-configured libraries, and it can be hard for a learner to understand how all the pieces fit together. If you're trying to learn React or Redux for the first time, it's suggested that you start with reading tutorials and articles first, until you have a reasonable understanding of how things work. However, if you do want to use a starter kit as a learning tool, I specifically suggest the ones in this section. They are simpler, easier to understand, and well documented. In particular, Create-React-App is highly recommended.

• Create-React-App https://github.com/facebookincubator/create-react-app An "official", no-visible-configuration tool to instantly create a React project with bundling, minification, and basic CSS and image handling all set up and ready to go. If you outgrow the basic features, the underlying tools can be exposed and modified using a one-time "eject" command. It's a great tool to use to when learning React, or just to set up a project quickly.

• Simple Redux Boilerplate https://github.com/tsaiDavid/simple-redux-boilerplate Excellent example. Includes enough to be useful, but not too many dependencies so it's confusing.

• Web-App https://github.com/cesarandreu/web-app Another very good learning resource. Heavily commented Webpack config, good default settings.

• React Laboratory https://github.com/tstringer/react-laboratory An absolute bare-minimum project. One tiny Webpack config, one JS file, one component. Pretty much the smallest possible setup to use React and JSX with Webpack.

• Hipster Boilerplate https://github.com/Jordaanm/hipster-boilerplate A learning-oriented repo that builds up a small project config step-by-step. Each commit adds one new feature or capability (Babel+ES6, Webpack bundling, a small Redux app, LESS styling, routing, and hot-reloading).

Full-Featured Starter Kits

• React-Redux Universal Hot Example https://github.com/erikras/react-redux-universal-hot-example Has the kitchen sink, and more. Popular, but maybe too many things stuffed into one repo.

• React-Redux Starter Kit https://github.com/davezuko/react-redux-starter-kit Generally recommended. Well laid out, good documentation. Worth looking at. Has become significantly more complex over time as well.

• react-boilerplate https://github.com/mxstbr/react-boilerplate A highly scalable, offline-first foundation for your next project with the best DX and a focus on performance and best practices. Excellent documentation.

• React Starter Kit https://github.com/kriasoft/react-starter-kit A full-featured universal/isomorphic starter kit, with good documentation

• React Slingshot https://github.com/coryhouse/react-slingshot A flexible starter kit designed to illustrate best practices.

Specific Concept Demonstrations

• Ultimate Hot-Reloading Example https://github.com/glenjamin/ultimate-hot-reloading-example Demonstrates hot-reloading of pretty much everything, both client-side and server-side

• Universal-JS https://github.com/colinmeinke/universal-js A well-written universal starter with docs explaining choices, and plenty of example tests.

• React + Electron Boilerplate https://github.com/chentsulin/electron-react-boilerplate Electron application boilerplate based on React, Redux, React Router, Webpack, React Transform HMR for rapid application development

• React-Redux-Cesium-Testing Demo https://github.com/markerikson/react-redux-cesium-testing-demo Demonstrates a number of useful bits of project configuration, including offline tests with Mocha+JSDOM, live-reloading tests in the browser using mocha-loader, async loading of React components, use of the Cesium 3D globe library with React and Webpack, and using the Shrinkpack tool to manage dependencies inside the repo. Not intended for production use, but could serve as a useful example.

• React Static Plate https://github.com/webyak/react-static-plate Build static sites with React to host on Amazon S3, Github Pages, Surge, etc. An interesting alternative to other static page generation tools.

Other

• React Starter Project Search Tool http://andrewhfarmer.com/starter-project/ Search for starter kits with/without specific libraries and sort by GitHub stars, number of dependencies, or recently updated.

• Awesome React Boilerplates http://habd.as/awesome-react-boilerplates/ Another good curated list of boilerplates for both React and React Native