A Kinto.js+React project boilerplate.
JavaScript CSS HTML
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Kinto React Boilerplate

A sample Kinto & React project boilerplate.

Build Status


The boilerplate helps you to develop Kinto JavaScript applications faster by making some decisions on your behalf. It includes:

  • React + ES6 classes using Babel;
  • Setup test environment using Mocha+Chai, Sinon, and jsdom for React components;
  • Setup build and packaging using webpack;
  • Basic asynchronous store for collection records 1;
  • Fully tested demo CRUD app with sync button.

We even provide some recipes to help you go further!

1: Replacing it with a Flux library is up to you :)

Getting started


Start a new project and fetch the boilerplate:

$ mkdir newproject && cd $_
$ git init .
$ git remote add boilerplate https://github.com/Kinto/kinto-react-boilerplate.git
$ git fetch boilerplate
$ git merge boilerplate/master

Install the environment and run:

$ npm install
$ npm start

Demo application is available at http://localhost:3000

With auto-refresh when code changes!


Run the tests suite with:

$ npm test
  • Node v4+ is required.
  • A travis.yml file is provided to enable tests on TravisCI in one click!


In order to publish the application on Github pages, you just need to run:

$ npm run publish

After a few minutes, the application will be available at http://username.github.io/project/

If you want to check the content of the build/ folder before publishing, or host it somewhere else yourself, just run instead:

$ npm run build

Get some more

For example, let us setup Less:

$ git merge boilerplate/setup-css-less

Once merged, the dev server will be auto-refreshed when the style.less is modified!

Don't hesitate to help us write more tutorials using simple pull-requests. :)