Take a Note

A minimalistic notes app created using MERN stack

About • Chrome-extension • Installation • Database • Deployment • Author • License

Checkout the demo below:

About

A full stack MERN app made for creating, storing and deleting notes like any Notes-App. Built an extensive backend API with Node.js & Express and integrated the React frontend to work with the API in the backend.

Technologies Used

• React
• Node.js
• Express.js
• MongoDB
• Heroku

Chrome extension

A chrome extension for the same app is built in the chrome-extension branch. To enable the extension on your device follow the steps given here.

Checkout the demo below:

Installation and Setup

• Download the code for the app here.
• Install dependencies and run the app on local server.

# Install dependencies for server
npm install

# Install dependencies for client
npm run client-install

# Run the client & server with concurrrently 
npm run dev

• The App will be running on localhost:8000 and the client site at localhost:3000

Database

MongoDB is currently at localhost:27017. To connect a MongoDB-Atlas cluster with the app for database, follow the steps given at this page. After obtaining the connection string, replace the 'url' as given below:

cd api/config/db-url

# insert your username and password to get access to the database
url: mongodb+srv://username:password@cluster0-yo0nm.mongodb.net/NoteDB

Deployment

The app is made deployment-ready for Heroku by adding some specific elements.

• Database connected to MongoDB-Atlas cluster.
• CreateProcfile to declare process types.
• Built static assets for the client site by adding 'heroku-postbuild' to scripts in package.json.

  "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install -prefix client && npm run build -prefix client"

Author

• Sakshi Lajurkar - Initial work - SakshiLajurkar

License

The MIT Licence (MIT)

Copyright (c) 2020 Sakshi Lajurkar