Not interested in reinventing the wheel? Neither am I. Here’s a short list of awesome boilerplates – sometimes called starter kits or seeds – for getting your React applications off the ground in a hurry.
So without further ado…
Application boilerplates for creating React and React-like apps, many of which contain their own starter kit tutorials. And wow are there’re a lot of good ones to choose from.
A toolkit for React, Preact, Inferno & vanilla JS apps, React libraries and other npm modules for the web, with no configuration (until you need it). Has heaps of documentation but will doubtfully get far due to its reliance on Flow.
Meteor is awesome! But after 3 years, it’s starting to show its age. This project is designed to showcase the exact same functionality as Meteor, but without the monolithic structure. It trades a little simplicity for a lot of flexibility.
Create universal React, Preact, Inferno, and Rax applications with no build configuration.
Here’s an example photo sharing application starter I spiked on using an earlier version of this kit when it was still called
And here’s another app using Razzle with MUI, Express and more shared in the comment thread: kireerik/razzle-material-ui-styled-example.
I’ve raised the red flag regarding the lack of SEO in many React Apps, which is why I was super thrilled when Ajay submitted this Docker-ready React/Webpack PWA starter. Not only does it perform automatic image compression using the tools Addy Osmani wrote about only days ago, this puppy outputs responsive images by default. That’s just something you don’t see in most boilerplates where SEO only becomes a priority when it’s all but too late.
Another static site generator for React. Basically it aims to do all the things including image compression so it’s fairly opinionated when it comes to boilerplates. But don’t let that stop you from making a faster Web. Just remember user experience can only be measured by users.
Brands itself as
A slightly opinionated yet dead simple boilerplate for ReactJS and Webpack 2 and was given to me by its author.
Everything you need to build a front-end for a SEO-friendly React website. Supports text-only browsing and focuses heavily on Node.js and the surrounding ecosystem of NPM libraries. For an example isomporhpic application I’ve built using this kit check out lumpenradio-com or my Isomporhpic Rendering with React talk.
One of the common things I hear from individuals getting started with React is that the ecosystem is so complicated it’s difficult to take everything in. That’s why I’m please to see Diego Haz’s ARc (Atomic React) project, which uses a progressive design methodology intended to help individuals start small and work their way forward by incorporating new features one by one. Great job Diego!
It’s refreshing to see a new use case for a boilerplate. This boilerplate gets you set-up to build a VR website with React and Aframe. Check out the mobile demo and start building the next Pokémon Go. Be super slick to see something like this paired with Whitestorm.
I wanted to spike on a simple game of 5x5 Tic-Tac-Toe recently and was able to use this kit to build out the game board using functional stateless components, and without having to yank out tons of boilerplate. It had just the things I needed to start building, and nothing more.
Finally, a simple starter kit for scalable apps. Includes a Slush template generator, CLI code generators, a rig for use of CSS modules with SASS, and includes Airbnb linters and Mocha for testing (though I’ve been preferring standard these days over ESLint as there’s less to maintain). Also includes some GraphQL goodies,
re-select for Redux state queries, server-side rendering, Webpack code chunking and lazy-loaded routes.
There’s a TS flavor of Ryan's work now as well, and the previous repo is no longer being maintained.
By former colleague (and one hell of a coder) this kit is designed to get you up and running with a bunch of awesome new front-end technologies. It can be a bit heavy for those new to React, and doesn’t have the benefits of isomorphic rendering, but there’s plenty of info to take away from studying David’s coding wizardry.
Very popular boilerplate from Max Stoiber considered by some to have the best organizational pattern. From the documentation, “A highly scalable, offline-first foundation with the best developer experience and a focus on performance and best practices.” I haven’t personally tried this seed yet but it’s got enough umph behind it to make it worth bringing to your attention.
React Slingshot is a comprehensive starter kit for rapid application development using React. Includes React + Redux starter kit with Babel, hot reloading, testing, linting and a working example app, all built in.
Inspired by Relay, combines the benefits of React and Firebase by allowing each component to specify its own data dependency. Forget about your data persistence and focus on what really matters, your application’s state.
Electron application boilerplate based on react, react-router, webpack, react-hot-loader for rapid application development
Configured starter repo to build web apps with React and ES6 modules using JSPM. Not actively maintained, though the author is still accepting pull requests.
Application boilerplates for creating React Native applications. If you’re just starting out, consider starting your app from scratch using
react-native init and leveraging the following boilerplates for ideas until you get the hang of things. Otherwise, find your favorite and plunge right in!
The unfair starting CLI, Generator, and more for React Native cross-platform apps. I looked over this and, though I haven’t used it yet for a project, it has one of my favorite developer affordances: Generators and is easy to set-up. It also takes a different approach from most boilerplates in that you do not have to fork the repo. Just generate it from the base! Also, GantMan is receptive to feedback and publishing docs to help on the Web. That’s awesome.
A well-constructed open source starter for React Native iOS and Android projects jam packed with lots of tasty ingredients, inspired by Snowflake. Uses ImmutableJS like Snowflake, Redux and leverages the semi-official NavigationExperimental for routing. Also includes a bash script to help rename your application after your clone, fork or mirror.
A React Native starter kit for iOS and Android given to us by the affable Barton Hammond. Includes all sorts of goodies, including Redux, Jest, Istanbul, Parse integration (planned to be replaced with Serverless) and more. Includes video tutorials for set-up with Bitrise and more. Uses react-native-router-flux for routing.
The official F8 app of 2016. Provides tutorials to help get started on makeitopen.com covering how they used React Native, Redux, Relay, GraphQL, and more. Also includes Microsoft CodePush for app updates without going through the app stores.