React Full Stack App Boilerplate

This project aims to help beginners to get started on a full stack app with React, Redux, Express and MongoDB

Getting Started

Prerequisites

• yarn or npm
• node
• mocha

Installing

yarn
cd client && yarn

Running the app locally

First, you need to connect your own database using mLab.

Then modify the object in ./server/config.js :

{
    'port': process.env.PORT || 3000,
    'database': process.env.MY_DATABASE_LINK,
    'jwt': {
        'secret': 'my_secret_key'
    }
}

WARNING : The database link does include your username and password, your link must be an environment variable !

SECOND WARNING : Your jwt secret key should be an environment variable too ! This is used for your authentication. For more explanations, go here.

yarn dev

Open a second terminal window and execute this command :

cd client && yarn start

Running the tests

For now, just the backend has been partially tested.

yarn test

Technologies and frameworks used

• Create React App
• Redux
• React
• React Router
• Bootstrap
• Express
• Mongoose
• Font Awesome

How to ...

... Add a flash message

import { flash } from './client/src/';

flash('This is a flash message');

By default, it displays a Bootstrap success alert. But you can give a second parameter to the function to customize the alert.

flash('Fatal Error', 'danger');
flash('You must be logged to acces that page', 'warning');

... Add a reducer

Create your reducer in ./client/src/reducers then in ./client/src/index.js import your reducer and modify this line :

const rootReducer = combineReducers({auth, messages, errors, /* ADD YOUR REDUCER HERE */});