Online Notes Manager

Web Application

Project Details

Project Information

Project Title: Online Notes Manager

Category: Web Application

Semester: Spring 2025

Course: CS619

Complexity: Easy

Project Description

Online Notes Manager

Project Domain / Category

Web Programming

Abstract / Introduction

Taking and managing notes efficiently is essential for students and professionals alike. The Online Notes Manager is a web-based application that allows users to create, edit, and delete notes from any device with internet access while ensuring flexibility in usage with or without login.

The project features a front-end built using HTML, CSS, and JavaScript, ensuring a simple and responsive user interface. The back-end is developed using Python, Flask and SQLite, handling user authentication, secure note storage, and CRUD (Create, Read, Update, Delete) operations.

For guest users (without login), notes are stored in the local storage of the browser or device. The system automatically retrieves stored notes on each visit, and drafts are auto-saved every 5 seconds to prevent data loss. For Authenticated users (which are logged-in), notes are securely stored in an SQLite database, and any locally stored notes are automatically synced upon login, ensuring seamless access across devices.

Users can categorize their notes, search within them, and set reminders for important tasks. This project offers a lightweight yet effective alternative to traditional note-taking applications, integrating local storage and cloud-based persistence to enhance accessibility and reliability.

Functional Requirements

1)     Guest Mode (Without Login)

a.      Users can create, edit, and delete notes, which are stored in the browser's local storage.

b.      Upon revisiting the application, it automatically retrieves and displays stored notes.

c.      Notes are automatically saved every 5 seconds while the user is typing. Prevents data loss in case of accidental closure or refresh.

d.      If a user logs in later, the system will:

i.      Sync local notes to the database.

ii.      Merge local notes with cloud-stored notes, avoiding duplicates.

2)     User Authentication (With Login)

a.      Users can register an account using a unique username and password.

b.      The system provides secure login/logout functionality.

c.      Passwords are hashed before being stored in the database to enhance security.

3)     Notes Management (For Logged-In Users)

a.      Users can create, edit, and delete notes, which are stored in an SQLite database.

b.      Notes can be categorized into different groups (e.g., Work, Personal, Study, Miscellaneous).

c.      A search functionality is provided to allow users to quickly find notes by:

i.      Title

ii.      Content

 

4)     Syncing Local and Cloud Notes

a.      When a user logs in, the system automatically:

i.      Checks for locally stored notes.

ii.      Syncs local notes with cloud-stored notes, ensuring continuity.

b.      After syncing, the application displays both local and cloud-stored notes together for a unified experience.

5)     Enhancements

a.      Pin Important Notes Users can mark specific notes as “pinned” to keep them at the

top of the list.

b.      Reminder Feature – Users can set reminders for important notes with a specific date and time.

c.      Download Notes Users can export and download notes as a .txt file for offline access.

Tools:

1.  Front-End (User Interface)

·         HTML, CSS For structuring and styling the web pages.

·         JavaScript For handling local storage, auto-saving, and syncing functionality.

·         Local Storage API (JavaScript) To store notes locally when a user is not logged in.

2.  Back-End (Server & Database)

·         Python: The primary programming language for back-end development.

·         Flask: A python web framework for handling user authentication, and database operations.

·         SQLite: The database for storing notes and data.

3.  Authentication & Security

·         Flask-Login An extension for Flask framework. It will be used to manage user sessions (login/logout).

·         Werkzeug A utility library for Python which will be used for password hashing to store credentials securely.

 

Supervisor:

Name: Muhammad Ilyas

Email ID: muhammad.ilyas@vu.edu.pk

Skype ID: live:.cid.813fc730d8c19cf8

 

Languages

  • HTML, CSS, JavaScript, Python Language

Tools

  • Flask, SQLite, Flask-Login, Werkzeug Tool

Project Schedules

Assignment #
Title
Start Date
End Date
Sample File
1
SRS Document
Friday 2, May, 2025 12:00AM
Thursday 22, May, 2025 12:00AM
2
Design Document
Friday 23, May, 2025 12:00AM
Tuesday 29, July, 2025 12:00AM
3
Prototype Phase
Wednesday 30, July, 2025 12:00AM
Friday 12, September, 2025 12:00AM
4
Final Deliverable
Saturday 13, September, 2025 12:00AM
Monday 3, November, 2025 12:00AM

Viva Review Submission

Review Information
Supervisor Behavior

Student Viva Reviews

No reviews available for this project.