Viz-panel ---- Reactjs CRM dashboard

Mange your invoices , payments , taxes and many advanced feature with modern reactjs library .

📷 Screenshots

🚀 Demo

Click here to see demo

⚙️ Tech Stack ( Frontend )

• Reactjs is a free and open-source front-end JavaScript library that aims to make building user interfaces based on components more "seamless"

• React Router is a library that provides routing capabilities for React applications.React Router is the standard routing library for React applications. It enables you to: Create multiple pages in your single-page application.

• Tanstack/React-Query is a library for providing the missing data-fetching library for web applications, but in more technical terms, it makes fetching, caching, synchronizing and updating server state in your web applications a breeze.

• React Hook Form for simplifying form handling in React apps, making it efficient and less complex. It leverages React Hooks for state management, validation, and form submission, offering key benefits like minimal re-renders, smooth performance, and easy integration with UI libraries.

• MUI is an open-source React Components library that is based on Google's Material Design and provides the predefined UI components for React

• Styled Components React Styled-component Module allows us to write CSS within JavaScript in a very modular and reusable way in React. Instead of having one global CSS file for a React project, we can use styled-component to enhance the developer experience

✨ Features

👉 Authentication: Secure user auth with user and email based on Json web token .

👉 Modern Tech Stack: Built with latest reactjs version for a fast, production-ready web app.

👉 Database Integration: Using mongodb for managing data .

👉 ** Respovive Design **: Fully responsive design for all sceens and devices .

🛠️ Installation

Clone the project

 https://github.com/YasinMahmoudi/reactjs-crm-dashboard.git

Go to the project directory

  cd reactjs-crm-dashboard

Now you have 2 directories : client & server Install the project dependencies using pnpm for each part by navigating to each directory .

  cd client 
  npm install

  &&

  cd server
  npm install

Set Up Environment Variables for your project based on .env.example

Start the client :

  npm run dev

Start the nodejs server :

  npm start