Notes App

Table of Contents

• Key Highlights
  • Tech Stack
• Running the App
  • In Production
  • In Development
• Future Improvements
• Gallery

Key Highlights

• Full-stack app built using the MERN stack (MongoDB, Express, React, and Node.js).
• Notes contain a basic title and content section.
• Allows for creating, editing, deleting notes.
• Created as a learning project.

Tech Stack

Running the App

In Production

1. Install dependencies

   npm run build
   

2. Configure environment variables

   Place the .env file within the backend folder.

   MONGO_URI=<your_mongo_uri>
   PORT=5001
     
   UPSTASH_REDIS_REST_URL=<your_redis_rest_url>
   UPSTASH_REDIS_REST_TOKEN=<your_redis_rest_token>
     
   NODE_ENV=production
   

3. Run the server

   npm run start
   

4. View on browser at http://localhost:5001/

In Development

1. Configure environment variables

   Place the .env file within the backend folder.

   MONGO_URI=<your_mongo_uri>
   PORT=5001
     
   UPSTASH_REDIS_REST_URL=<your_redis_rest_url>
   UPSTASH_REDIS_REST_TOKEN=<your_redis_rest_token>
     
   NODE_ENV=development
   

2. Run the backend

   cd backend
   npm install
   npm run dev
   

3. Run the frontend

   cd frontend
   npm install
   npm run dev
   

4. View on browser at http://localhost:5173/

Future Improvements

• Implement some form of user authentication to allow for safe, live deployment.
• Add other types of information to notes (e.g. tags, priority levels).
• Create a toggle to swap between themes.

Gallery

Notes Page

Note Details Page

Create Note Page