A React Boilerplate-inspired starter for your styled-components projects
Created by Vincent van der Meulen (@vincentmvdm on Twitter)
- Create React App
- Develop and deploy React applications with ease using Create React App.
- Rebass Components
- Jump start your styled-components project with a set of essential and customizable components.
- Redux State Management
- Manage your application state with Redux and react-redux.
- Redux-Synced Routing
- Power your app with react-router routing while keeping your application state up-to-date.
- Asynchronous Action Dispatch
- Wait for functions to finish before dispatching new actions.
- Redux-Synced Forms and Form Validation
- Enable communication between your forms and Redux while getting access to features such as synchronous form validation.
- Redux Logging
- Monitor your application state with Redux Logger and stay in the know.
- SEO
- Make your websites easier to find and a pleasure to use with React Helmet
The folder structure is based on react-boilerplate's, which in turn is based on How To Scale React Applications and Presentational and Container Components.
Asynchronous action dispatch is essential, but Redux Saga is complex and takes a while to learn. Redux Thunk takes at most 30 minutes to learn and set up.
Rebass provides only the essential components you would create yourself anyway. It enables the use of an 8pt grid and customization is easy thanks to styled-components.
Synchronizing your form and Redux state is useful. Redux Form makes that and (synchronous) form validation easy.
- Clone this repository:
git clone https://github.com/vincentmvdm/rebass-boilerplate.git - Navigate to the directory:
cd rebass-boilerplate - Install packages:
yarn installornpm install - Start:
yarn startornpm start
The majority of code is blatantly copied from react-boilerplate and every package's respective documentation. Thanks to Max Stoiber for creating styled-components and react-boilerplate. Thanks to Brent Jackson for making Rebass.