SyncNote

A full-stack cloud-based note-taking application with secure authentication, protected routes, and a modern dashboard. SyncNote allows users to create, edit, delete, and organize notes seamlessly across devices.

---

🚀 Features

• Authentication – Signup/Login with JWT tokens.
• Protected Routes – Only authenticated users can access notes.
• Notes CRUD – Add, edit, delete, and view notes.
• Categories – Organize notes into categories.
• Cloud Storage – MongoDB Atlas ensures persistence.
• Contact Form – Messages stored in DB with backend handling.
• Responsive UI – Built with plain CSS.

---

🛠 Tech Stack

Frontend (client): React (Vite), CSS, Axios
Backend (server): Node.js, Express.js, MongoDB, JWT Authentication
Database: MongoDB Atlas
Deployment: Vercel (frontend), Render/Railway (backend)

---

Project Structure

SyncNote/
│
├── client/
│ ├── public/
│ ├── src/
│ │ ├── assets/
│ │ ├── components/
│ │ ├── App.jsx
│ │ ├── main.jsx
│ │ └── App.css
│ ├── index.html
│ ├── vite.config.js
│ ├── package.json
│ └── vercel.json
│
├── server/
│ ├── controllers/
│ │ ├── authController.js
│ │ ├── contactController.js
│ │ └── noteController.js
│ ├── middleware/
│ │ └── authMiddleware.js
│ ├── models/
│ │ ├── Contact.js
│ │ ├── Note.js
│ │ └── User.js
│ ├── routes/
│ │ ├── authRoute.js
│ │ ├── contactRoutes.js
│ │ └── noteRoute.js
│ ├── app.js
│ ├── package.json
│ └── LICENSE
│
├── .gitignore
└── README.md

---

⚙️ Installation

1. Clone the Repository

git clone https://github.com/your-username/syncnote.git
cd syncnote

2. Project Setup Guide

a. Backend Setup (server)

cd server
npm install

b. .env file setup (server)

MONGO_URI=your_mongodb_atlas_url
JWT_SECRET=your_secret_key
PORT=5000

c. Run backend

nodemon app.js

d. Frontend Setup

npm install

e. Run frontend

npm run dev