🧱 A Full-Stack Note-Taking Application Built with the MERN Stack
Take notes, edit them, delete them — all from a clean and responsive UI. Perfect for learning full-stack development from backend APIs to frontend components.
- ✅ Create, Update, and Delete Notes — with a title and description
- ✅ REST API — Fully functional and beginner-friendly
- ✅ Rate Limiting — Using Upstash Redis for enhanced API security
- ✅ Responsive UI — Works on mobile, tablet, and desktop
- ✅ MERN Stack — MongoDB, Express.js, React, Node.js
- ✅ Educational Focus — HTTP methods, status codes, SQL vs NoSQL explained
- ✅ Deployment Guide — Easily host your own version
Layer | Tech |
---|---|
Frontend | React, Tailwind CSS |
Backend | Node.js, Express.js |
Database | MongoDB (NoSQL) |
Caching & Rate Limiting | Upstash Redis |
Hosting | Render, Vercel, or Netlify (Frontend) |
- Clone the repository and navigate to the backend folder:
cd backend
- Install dependencies:
npm install
- Create a
bash.env
file with your MongoDB connection string and Redis URL:MONGO_URI=your_mongodb_connection_string UPSTASH_REDIS_REST_URL="your_upstash_redis_url" UPSTASH_REDIS_REST_TOKEN="your_upstash_redis_rest_token" PORT=5000
- Start the backend server:
npm start
- Navigate to the frontend folder:
cd frontend
- Install dependencies:
npm install
- Start the React development server:
npm run dev