https://github.com/vaibhav-xp/invoisely

This project is a full-stack application utilizing the MERN stack (MongoDB, Express, React, Node.js) along with React Query for data fetching, Tailwind CSS for styling, JWT for secure authentication, and Express Validator for input validation. It features a user management and invoicing system.
https://github.com/vaibhav-xp/invoisely

expressjs html mern-stack nodejs react-query react-taostify reactjs redux

Last synced: 3 months ago
JSON representation

This project is a full-stack application utilizing the MERN stack (MongoDB, Express, React, Node.js) along with React Query for data fetching, Tailwind CSS for styling, JWT for secure authentication, and Express Validator for input validation. It features a user management and invoicing system.

• Host: GitHub
• URL: https://github.com/vaibhav-xp/invoisely
• Owner: vaibhav-xp
• Created: 2024-08-31T15:31:57.000Z (9 months ago)
• Default Branch: master
• Last Pushed: 2024-09-10T16:45:10.000Z (9 months ago)
• Last Synced: 2025-01-21T00:47:07.930Z (4 months ago)
• Topics: expressjs, html, mern-stack, nodejs, react-query, react-taostify, reactjs, redux
• Language: JavaScript
• Homepage: https://invoisely-server.vercel.app
• Size: 89.8 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# MERN Stack with React Query, Tailwind CSS, JWT Token, and Express Validator

This project is a full-stack application utilizing the MERN stack (MongoDB, Express, React, Node.js) along with React Query for data fetching, Tailwind CSS for styling, JWT for secure authentication, and Express Validator for input validation. It features a user management and invoicing system.

## Frontend

### Routes

1. **User Registration**

   - **Path:** `/register`

   - **Description:** User registration page.

2. **User Login**

   - **Path:** `/login`

   - **Description:** User login page.

3. **Home Page**

   - **Path:** `/`

   - **Description:** Home page where the user can add products and view the history of invoices.

4. **Invoice Details**

   - **Path:** `/invoices/:_id`

   - **Description:** Page for viewing and printing a specific invoice.

5. **Log Out**

   - **Path:** Home page button

   - **Description:** Clicking on the logout button will log the user out.

## Backend

### API Endpoints

1. **User Registration**

   - **Path:** `/api/register`

   - **Method:** `POST`

   - **Description:** Endpoint for user registration.

2. **User Login**

   - **Path:** `/api/login`

   - **Method:** `POST`

   - **Description:** Endpoint for user login.

3. **Add Product**

   - **Path:** `/api/products/add`

   - **Method:** `POST`

   - **Description:** Endpoint for adding a product.

4. **View Invoices History**

   - **Path:** `/api/invoices`

   - **Method:** `GET`

   - **Description:** Endpoint for retrieving the history of invoices.

5. **View Invoice Details**

   - **Path:** `/api/invoices/:_id`

   - **Method:** `GET`

   - **Description:** Endpoint for retrieving details of a specific invoice.

### Middleware

1. **Authentication Middleware**

   - **Description:** Middleware to verify JWT token for protected routes.

### Dependencies

- **Express:** Backend web application framework.

- **Express Validator:** Middleware for input validation.

- **JWT (JSON Web Token):** For secure authentication.

- **Mongoose:** MongoDB object modeling tool.

- **bcrypt:** Library for hashing and salting passwords.

### Frontend Technologies

- **React:** JavaScript library for building user interfaces.

- **React Query:** For data fetching and state management.

- **Tailwind CSS:** Utility-first CSS framework.

- **React Toastify:** For displaying toast notifications.

- **axios:** HTTP client for making requests to the backend.

## Backend Setup

1. Install dependencies: `npm install`

2. Create `.env` file and add the variables mentioned in `.env.sample`

3. Run the development server: `npm run dev`

## Frontend Setup

1. Install dependencies: `npm install`

2. Create `.env` file and add the variables mentioned in `.env.sample`

3. Run the development server: `npm run dev`

## Note

- Ensure the backend server is running on the specified port.

- Update API endpoints and paths in the frontend accordingly.