nextjs-express-mongoose-crudify-boilerplate icon indicating copy to clipboard operation
nextjs-express-mongoose-crudify-boilerplate copied to clipboard

Next.js (React) + Redux + Express REST API + MongoDB + Mongoose-Crudify boilerplate

Next.js (React) + Redux + Express REST API + MongoDB + Mongoose-Crudify boilerplate

Note: this is my v1 boilerplate for React web apps. See also my Firebase and React Hooks boilerplate, GraphQL + Postgres SQL boilerplate, and Redux + REST + Postgres SQL boilerplate.

This template is based on nextjs-express-boilerplate, but with added mongoose-crudify and redux-api.

Support this project

Did you or your company find nextjs-express-mongoose-crudify-boilerplate useful? Please consider giving a small donation, it helps me spend more time on open-source projects:

Support Tom on Ko-Fi.com

Why is this awesome?

This is a great starting point for a any project where you want React + Redux (with server-side rendering, powered by Next.js) as frontend and Express/MongoDB as a REST API backend. Lightning fast, all JavaScript.

  • Simple REST API routes with MongoDB database and mongoose-crudify.
  • Redux REST support with redux-api and next-redux-wrapper.
  • Flexible client-side routing with next-routes (see server/routes.js).
  • Flexible configuration with config/config.js and .env file.
  • Hot reloading with nodemon.
  • Testing with Jasmine.
  • Code formatting and linting with StandardJS.
  • JWT authentication for client-server communication (coming).

Demo

See nextjs-express-mongoose-crudify-boilerplate running on Heroku here.

nextjs-express-mongoose-crudify-boilerplate demo on Heroku

Don’t want Redux?

This project now uses Redux and redux-api. See the no-redux branch for the (unmaintained) version without Redux.

How to use

Clone this repository:

git clone https://github.com/tomsoderlund/nextjs-express-mongoose-crudify-boilerplate.git [MY_APP]

Install dependencies:

cd [MY_APP]
yarn  # or npm install

Start it by doing the following:

export MONGODB_URI=*your mongodb url* // you can get one for free at https://www.mlab.com/home
yarn dev

In production:

yarn build
yarn start

If you navigate to http://localhost:3001/ you will see a Next.js page with a list of kittens (or an empty list if you haven't added one).

You have your API server running at http://localhost:3001/api/kittens

Deploying

Deploying on Heroku

heroku create [MY_APP]
heroku addons:add mongolab
git push heroku master

Deploying on Now

See instructions on nextjs-express-boilerplate.