Mern Boilerplate
Full stack boilerplate with React, Redux, Express, Mongoose, Passport Local, JWT, Facebook and Google OAuth out of the box.
Overview:
The MERN Boilerplate is a full stack boilerplate that includes React, Redux, Express, Mongoose, and Passport. It aims to streamline the development process by providing a pre-configured setup for building apps with these technologies. With features like user models with 1:N relation, CRUD REST API operations, authentication with local email/password, Facebook and Google OAuth, and JWT protected APIs, the MERN Boilerplate offers a comprehensive solution for developing web applications. It also includes features like database seed, image upload, layout components, and protected routes. The MERN Boilerplate is easy to install and comes with instructions for both development and production deployment.
Features:
- Server: User and Message models with 1:N relation.
- CRUD API: Full CRUD REST API operations for both Message and User models.
- Passport authentication: Supports local email/password, Facebook, and Google OAuth strategies, and JWT protected APIs.
- NodeJS server: Unified with React client using Babel for new JS syntax.
- async/await syntax: Used across the whole app for improved code readability.
- Joi server-side validation: Validates user input for improved data integrity.
- Image upload: Supports image upload using Multer.
- React client: Includes functional components and Hooks.
- Redux state management: Uses Thunk for async actions.
- CSS agnostic: Allows for easy customization of the CSS framework.
- Protected routes: Supports different views for unauthenticated, authenticated, and admin users.
- Edit/Delete forms: Integrated with Formik and Yup validation.
- Admin privileges: Allows admins to edit and delete users and their messages.
- Layout component: Provides a consistent layout throughout the app.
- Express
Express.js is a simple Node.js framework for single, multi-page, and hybrid web applications.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Fullstack
A fullstack boilerplate provides a starter application that includes both frontend and backend. It should include database, auth, payments, user roles and other backend services to build a fully featured saas or webapps.
- Redux
Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.
