SYNOPSIS OF LAB ORIENTED PROJECT (LoP)

ON

iNotes - Note Taking Website

submitted in partial fulfilment of the requirements for the award of degree of

BACHELOR OF ENGINEERING

In

COMPUTER SCIENCE AND ENGINEERING

Submitted by: Supervised By:

Vikas <Name of the Mentor/Team Lead/Manager>

2110992493 <Designation>

<Organization>

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

CHITKARA UNIVERSITY

CHANDIGARH-PATIALA NATIONAL HIGHWAY, RAJPURA, PUNJAB, INDIA

1
 CONTENTS

Title Page No.

1. Abstract 4

2. Methodology 5

3. Tools and Technologies 6

Introduction:
2
In the realm of modern education and professional work, effective note management is essential
for productivity. iNotes is designed to be a one-stop solution for all note-taking needs. Whether
you're organizing study materials, preparing for meetings, or simply brainstorming ideas, iNotes
provides a convenient and secure platform to store and manage your notes.

With features like rich text editing, image insertion, and notebook categorization, iNotes allows
users to organize their notes efficiently. The ability to switch between light and dark modes
provides comfort during long hours of work. Security is a top priority, with user authentication
mechanisms ensuring that your data remains private and protected.

Key Features of iNotes:

 User Registration and Authentication: Users can sign up or log in using their credentials.
Authentication ensures that notes are securely stored and accessible only by the owner.

 Note-taking Interface: A rich text editor provides options for formatting, making it easy
to create well-organized notes. Users can insert images to enhance the visual appeal of
their notes.

 Light/Dark Mode: For enhanced usability, users can switch between light and dark
themes, improving readability based on their environment.

 Note Management: Users can create, view, update, and delete notes easily. Multiple
notebooks can be created to separate notes by topics or subjects.

By integrating modern web technologies and providing a seamless user experience, iNotes aims
to become a powerful tool for students and professionals alike, helping them stay organized,
productive, and efficient.

Abstract:

3
In the modern educational and professional landscape, the need for an efficient and versatile note-
taking system has become increasingly important. iNotes is a comprehensive web application
designed to cater to this need by providing users with a streamlined, efficient, and secure platform
for creating, managing, and organizing their notes. Unlike traditional note-taking, which often
requires physical notebooks, iNotes allows users to create multiple virtual notebooks for different
subjects or topics, enhancing productivity and organization whether at school, work, or home.
The iNotes platform supports user registration and authentication, ensuring secure access to
personal data. With its rich text editor, users can format their notes, insert images, and switch
between light and dark modes for visual comfort. The note management system allows users to
create, update, view, and delete notes seamlessly, while the secure backend infrastructure ensures
data integrity.

4
Methodology:

The development of iNotes followed an agile methodology, allowing for continuous feedback
and iterative improvements at every stage. The primary phases of development include:

 Requirement Gathering: A thorough analysis of the current problems faced by students

and professionals in organizing notes was conducted. Based on these insights, the core
features of iNotes were defined: user authentication, note management, and user-friendly
interaction.

 Design: Wireframes and mockups were created to visualize the user interface, ensuring a
responsive and intuitive design. The focus was on simplicity and accessibility, allowing
users from all backgrounds to navigate the application easily. Special attention was given
to making the interface responsive across various screen sizes, from desktops to mobile
devices.

 Development:

o Frontend: The frontend of iNotes was developed using React.js, chosen for its
component-based architecture, which allows for efficient state management and
reusable UI components. Users can interact with features such as note creation,
editing, and formatting through an intuitive, visually appealing interface.

o Backend: The backend architecture is built on Node.js and Express.js, providing a

robust and scalable environment for server-side logic. MySQL was used for
database management, offering structured data storage for user details and their
notes.

o Authentication and Authorization: To ensure data security, JWT (JSON Web

Tokens) were implemented, allowing users to securely log in and access their
notes. Each user’s data is segregated and protected from unauthorized access.

5
3. Tools and Technologies:

The development of iNotes leveraged modern web technologies to provide a seamless user
experience. The tools and technologies used include:

Frontend:

 HTML, CSS, JavaScript: The foundational technologies used for building the structure,
styling, and interactivity of the web application.

 React.js: A popular JavaScript library for building user interfaces. It provides a

component-based architecture that promotes code reuse and makes state management
efficient.

 React Router: Used for client-side routing, enabling smooth navigation across different
sections of the application without reloading the page.

Backend:

 Node.js: A JavaScript runtime used for executing server-side code, providing a

lightweight and scalable framework for the backend.

 Express.js: A minimalist web framework used for creating APIs and managing backend
operations efficiently.

 MySQL: A relational database used to store user data and notes, ensuring data integrity
and scalability.

Authentication:

 JWT (JSON Web Tokens): Used for secure authentication and authorization. JWT
ensures that users can log in securely and access their personal data without interference
from unauthorized users.

Development Tools:

6
 VS Code: A code editor used for writing, debugging, and managing the project’s source
code.

 Git and GitHub: Used for version control, allowing for efficient tracking of changes and
collaboration between developers.