More Premium Hugo Themes Premium React Themes

Registration Login And CRUD Action Using MERN Stack

:high_brightness: :leaves: Nodejs(Express.js) + mongoDB + mongoose + JWT + react.js + material-ui + axios(API call)

Registration Login And CRUD Action Using MERN Stack

:high_brightness: :leaves: Nodejs(Express.js) + mongoDB + mongoose + JWT + react.js + material-ui + axios(API call)

Author Avatar Theme by fsojitra
Github Stars Github Stars: 164
Last Commit Last Commit: Oct 23, 2023 -
First Commit Created: Jan 15, 2024 -
Registration Login And CRUD Action Using MERN Stack screenshot

Overview:

This is a simple example of a user registration, login, and CRUD (Create, Read, Update, Delete) app using the MERN stack. It demonstrates how to use the backend REST API with MongoDB, Node.js (Express.js), and Mongoose for authentication using JWT token. The frontend is built using React.js and Material-UI. The app includes features like pagination, printing or downloading product details, and searching for products.

Features:

  • Backend API for user registration and login
  • API for adding, editing, and updating user products
  • Pagination for the list of user’s added products
  • JWT token authentication
  • Print PDF option for product details
  • Frontend components and form for user login and registration
  • Functionality to add, edit, delete, and paginate products
  • HTTP calls using Axios
  • Multipart API with image upload support

Installation:

To set up the project, you need to have the following prerequisites installed:

  • Node.js
  • NPM
  • MongoDB
  1. Clone or download the repository.
  2. Navigate to the backend directory in the cloned repository.
cd Registration-and-Login-using-MERN-stack/backend
  1. Install the dependencies.
npm install
  1. Navigate to the frontend directory in the cloned repository.
cd Registration-and-Login-using-MERN-stack/frontend
  1. Install the dependencies.
npm install

To run the project:

  • To run the Node.js server, navigate to the backend directory and run the following command:
cd Registration-and-Login-using-MERN-stack/backend
node server.js
  • To run the React frontend, navigate to the frontend directory and run the following command:
cd Registration-and-Login-using-MERN-stack/frontend
npm start

Summary:

This project is a demonstration of a MERN stack application that includes user registration, login, and CRUD functionality. It showcases the use of different technologies such as MongoDB, Node.js, React.js, Material-UI, and Axios for making HTTP calls. The project also utilizes JWT token authentication and offers features like pagination, printing or downloading product details, and searching for products.