DashMaster - MERN Admin Dashboard

Welcome to DashMaster! This project showcases a fully functional admin dashboard built using the MERN stack. We utilize Material UI, Material UI Data Grid, Nivo Charts, Redux Toolkit, and Redux Toolkit Query for the frontend, and Node JS, Express JS, Mongoose, and MongoDB for the backend. Additionally, we cover data modeling using Entity Relationship Diagrams and making aggregate calls in MongoDB.

Table of Contents

• Features
• Technologies Used
• Prerequisites
• Installation
• Usage
• Links
• License

Features

• Admin Dashboard: A comprehensive admin panel to manage data.
• Data Visualization: Interactive charts and graphs using Nivo Charts.
• Data Grid: Efficient data management with Material UI Data Grid.
• State Management: Seamless state management with Redux Toolkit and Redux Toolkit Query.
• Backend Integration: Robust backend setup with Node JS, Express JS, and MongoDB.
• Data Modeling: Learn to model data using Entity Relationship Diagrams.
• Aggregate Calls: Perform advanced data queries with MongoDB aggregate.

Technologies Used

Frontend

• React
• Material UI
• Material UI Data Grid
• Nivo Charts
• Redux Toolkit
• Redux Toolkit Query
• React Router
• React Date Picker

Backend

• Node JS
• Express JS
• Mongoose
• MongoDB

Prerequisites

Ensure you have the following installed:

• Node JS
• NPX
• VSCode
• Nodemon
• MongoDB

Installation

1. Clone the repository:

   git clone https://github.com/yourusername/dashmaster.git
   cd dashmaster

2. Install dependencies for both frontend and backend:

   cd frontend
   npm install
   cd ../backend
   npm install

3. Set up environment variables:

   Create a .env file in the backend directory and add the following:

   MONGO_URI=your_mongodb_uri
   JWT_SECRET=your_jwt_secret

Usage

1. Start the backend server:

   cd backend
   npm run dev

2. Start the frontend development server:

   cd frontend
   npm start

3. Open your browser and navigate to http://localhost:3000 to view the admin dashboard.

Links

• Node JS
• NPX
• VSCode
• Nodemon
• Nivo
• Material UI
• Material UI Data Grid
• React Router
• React Date Picker
• Redux Toolkit
• Redux Toolkit Query
• Dotenv
• JsonWebToken
• Google Fonts
• Render
• Railway
• MongoDB
• Mongoose
• MongoDB Aggregate

License

This project is licensed under the MIT License - see the LICENSE file for details.