Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/himalayasingh3/full-stack-notes-manager
Introducing my Notes Manager built with the MERN stack! This application allows users to create, and organize notes seamlessly. With a user-friendly interface and real-time updates, you can easily manage your thoughts and tasks. Perfect for students and professionals looking to enhance productivity and stay organized!
https://github.com/himalayasingh3/full-stack-notes-manager
expressjs mongodb mui nodejs reactjs tailwindcss
Last synced: about 1 month ago
JSON representation
Introducing my Notes Manager built with the MERN stack! This application allows users to create, and organize notes seamlessly. With a user-friendly interface and real-time updates, you can easily manage your thoughts and tasks. Perfect for students and professionals looking to enhance productivity and stay organized!
- Host: GitHub
- URL: https://github.com/himalayasingh3/full-stack-notes-manager
- Owner: HimalayaSingh3
- Created: 2024-10-12T12:15:42.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2024-10-16T09:48:56.000Z (3 months ago)
- Last Synced: 2024-10-18T06:51:40.870Z (3 months ago)
- Topics: expressjs, mongodb, mui, nodejs, reactjs, tailwindcss
- Language: JavaScript
- Homepage: https://full-stack-notes-manager.vercel.app
- Size: 2.86 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# MERN Stack Notes Manager App
## Overview
This repository contains a Notes Manager application built using the MERN stack (MongoDB, Express.js, React, Node.js). The application allows users to create, read, update, and delete notes efficiently. It features user authentication and a clean, intuitive interface for managing notes.
## Table of Contents
- [Features](#features)
- [Technologies Used](#technologies-used)
- [Installation](#installation)
- [Usage](#usage)
- [Folder Structure](#folder-structure)
- [API Endpoints](#api-endpoints)
- [Contributing](#contributing)
- [License](#license)## Features
- Create, read, update, and delete notes
- Responsive design for mobile and desktop
- User-specific notes management## Technologies Used
- **MongoDB**: NoSQL database for storing notes and user data.
- **Express.js**: Web framework for building the server-side application.
- **React**: Frontend library for creating a dynamic user interface.
- **Node.js**: JavaScript runtime for executing server-side code.
- **Mongoose**: ODM library for MongoDB and Node.js.
- **Axios**: Promise-based HTTP client for making requests from React to the API.
- **JWT (JSON Web Tokens)**: For secure user authentication.## Installation
To set up the Notes Manager application locally, follow these steps:
1. **Clone the repository**:
```bash
git clone https://github.com/HimalayaSingh3/Full-Stack-Notes-Manager.git
cd Full-Stack-Notes-Manager
```2. **Install server dependencies**:
```bash
cd server
npm install
```3. **Install client dependencies**:
```bash
cd ../client
npm install
```4. **Set up environment variables**:
Create a `.env` file in the `server` directory and add your MongoDB connection string:
```
MONGODB_URI=your_mongodb_connection_string
```5. **Start the Backend**:
```bash
cd Backend
node server.js
```6. **Start the Frontend**:
Open a new terminal window and run:
```bash
cd Frontend
npm run dev
```Your application should now be running on `http://localhost:3000`.
## Usage
Once the application is running:
1. Navigate to `http://localhost:3000` in your web browser.
2. Sign up for a new account or log in with an existing account.
3. Start creating, editing, and managing your notes!## Folder Structure
```plaintext
mern-notes-manager/
├── client/ # React frontend code
│ ├── src/
│ │ ├── components/ # React components (e.g., NoteList, NoteForm)
│ │ ├── pages/ # Page components (e.g., HomePage)
│ │ ├── App.js # Main app component
│ │ └── index.js # Entry point for React app
├── server/ # Node.js backend code
│ ├── models/ # Mongoose models (e.g., User, Note)
│ ├── routes/ # Express routes (e.g., authRoutes, noteRoutes)
│ ├── controllers/ # Controller functions for handling requests
│ ├── middleware/ # Middleware for authentication and error handling
│ ├── config/ # Configuration files (e.g., database connection)
│ └── server.js # Entry point for Node.js server
└── README.md # This README file
```## API Endpoints
Here are some of the key API endpoints available in this application:
| Method | Endpoint | Description |
|--------|------------------------|---------------------------------|
| POST | `/api/auth/signup` | Register a new user |
| POST | `/api/auth/login` | Log in an existing user |
| GET | `/api/notes` | Get all notes for logged-in user|
| GET | `/api/notes/:id` | Get note by ID |
| POST | `/api/notes` | Create a new note |
| PUT | `/api/notes/:id` | Update note by ID |
| DELETE | `/api/notes/:id` | Delete note by ID |## Contributing
Contributions are welcome! If you have suggestions or improvements, please create a pull request or open an issue.
1. Fork the repository.
2. Create your feature branch (`git checkout -b feature/AmazingFeature`).
3. Commit your changes (`git commit -m 'Add some AmazingFeature'`).
4. Push to the branch (`git push origin feature/AmazingFeature`).
5. Open a pull request.## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
---
Feel free to customize this README according to your specific project needs!