MERN Authentication's Template

An updated MERN/Auth Template.

Introduction • Key Features • TO-DO • How To Use • License

Introduction

This project is a MERN template for building fullstack JavaScript applications. The technology stack is as follows:

• MongoDB as a NoSQL database
• React for the front-end, bootstrapped with "Create React App".
• Express.js for the server
  • Serves the React app
  • Provides the JSON API for the React app using http
• Node.js for the back-end

Key Features

• MERN structured folders
• TailwindCSS setup
• ES7 Airbnb eslint / prettier
• Axios for API fetching
• React-toastify for Toast notification
• React-hook-form for form management
• Yup (frontend & backend)for Forms validation
• @hookform/resolvers to use yup with react-hook-form
• React-router-dom V6, route restrictions: PrivateOutlet & PublicOutlet
• Responsiveness 70%
• Pages: Login, Registration, ForgetPassword, NotFound, Dashboard(empty)
• Authentication using JWT with verification middleman in the serve routes
• React Context for LoggedInUser data and login/logout functions

TO-DO

• Dark/Light mode
• Responsiveness 30%
• Mailing service for user account verification & reset password
• Profile Page ?
• Google / Facebook / Twitter Authentication

How To Use

Use Template

To use this template click Use this template above. see How to create a new repository from a template,

Fork repository

You might fork the repository by clicking the fork button. see Use someone else's project as a starting point for your own idea.

You'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:

# Clone this repository
$ git clone <the created repository name>

# Go into the repository
$ cd <the created repository name>

# Install dependencies
$ npm install

# Run the app
$ npm start

Note Don't forget to change the author and name in your client(frontend) package.json ;)

---

License

MIT