A note taking web application.
To the site!
- ReactJS
- CSS modules
- Firebase/firestore
- Firebase/auth
- CKEditor
- User can add a note by clicking on a primary button "Add Note" or a "+" icon button which will open a textbox where we can add texts. And a "Save" button that will save the note.
- User can delete and edit a note
- User can filter notes by tags added to the note
- User can filter the notes by priority. Priorities would be high, medium, low
- User can sort the notes by the date added/created.
- User can see various color containers (div) where if I click on any one of it. It will change the background color of the note.
- User can see the input text area beside the "Add Note" component where we can add tags.
- User can trash/archive a note. User can also untrash/unarchive a note.
- Signup
- Login
- Logout
- clone the repository on your local machine with the command below in your terminal, and cd into the melonn folder
git clone https://github.com/partha8/melonn.git
cd melonn
- install dependencies (if you are using yarn then do with that)
npm install
- Install firebase in the local directory.
- You'll also need to setup a project in firebase and setup firebase.config file in src folder.
- The config file will look like this
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import { getAuth } from "firebase/auth";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
const firebaseConfig = {
apiKey: "",
authDomain: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: "",
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const db = getFirestore();
const auth = getAuth();
export { app, db, auth };
- start the server
npm start
Special thanks to my team members (team D3) for reviewing this project!