Beautiful, minimal note-taking app built with the MERN stack (MongoDB, Express, React, Node). SandNotes is a simple, fast, and deployable app for creating, reading, updating and deleting notes. It includes basic rate-limiting, a clean React + Vite frontend, and a small Express backend with MongoDB.
- Create, view, edit, and delete notes
- Modern React frontend using Vite and Tailwind CSS
- Express + Node backend with MongoDB for persistence
- Rate limiting middleware to protect APIs from abuse
- Simple, minimal UI components and utility helpers
- Frontend: React, Vite, Tailwind CSS, Axios
- Backend: Node.js, Express
- Database: MongoDB (Mongoose)
- Dev tools: ESLint, PostCSS, Vite
Top-level layout:
-
backend/- Express server, controllers, models, and middlewaresrc/server.js- App entrysrc/routes/noteRoute.js- API routessrc/controllers/notesController.js- Notes CRUD logicsrc/models/Note.js- Mongoose schema for notessrc/middleware/rateLimiter.js- Rate limiting middlewaresrc/config/db.js- MongoDB connection helpersrc/config/upstash.js- (optional) Upstash rate-limit backing store
-
frontend/- React app created with Vitesrc/main.jsx- Frontend entrysrc/App.jsx- Top-level app and routessrc/pages/- Page components (Home, Create, NoteDetail)src/components/- Re-usable UI componentssrc/lib/axios.js- pre-configured Axios instance
Follow these steps to run the project locally (Windows; adapt commands for macOS/Linux):
# 1. Clone the repo
git clone https://github.com/Sandanu06/SandNotes.git
cd SandNotes# 2. Backend setup
cd backend
npm install
# Create a .env file in backend/ and add the environment variables described below.
# Start the server (development)
npm run dev
# The backend listens on the port defined in process.env.PORT (default 5000).# 3. Frontend setup (in a new terminal)
cd frontend
npm install
npm run dev
# The frontend runs with Vite (default http://localhost:5173).Create a .env in backend/ with the following keys (example names):
MONGO_URI- MongoDB connection string (required)PORT- Port for the Express server (optional, default 5000)RATE_LIMIT_WINDOW- Rate limit window size in minutes/seconds depending on implementationRATE_LIMIT_MAX- Max number of requests per window- Any Upstash/Redis variables if using the
upstash.jsconfig
Keep .env out of version control. Add it to .gitignore if not already present.
Base URL: http://localhost:5000 (or your configured PORT)
- GET /api/notes - List all notes
- POST /api/notes - Create a note
- GET /api/notes/:id - Get a single note by id
- PUT /api/notes/:id - Update a note
- DELETE /api/notes/:id - Delete a note
Each endpoint responds with JSON. Errors use conventional HTTP status codes and return a message field with details.
Example create request body:
{ "title": "Shopping list", "content": "Milk, Eggs, Bread", "tags": ["personal", "shopping"] }
Note (Mongoose schema) - core fields:
- title: String
- content: String
- tags: [String]
- createdAt: Date (auto)
- updatedAt: Date (auto)
See backend/src/models/Note.js for exact schema.
This project contains a rate limiting middleware (backend/src/middleware/rateLimiter.js). It prevents excessive requests from a single IP and can be backed by Upstash or Redis. Configure limits using environment variables.
No automated tests are included yet. Recommended next steps:
- Add unit tests for controller logic (e.g., Jest + Supertest)
- Add integration tests for API endpoints
- Add E2E tests for the frontend (Cypress or Playwright)
General steps:
- Build frontend: from
frontend/runnpm run build(Vite). - Serve static build with any static hosting (Netlify, Vercel, GitHub Pages) or serve from the backend with Express static middleware.
- Deploy backend to Heroku, Render, Railway, or any cloud provider. Ensure
MONGO_URIand rate-limit environment variables are set.
If you want a single combined deployment, copy the frontend build into backend/public and serve with Express.
Contributions are welcome. Suggested workflow:
- Fork the repo
- Create a feature branch:
git checkout -b feat/your-feature - Make changes & commit
- Push and open a Pull Request describing your change
Please keep changes small and focused. Add tests for new behavior when possible.
This project is open-sourced under the MIT License. Add a LICENSE file to the repo with the MIT text if you want to publish.
- Add authentication (JWT + refresh tokens) for private notes
- Pagination for notes list
- Attachments (images) support
- Improved UX for rate-limited responses (client-side messaging)
If you'd like, I can also open a PR with these README changes or add a CONTRIBUTING.md and LICENSE file.
Thanks for building SandNotes — a focused, minimal notes app. Happy hacking! ✨
