TRIBHUVAN UNIVERSITY

INSTITUTE OF ENGINEERING

KATHMANDU ENGINEERING COLLEGE

DEPARTMENT OF COMPUTER ENGINEERING

PROJECT REPORT
ON
STUDYNOTION
[CODE NO: CT 755]
BY:
ANURAG JHA (BCT76015)
ARBIN CHAND (BCT76017)
ARJIN JOSHI (BCT76019)
KUSHAL BANSAL (BCT76036)

KATHMANDU, NEPAL
2080
 TRIBHUVAN UNIVERSITY
INSTITUTE OF ENGINEERING
KATHMANDU ENGINEERING COLLEGE

DEPARTMENT OF COMPUTER ENGINEERING

STUDYNOTION

[CODE NO: CT755]

PROJECT REPORT SUBMITTED TO

THE DEPARTMENT OF COMPUTER ENGINEERING
IN PARTIAL FULFILLMENT OF THE REQUIREMENTS FOR
THE BACHELOR OF ENGINEERING

BY

ANURAG JHA (BCT76015)

ARBIN CHAND (BCT76017)
ARJIN JOSHI (BCT76019)
KUSHAL BANSAL (BCT76036)

KATHMANDU, NEPAL
FALGUN 2080
TRIBHUVAN UNIVERSITY
KATHMANDU ENGINEERING COLLEGE
DEPARTMENT OF COMPUTER ENGINEERING
ii
 TRIBHUVAN UNIVERSITY
INSTITUTE OF ENGINEERING
Kathmandu Engineering College
Department of Computer Engineering

CERTIFICATE

The undersigned certify that they have read and recommended to the Department of
Computer Engineering, a major project work entitled “StudyNotion” submitted by
(Anurag Jha-76015, Arbin Chand-76017, Arjin Joshi-76019, Kushal Bansal-76036) in
the partial fulfillment of the requirements for the Degree of Computer Engineering.

Asst. Prof. Er. Loknath Regmi Er. Sharad Chandra Joshi

(External Examiner) (Project Supervisor and

Department of Electronics and Project Co-ordinator)

Computer Engineering Department of Computer Engineering
Institute of Engineering Kathmandu Engineering College

Pulchowk Campus

Er. Sudeep Shakya

(Head of Department)

Department of Computer Engineering

Kathmandu Engineering College

iii
 ACKNOWLEDGEMENT

First of all, we would like to acknowledge our deep sense of gratitude to Institute of
Engineering for including this major project in our course, as this has been very helpful
for us to obtain proper insights on the development of software, web applications and
micro-frontends. Similarly, we are very thankful to the Department of Computer
Engineering, Kathmandu Engineering College (Kalimati) for guiding us throughout this
project.

We are highly indebted to our respected supervisor and major project coordinator as
well as our year coordinator Er. Sharad Chandra Joshi who has been overseeing our
project and documentation with his expertise about how a project must be developed
and helping us with all the necessary details and supervision he has provided us so far.
Also, we extend a special thanks to Er. Sudeep Shakya, Head of Computer
Department. We can’t thank the teachers of Kathmandu Engineering College
Department of Computer Engineering enough for providing us with the invaluable
supervision and necessary information for the successful completion of the project.

We are highly obliged to express our thanks towards our parents and friends for their
kind support, co-operation and encouragement which has helped us a lot throughout
our project.

iv
 ABSTRACT

The educational technology is one of the major sectors which has expanded over the
years post the Covid-19 pandemic outbreak. As it was difficult to attend physical
classes for the students the education shifted to distance learning utilizing the
educational technology applications. Though there are plenty of applications that are
being used currently for information and educational content teaching and learning,
there is a niche and that is coding, science, technology, engineering and mathematics
education, besides there are also subjects which do require extensive attention and
dedication from the students. In context of attending the online class the students may
venture into other tabs or applications leading to the decrease in effectiveness of
instructor also students may just join the class and leave their screen which are few
challenges we prefer to solve. Moreover, with the abilities of various frameworks a
more complete web application for teaching and learning was required. Also, students
learn better when they do peer to peer study, the peer-to-peer group study was
integrated where the students can collaborate and learn together. The data security and
authentication were given much priority and frameworks such as React, Node and
Express were used to make this application use of Mongodb as the database helps it in
terms of scalability. Thus, this project serves as both a collaboration application and
teacher to student learning platform.

Keywords: educational technology, framework, scalability, data security,

authentication, collaboration.

v
 TABLE OF CONTENTS

ACKNOWLEDGEMENT iv

ABSTRACT v

TABLE OF CONTENTS vi

LIST OF FIGURES viii

LIST OF ABBREVIATIONS ix

CHAPTER 1: INTRODUCTION 1

1.1 BACKGROUND THEORY 1

1.2 PROBLEM STATEMENT 5
1.3 OBJECTIVES 6
1.4 SCOPE AND APPLICATIONS 6
CHAPTER 2: LITERATURE REVIEW 7

2.1 EXISTING SYSTEMS IN NEPAL & WORLDWIDE 9

2.1.1 MERO.SCHOOL 9
2.1.2 UNACADEMY 9
2.1.3 COURSERA 10
2.1.4 EDX 10
2.1.5 UPGRAD 10
2.1.6 UDEMY 11
2.2 LIMITATIONS OF PREVIOUS SYSTEMS 11
2.3 PROBLEMS SOLVED BY OUR SYSTEM 11
CHAPTER 3: METHODOLOGY 13

3.1 PROCESS MODEL 13

3.1.1 INCREMENTAL MODEL 14
3.2 SYSTEM ARCHITECTURE 15
3.2.1 FRONTEND 16
3.2.2 BACKEND 17
3.2.3 DATA MODELS AND DATABASE SCHEMA 19
3.2.4 API DESIGN: 19
3.3 FLOWCHART 20

vi
 3.3.1 FLOWCHART FOR STUDENT 20
3.3.2 FLOWCHART FOR TEACHER 21
3.3.3 FLOWCHART FOR ADMIN 22
3.4 UML USE CASE DIAGRAM 23
3.5 ENTITY RELATIONSHIP DIAGRAM 25
3.6 DATA FLOW DIAGRAM 27
3.7 TOOLS USED 28
3.7.1 NODE.JS 28
3.7.2 MONGODB 29
3.7.3 EXPRESS.JS 30
3.7.4 JWT (JSON WEB TOKENS) 31
3.7.5 BCRYPT 33
3.7.6 MONGOOSE 34
3.7.7 REACTJS 35
3.7.8.FIGMA 36
3.7.9. POSTMAN 38
3.8 VERIFICATION AND VALIDATION 38
4. EPILOGUE 41

4.1 RESULT AND DISCUSSIONS 41

4.1.1 USER-FRIENDLY INTERFACE 41
4.1.2 RESPONSIVE AND ACCESSIBLE DESIGN 41
4.1.3 ENGAGING CONTENT DELIVERY 41
4.1.4 COLLABORATIVE TOOLS 42
4.1.5 ROBUST INSTRUCTOR TOOLS 43
4.1.6 API INTEGRATION 43
4.1.7 SCALABLE AND SCHEMA-FREE DATABASE 45
4.1.8 IDE 46
4.2 CONCLUSION 46
4.3 FUTURE ENHANCEMENTS 47
REFERENCES 48

BIBLIOGRAPHY 49

SCREENSHOTS 50

vii
 LIST OF FIGURES

Figure 3.1.1: Block Diagram of Incremental Process Model ....................................14

Figure 3.2: System Architecture diagram……………...........................................15
Figure 3.3.1: Flowchart (Students)……....................................................................20
Figure 3.3.2: Flowchart (Teacher)…….....................................................................21
Figure 3.3.2: Flowchart (Admin)……......................................................................22
Figure 3.4: UML Use Case diagram ......................................................................23
Figure 3.5: Entity Relationship diagram………………….……………………...25
Figure 3.6.1: DFD Level 0…………….…………………………………………...27
Figure 3.6.2: DFD Level 1…………….…………………………………………...27
Figure 4.1.3: View of the multimedia content i.e video lecture content...................41
Figure 4.1.4: (a) Easy buying/ cart layout…............................................................42
Figure 4.1.4: (b) Integrated Razorpay payment system...........................................42
Figure 4.1.4: (c) Student's progress tracking............................................................43
Figure 4.1.6: (a) Denied backend category creation while using Postman………..43
Figure 4.1.6: (b) The admin login success from backend API using Postman..........44
Figure 4.1.6: (c) The admin login allowed updating content...................................44
Figure 4.1.7: Schema-free database using MongoDB..............................................45

viii
 LIST OF ABBREVIATIONS

API: Application Programming Interface

AR: Augmented Reality

DOM: Document Object Model

Ed-tech: Educational Technology

HIP: High Impact Educational Practices

HTTP: Hyper Text Transfer Protocol

IDE: Integrated Development Environment

JS: Java Script

JSON: JavaScript Object Notation

JWT: Java Web Token

LMS: Learning Management Systems

MERN: MongoDB, Express.Js, React.Js, Node.Js

MOOCs: Massive Open Online Courses

NPM: Node Package Manager

ODM: Object Data Modelling

OTP: One-Time Password

REST: Representational State Transfer

UI: User-Interface

URL: Uniform Resource Locator

VR: Virtual Reality

ix
 CHAPTER 1: INTRODUCTION

1.1 BACKGROUND THEORY

The emergence of educational technology (Ed-Tech) has revolutionized the field of

education by leveraging technological advancements to enhance learning experiences.
EdTech applications are designed to address the challenges faced by traditional
educational systems and provide innovative solutions that improve access, engagement,
and outcomes for learners. By leveraging cloud-based platforms, integrated tools, and
personalized learning approaches, these applications aim to transform the way students
acquire knowledge and interact with educational content.

The educational technology (EdTech) market has experienced remarkable growth in

recent years, with a projected global market size of over $404 billion by 2025. This
growth has been fueled by various factors, including the increased adoption of digital
learning tools and platforms, the surge in remote learning during the COVID-19
pandemic, and the growing recognition of the positive impact of technology on
education.

The COVID-19 pandemic acted as a catalyst for the rapid adoption of EdTech solutions,
as educational institutions had to quickly transition to remote learning models. This
sudden shift emphasized the importance of digital tools and platforms in ensuring the
continuity of education. McKinsey & Company reported a significant twentyfold
increase in the usage of educational technology during the pandemic, highlighting the
critical role it played in enabling remote instruction, collaboration, and assessment.

Research studies have consistently shown the positive impact of EdTech on learning
outcomes. For example, personalized learning software has been found to enhance
student performance in subjects such as mathematics. These software programs adapt
to individual student needs, providing targeted instruction, immediate feedback, and
personalized learning paths. This tailored approach helps students grasp difficult
concepts more effectively and improve their academic performance.

Mobile learning has also emerged as a significant trend in EdTech. With the ubiquity
of smartphones and tablets, learners can access educational content anytime and

1
anywhere. The global mobile learning market has witnessed substantial growth, with a
projected value of $70.4 billion by 2020. Mobile learning offers flexibility,
convenience, and personalized learning experiences, enabling learners to engage with
educational content at their own pace and in their preferred environment.

Adaptive learning technologies have gained traction for their ability to customize the
learning experience to the individual needs and preferences of learners. These
technologies leverage data analytics and artificial intelligence to analyze learner
behavior, performance, and learning styles. By providing personalized
recommendations, adaptive learning platforms empower learners to focus on their areas
of weakness, reinforce their strengths, and progress at a pace that suits them best.
Numerous studies have shown that adaptive learning leads to increased engagement,
motivation, and academic achievement.

Another notable trend in the EdTech market is the adoption of virtual reality (VR) and
augmented reality (AR) technologies. These immersive technologies offer unique
learning experiences by creating virtual environments or overlaying digital content onto
the real world. VR and AR enable students to explore virtual simulations, conduct
virtual experiments, and interact with three-dimensional models, enhancing their
understanding and retention of complex concepts. The global market for VR in
education is projected to reach $6 billion by 2022, indicating the growing interest in
these technologies for educational purposes.

Overall, the growing market and trends in educational technology demonstrate the
increasing recognition of the value that technology brings to education. EdTech has the
potential to enhance access, engagement, and outcomes for learners by providing
personalized learning experiences, facilitating remote instruction, and leveraging
immersive technologies. As technology continues to advance, the EdTech landscape is
expected to evolve further, revolutionizing the way education is delivered and
experienced.

Educational technology (EdTech) has ushered in a new era of learning, reaching and
impacting millions of students worldwide. The scale of student engagement with
EdTech is vast and continually expanding, revolutionizing education across various
levels and contexts.

2
Massive Open Online Courses (MOOCs) have emerged as a prominent form of EdTech,
providing learners with access to a wide range of courses from leading universities and
institutions. Platforms like Coursera, edX, and Udemy have attracted millions of
students globally, enabling them to pursue learning opportunities that were previously
inaccessible. These platforms offer diverse subjects, including computer science,
business, humanities, and more, empowering learners to acquire new skills and
knowledge at their own pace.

Learning Management Systems (LMS) have become integral tools for educational
institutions, facilitating the management and delivery of digital courses. LMS platforms
such as Canvas, Moodle, and Blackboard are widely adopted, serving as central hubs
for students and educators to access course materials, submit assignments, engage in
discussions, and receive feedback. These systems have transformed the traditional
classroom experience, enabling students to engage with content and interact with
instructors and peers in virtual learning environments.

Virtual schools and online programs have witnessed significant growth, providing
flexible and accessible education options for K-12 students. These programs cater to
students with various needs, including those seeking an alternative to traditional brick-
and-mortar schools, students in remote areas, and those requiring specialized education.
Virtual schools offer comprehensive curricula, interactive lessons, and support services,
allowing students to learn from the comfort of their homes while maintaining a
structured educational experience.

The proliferation of mobile devices has led to the rise of mobile learning, transforming
education into a portable and personalized experience. Educational apps and platforms
have made learning accessible anytime, anywhere, catering to learners of all ages.
Mobile learning apps provide a wide range of educational content, interactive exercises,
and personalized learning experiences. Students can access educational resources,
engage in practice exercises, and receive instant feedback, enhancing their
understanding and retention of concepts. The convenience and ubiquity of mobile
devices have democratized access to education, bridging gaps in digital literacy and
expanding learning opportunities for students worldwide.

3
In higher education, online courses and digital resources have revolutionized the
learning landscape. Students can pursue degrees or certifications remotely, allowing
them to balance education with other commitments. The flexibility offered by online
education has attracted a growing number of students, enabling them to access high-
quality instruction from renowned institutions. Online courses provide interactive
multimedia content, discussion forums, and collaborative projects, fostering an
engaging and immersive learning experience. Additionally, digital resources, such as
e-books, research databases, and virtual laboratories, augment traditional learning
materials, expanding students' access to a wealth of information and research
opportunities.

The widespread adoption of EdTech in various educational settings highlights its

potential to improve access, engagement, and outcomes for students worldwide. By
breaking down barriers of time, location, and resources, EdTech empowers students to
pursue their educational goals, enhance their skills, and expand their knowledge. As
technology continues to evolve, EdTech is poised to further transform the educational
landscape, opening up new possibilities and avenues for learners of all backgrounds.
With its vast reach and transformative power, EdTech has become an integral
component in shaping the future of education.

Study Notion, a cloud-based Ed-Tech application developed using the MERN stack,
incorporates these principles to provide a comprehensive and dynamic learning
environment. By integrating MongoDB, Express.js, React, and Node.js, Study Notion
ensures efficient data management, seamless communication between server and client-
side components, interactive user interfaces, and high-performance server-side
execution.

Recognizing the limitations of existing Ed-Tech platforms, Study Notion seeks to

address key challenges. Firstly, it offers an all-in-one solution by providing a
centralized platform for organizing and managing study materials, eliminating the
fragmentation of resources across multiple platforms. Additionally, Study Notion
includes an integrated coding environment, allowing students to write, compile, and
test code within the application, streamlining the learning process for programming-
related subjects.

4
Collaboration is another crucial aspect that Study Notion emphasizes. Through its
robust collaboration features, students can engage in real-time discussions, form study
groups, and share resources, fostering a collaborative learning environment. Moreover,
Study Notion leverages intelligent algorithms to provide personalized learning
experiences, analyzing user data and offering tailored recommendations and study
plans to maximize individual learning outcomes.

By combining these features, Study Notion aims to overcome the challenges faced by
other EdTech platforms, offering a comprehensive, user-friendly, and adaptive learning
platform. It empowers students to efficiently organize their study materials, collaborate
with peers, engage in interactive coding exercises, and receive personalized guidance.
Ultimately, Study Notion revolutionizes the educational landscape by leveraging
technology to enhance the learning experience and empower students in their
educational journey.

1.2 PROBLEM STATEMENT

The traditional methods of education often fall short in providing students with a truly
seamless and interactive learning experience, while instructors face limitations in
reaching and connecting with learners on a global scale. Existing ed-tech platforms lack
the versatility and intuitive features necessary to deliver engaging and immersive
educational content. Moreover, the absence of a well-designed API and comprehensive
testing processes hinders the platform's performance and reliability, leading to a subpar
user experience.

The current state of education demands a transformative ed-tech platform like

overcome the limitations of traditional methods and existing platforms. By addressing
the challenges of seamless user experience, global connectivity, API design,
deployment, and testing, StudyNotion aims to reshape the landscape of education,
providing students with an immersive and interactive learning experience, and
empowering instructors to reach learners worldwide.

5
1.3 OBJECTIVES
This project was created with the purpose to fulfill the following objectives:

1. To make the classroom more engaging and control user deviation.

2. To provide IDE within the platform.

1.4 SCOPE AND APPLICATIONS

The scope of StudyNotion is vast and encompasses various aspects of education and
learning. It is aimed towards students at all educational levels, from elementary school
through college and beyond. The platform seeks to support a variety of topics for coding
education. By offering a seamless and interactive learning experience, StudyNotion
intends to engage students in a way that traditional education methods often fail to
achieve. StudyNotion gives teachers a platform to share their knowledge with students
all around the world and engage with them. Video lectures, interactive presentations,
and in-depth study materials are just a few examples of the educational content that
instructors can produce and distribute. The applications of StudyNotion are numerous.
In traditional classrooms, StudyNotion can be used as a supplementary tool to enhance
student engagement and comprehension.

Additionally, StudyNotion can be utilized by independent learners, professionals

seeking continuous education, and even educational institutions looking to offer online
courses and programs. StudyNotion, with its diverse and user-friendly features, has the
potential to change the way education is given and consumed .

6
 CHAPTER 2: LITERATURE REVIEW

StudyNotion is a versatile and intuitive ed-tech platform that aims to revolutionize the
way students learn and instructors teach. In this literature review, we explore the
existing research and literature surrounding similar ed-tech platforms, the impact of
interactive and seamless learning experiences, the importance of global connectivity in
education, and the effectiveness of personalized learning environments. By examining
these relevant studies, we gain valuable insights into the potential benefits and
implications of StudyNotion.

Ed-Tech Platforms: Numerous studies have examined the impact of ed-tech platforms
on education. Research by Dichev and Dicheva highlights the advantages of integrating
technology in education, including increased student engagement, improved learning
outcomes, and enhanced collaboration [1]. Additionally, studies such as that by Means
et al. demonstrate the effectiveness of ed-tech platforms in facilitating personalized and
adaptive learning experiences, catering to individual student needs [2]. EdTech
encompasses various components, including hardware, software, online platforms, and
digital tools, all aimed at enhancing educational experiences. One of the key advantages
of EdTech is its ability to provide improved access to education, personalized learning
experiences, and increased student engagement. It aligns with high-impact educational
practices (HIPs) identified by Kuh, which include active learning, collaborative
learning, and experiential learning [3]. EdTech supports these practices by facilitating
interactive and participatory learning experiences. However, implementing EdTech
comes with its challenges, such as ensuring equitable access to technology, providing
adequate teacher training, addressing data privacy concerns, and ensuring ongoing
support and maintenance. Despite these challenges, successful case studies demonstrate
the positive impact of EdTech on student outcomes. Looking ahead, emerging trends
in EdTech, such as artificial intelligence, virtual reality, gamification, and adaptive
learning, have the potential to further transform education [4]. To fully harness the
transformative potential of EdTech, ongoing research, evaluation, and collaboration are
crucial. In conclusion, EdTech holds promise in improving teaching and learning
outcomes, and continued exploration and implementation are key to realizing its full
potential. The importance of interactive learning experiences is widely acknowledged

7
in educational research. Kuh [3] emphasizes the value of active learning approaches,
stating that engagement and interaction positively affect student achievement.
Furthermore, studies by Mayer [5] and Johnson et al. [4] show that interactive
educational materials, such as videos, simulations, and quizzes, enhance
comprehension, retention, and critical thinking skills. Global connectivity and
collaboration have become essential in the modern education landscape. Research by
Voogt et al. emphasizes the significance of connecting students and instructors across
geographical boundaries to foster cultural understanding and collaboration [6]. The
study underscores the potential of online platforms to facilitate global interactions,
enabling students to learn from diverse perspectives and cultures. Personalized
Learning Environments: Personalized learning environments have gained attention as
effective educational approaches. Hattie highlights the importance of providing
individualized support to students, tailoring instruction to their specific needs, interests,
and abilities [7]. Research by Pane et al. supports the notion that personalized learning
environments lead to improved academic outcomes, motivation, and student
engagement [8]. The study found that when students are provided with personalized
learning experiences tailored to their individual needs, they tend to achieve better
academic results. Personalized learning allows students to progress at their own pace,
receive targeted instruction, and explore content that aligns with their interests and
strengths. This individualized approach to learning not only enhances academic
performance but also fosters intrinsic motivation by giving students a sense of
ownership and autonomy over their educational journey. Moreover, personalized
learning environments have been shown to significantly increase student engagement.
By catering to students' unique learning preferences and styles, personalized learning
captures their interest and promotes active participation. Students are more likely to be
motivated to learn when they feel a sense of relevance and connection to the material.
The ability to explore topics that align with their passions and delve deeper into areas
of interest cultivates a love for learning and drives sustained engagement. Furthermore,
personalized learning environments provide opportunities for teachers to build stronger
relationships with their students. By understanding individual student needs and
tailoring instruction accordingly, teachers can provide targeted support, offer timely
feedback, and establish a supportive and nurturing learning environment. This

8
personalized attention and guidance contribute to students' overall satisfaction and
academic success [8].

StudyNotion aligns with these findings by offering a seamless and interactive learning
experience, global connectivity for instructors and learners, and personalized learning
paths. By leveraging technology and incorporating these research-backed approaches,
StudyNotion has the potential to positively impact student engagement, learning
outcomes, and instructor-student collaboration. Future studies can further explore the
effectiveness and implementation of StudyNotion in diverse educational contexts,
validating its impact on teaching and learning. Future studies could focus on evaluating
the impact of StudyNotion on various educational contexts and populations. This could
include examining its effectiveness in different subject areas, grade levels, and diverse
learner profiles. Additionally, investigating the integration of StudyNotion into existing
educational systems and assessing the training and support required for instructors
would provide valuable insights for successful implementation.

2.1 EXISTING SYSTEMS IN NEPAL & WORLDWIDE

2.1.1 MERO.SCHOOL

Mero.school is an educational website that offers a variety of learning resources and

online courses. However, it currently faces challenges in handling high volumes of
traffic, leading to slow performance and response times. Efforts are underway to
optimize the site's infrastructure and improve scalability to accommodate increased
user demand.

2.1.2 UNACADEMY

Unacademy is a prominent educational platform that offers a diverse range of learning

resources and online courses. Recognized for its unique teaching style, Unacademy
provides comprehensive and interactive content for students across various academic
disciplines. Through its dedication to innovation and student-centric approach,
Unacademy strives to empower learners and foster knowledge acquisition in a dynamic
and engaging manner.
9
2.1.3 COURSERA

Coursera is a leading online learning platform that offers a wide range of courses from
top universities and institutions around the world. With a vast catalog of subjects,
Coursera provides learners with the opportunity to acquire new skills, earn
certifications, and advance their careers. The platform's user-friendly interface and
flexible learning options make it accessible to a global audience. However, some
courses on Coursera require a fee for access to graded assignments and certificates.
Overall, Coursera has revolutionized online education by providing high-quality
courses and fostering a lifelong learning approach for individuals seeking to enhance
their knowledge and professional development.

2.1.4 EDX

EdX.com is an online learning platform that offers a vast array of courses from top
universities and institutions around the world. With over 30 million learners, EdX
provides opportunities for individuals to enhance their knowledge and skills in various
fields, including computer science, business, humanities, and more. Through its user-
friendly interface, learners can access high-quality educational content, engage with
interactive course materials, and collaborate with fellow students in virtual classrooms.
EdX also offers certificate programs and even degree programs from prestigious
universities. It strives to make education accessible and affordable for all, empowering
learners to advance their careers and pursue lifelong learning.

2.1.5 UPGRAD

UpGrad.com is an online education platform that aims to bridge the gap between
industry and academia. With a learner base of millions, UpGrad offers industry-relevant
programs in collaboration with renowned universities and industry experts. It provides
a wide range of courses in fields such as data science, digital marketing, product
management, and more. Through its comprehensive curriculum, personalized
mentorship, and real-world projects, UpGrad equips learners with the skills and
knowledge needed to excel in today's competitive job market. With a focus on practical

10
learning and career advancement, UpGrad empowers individuals to upskill, reskill, and
stay relevant in their professional journey.

2.1.6 UDEMY

Udemy is an online learning platform that offers a vast library of courses on a wide
range of subjects. With over 155,000 courses and 70+ languages available, Udemy
provides learners with the opportunity to acquire new skills, enhance their knowledge,
and pursue personal or professional development. The platform hosts courses taught by
expert instructors from around the world, ensuring high-quality content and practical
learning experiences. Udemy courses encompass diverse topics, including business,
technology, health and fitness, arts and crafts, and much more. Learners can access
course materials at their own pace, making it flexible and convenient for individuals
with varying schedules. With millions of students and a vibrant community, Udemy
has become a go-to platform for lifelong learners seeking accessible and affordable
education.

2.2 LIMITATIONS OF PREVIOUS SYSTEMS

Mero.school, and Unacademy, like many ed-tech platforms, face certain challenges that
impact user experience. Mero.school encounters difficulties in handling significant
volumes of traffic, resulting in sluggish performance. Beside while teaching the coding
problems there is no availability of online compilers as a result the students have to
venture out onto another window or device to do the problem as tasked to students by
the instructor.

2.3 PROBLEMS SOLVED BY OUR SYSTEM

StudyNotion addresses these problems by implementing solutions that ensure a smooth

and efficient learning experience. It employs a scalable infrastructure, allowing it to
handle high volumes of data. StudyNotion effectively addresses several critical
challenges in the realm of educational technology. It provides a comprehensive solution
for users by controlling distractions and maintaining focus on educational tasks.
StudyNotion prioritizes security, offering a secure online space for users to engage in

11
collaborative educational and professional activities. By implementing robust security
measures, StudyNotion ensures the protection of users' data and fosters trust among its
user base. StudyNotion merges features from various educational technology
applications, consolidating the use of this application as it also offers platform based
integrated development environment (IDE). This integration streamlines the user
experience, eliminating the need for users to switch between multiple applications
while promoting focus, collaboration, and efficiency.

12
 CHAPTER 3: METHODOLOGY

3.1 PROCESS MODEL

In line with the development of StudyNotion, an Ed-tech platform aimed at

revolutionizing the learning experience, a structured and iterative software
development approach has been adopted. The chosen model for the project
implementation is the incremental model. This model emphasizes continuous
development and incremental releases, enabling the gradual addition of new
functionalities while ensuring the deployment of a functioning module at the end of
each iteration.

The process began with an extensive requirement gathering phase where crucial
features and user expectations were thoroughly documented. This initial phase laid the
foundation for subsequent stages, focusing on content creation, consumption, user
interaction, and course management functionalities. Subsequently, an in-depth analysis
was conducted to outline the architectural design of the application, considering factors
like scalability, security, and user experience.

The design phase that ensued emphasized continuous development cycles,

incorporating coding and logic design to implement the identified functionalities. Each
incremental cycle aimed at adding specific features or components, ensuring a working
module at the end of each iteration. For instance, the first increment focused on
foundational elements like user authentication and basic content creation. Subsequent
iterations gradually enhanced user interaction capabilities, including commenting,
rating courses, and instructor interaction functionalities.

Following the design phase, the implementation involved integrating the developed
functionalities into the system. Rigorous testing was then conducted to verify the proper
functioning of the newly added features, ensuring they met the outlined requirements
and were free from critical issues. Post-deployment, continuous maintenance was
carried out, addressing any identified issues and incorporating refinements based on
user feedback.

13
The incremental model adopted for StudyNotion allows for systematic and timely
development. Although it may take more time compared to agile methodologies like
Scrum or Kanban to reach the final product, this approach ensures a stable and
functioning application at each stage of development. Through regular iterations, this
model enables tracking of progress and facilitates adjustments to accommodate
evolving requirements, contributing to the gradual evolution and enhancement of
StudyNotion's functionalities.

3.1.1 INCREMENTAL MODEL

Figure 3.1.1: Block Diagram of Incremental Process Model

To develop StudyNotion, an ed-tech MERN stack web application, we employed the

incremental model of software engineering. Initially, we gathered requirements
focusing on features like content creation, consumption, rating, and user interaction.
Based on these requirements, an analysis was conducted to outline the application's
architecture. The design phase commenced, focusing on continuous development
involving coding and logic design to implement the functionalities identified earlier.

Each increment was structured to add specific features or components, ensuring a

functioning module at the end of each cycle. For instance, the first increment focused
on basic content creation and user authentication, ensuring a functional foundation.
Subsequent iterations added functionalities incrementally, such as user interaction
through comments and ratings, enhancing the application's capabilities.

Following the design phase of each increment, implementation took place, where the
developed functionalities were integrated into the system. Testing was then conducted

14
to verify the proper functioning of the newly added features and components. Post-
deployment, maintenance was carried out to address any issues identified in the initial
release, ensuring the application's stability and reliability.

By following the incremental model, StudyNotion evolved in successive releases,

allowing for regular upgrades and improvements. This approach ensured timely
development, enabling us to track progress with each functional module release.
Although the incremental model might take longer to reach the final product compared
to agile methodologies like Scrum or Kanban, its structured approach provided a
systematic way to build and upgrade StudyNotion's features while ensuring the
application's stability and functionality at each stage of development.

3.2 SYSTEM ARCHITECTURE

The system architecture contains front-end connected to backend with RESTful API,
and database and Backend connected by MongoDB.

Figure 3.2: System Architecture

15
3.2.1 FRONTEND

StudyNotion's front end was crafted using Figma, a robust design tool, to conceptualize
the clean and minimalistic user interface. The designs were translated into functional
components using React, a part of the MERN stack. With React's component-based
structure, the UI elements were broken down into reusable components, ensuring
consistency and manageability. These components were integrated into the application,
aligning the design from Figma with the actual front-end implementation. Leveraging
React's capabilities and the MERN stack's data-handling features, functionalities like
data retrieval from the backend, user interactivity, and content management were
incorporated. Rigorous testing throughout the development process ensured the UI and
functionalities were in sync, allowing for refinements to create an engaging and
responsive front end for StudyNotion.

The front end of StudyNotion has all the necessary pages that an ed-tech platform
should have. Some of these pages are:

For Students:

• Homepage: This page will have a brief introduction to the platform, as well as
links to the course list and user details.
• Course List: This page will have a list of all the courses available on the
platform, along with their descriptions and ratings.
• Wishlist: This page will display all the courses that a student has added to their
wishlist.
• Cart Checkout: This page will allow the user to complete the course purchase.
• Course Content: This page will have the course content for a particular course,
including videos, and other related material.
• User Details: This page will have details about the student's account, including
their name, email, and other relevant information.
• User Edit Details: This page will allow the student to edit their account details.

16
For Teachers:

• Dashboard: This page will have an overview of the instructor's courses, as well
as the ratings and feedback for each course.
• Insights: This page will have detailed insights into the instructor's courses,
including the number of views, clicks, and other relevant metrics.
• Course Management Pages: These pages will allow the instructor to create,
update, and delete courses, as well as manage the course content and pricing.
• View and Edit Profile Details: These pages will allow the instructor to view and
edit their account details.

For Admin:

• Dashboard: This page will have an overview of backend and monitoring.

• Control and administration: The Admin will be able to reset the password and
make the modification on the request of the students or teachers.
• Create category: The admin will be able to introduce the category under which
the new courses may be added.

3.2.2 BACKEND

Description of the Back-end Architecture:

StudyNotion uses a monolithic architecture, with the backend built using Node.js and
Express.js, and MongoDB as the primary database. Monolithic architecture refers to a
design approach where all the modules of the application are combined into a single
large program, with a single codebase, to enable better control, security, and
performance.

Node.js is a popular JavaScript runtime that allowed us to run JavaScript code outside
of the browser. Express.js is a web application framework that simplified the process
of building web applications in Node.js. MongoDB is a popular NoSQL database that
allows for flexible data storage and retrieval, making it a suitable choice for complex
applications like StudyNotion.

17
Backend technologies:

1. Node.js: StudyNotion utilizes Node.js, a JavaScript runtime, to execute

JavaScript code outside the browser and build server-side applications.
2. Express.js: StudyNotion leverages Express.js, a web application framework for
Node.js, to simplify development and enhance request handling.
3. MongoDB: StudyNotion utilizes MongoDB, a NoSQL database, for flexible
data storage and retrieval.
4. User authentication and authorization: Students and instructors can sign up and
log in using their email addresses and passwords for their own respective portal.
5. OTP verification: StudyNotion supports OTP verification for enhanced
security.
6. Password recovery: Users can recover their passwords in case they forget them.
7. Creation and modification: Instructors can create, update, and manage courses,
including course content and media.
8. Rating system: Students can view and rate courses, providing feedback for
continuous improvement.
9. Payment integration: Integrates Razorpay for payment.
10. Cloud-based media management: StudyNotion utilizes Cloud infrastructure and
cloud-based media management service (cloudinary), to store and manage
media content, such as images, videos, and documents.

By combining these features, StudyNotion's backend offers a comprehensive and

dynamic learning platform. The user authentication and course management
functionalities empower instructors to create and manage courses, while students can
access and rate courses. Meanwhile the admin is able to control the content which is
created on the platform and make the categories under which the courses are created.
Razorpay payment gateway integrations provide flexibility for students to make secure
transactions. Cloud integration ensures efficient storage and management of media
content, and Markdown formatting enhances the display and readability of course
materials. Overall, StudyNotion's backend functionalities contribute to an engaging and
personalized learning experience for students and instructors.

18
3.2.3 DATA MODELS AND DATABASE SCHEMA

The back end of StudyNotion uses a range of data models and database schemas to
manage data, including:

1. Student schema: Includes fields such as name, email, password, and course
details for each student.
2. Instructor schema: Includes fields such as name, email, password, and course
details for each instructor.
3. Course schema: Includes fields such as course name, description, instructor
details, and media content.

3.2.4 API DESIGN:

The StudyNotion platform's API is designed following the REST architectural style.
The API is implemented using Node.js and Express.js. It uses JSON for data exchange
and follows standard HTTP request methods such as GET, POST, PUT, and DELETE.

Sample list of API endpoints and their functionalities:

1. /api/auth/signup (POST) - Create a new user (student or instructor) account.

2. /api/auth/login (POST) – Log in using existing credentials and generate a JWT
token.
3. /api/auth/verify-otp (POST) - Verify the OTP sent to the user's registered email.
4. /api/auth/forgot-password (POST) - Send an email with a password reset link to
the registered email.
5. /api/courses (GET) - Get a list of all available courses.
6. /api/courses/:id (GET) - Get details of a specific course by ID.
7. /api/courses (POST) - Create a new course.
8. /api/courses/:id (PUT) - Update an existing course by ID.
9. /api/courses/:id (DELETE) - Delete a course by ID.
10. /api/courses/:id/rate (POST) - Add a rating (out of 5) to a course.
Sample API requests and responses:

1. GET /api/courses: Get all courses

o Response: A list of all courses in the database
2. GET /api/courses/:id: Get a single course by ID

19
 o Response: The course with the specified ID
3. POST /api/courses: Create a new course
o Request: The course details in the request body
o Response: The newly created course
4. PUT /api/courses/:id: Update an existing course by ID
o Request: The updated course details in the request body
o Response: The updated course
5. DELETE /api/courses/:id: Delete a course by ID
o Response: A success message indicating that the course has been
deleted.

3.3 FLOWCHART
3.3.1 Flowchart for Student

Figure 3.3.1 Flowchart for Student

20
This flowchart illustrates the journey of a user on StudyNotion. It starts from the home
page, where students can log in if they are registered or provide information for account
verification if they haven't registered before. If verified ("Yes"), they proceed to the
"Dashboard"; if not ("No"), there's an option for them to "Retry." From the
"Dashboard," students can explore courses, watch videos until they complete their
selected course. There's also an option from the "Dashboard" to purchase courses.
Students can add them to the cart and proceed for payment verification. Once payment
verification is done, they gain access to the course. This flowchart utilizes diamonds
for decision points (e.g., registered?), rectangles for processes or actions (e.g., login,
dashboard), and arrows to indicate the flow of information.

3.3.2 Flowchart for Teacher

Figure 3.3.2: Flowchart for Teacher

The teacher/instructor’s journey begins at the Home Page, where users arrive. From
here, they have two options: Log In (for registered users) or Sign Up (for new users).
If a user chooses to sign up, they undergo OTP Verification. If the verification is

21
successful, they proceed to the Dashboard; otherwise, they can retry the OTP
verification.

Once on the Dashboard, users can engage in various activities:

• Create a course under a given category.

• Course description.
• Upload content and media.

After completing an activity, the flow loops back to the dashboard. If the user has
finished their session, the journey ends.

3.3.3 Flowchart for Admin

Figure 3.3.3: Flowchart for Admin

1. Start: The process begins.
2. Login: Users log in to access the system.

22
 3. Backend Dashboard: After logging in, users are directed to the backend
dashboard.
4. Works:
• Check activities.
• Control the category creation (Create, view and update categories).
5. End: The process concludes.

3.4 UML USE CASE DIAGRAM

Figure 3.4: UML Use Case Diagram

The StudyNotion ed-tech application facilitates seamless interactions among three key
actors: STUDENT, TEACHER, and ADMIN. The roles of actors are explained as
follows:

23
Actors

1. STUDENT
• The primary user of StudyNotion.

Engages in various activities related to course access and participation.

Key actions:

• Buy Course: Initiates the process of purchasing a course.

Includes Login (authentication).
• Login: Provides access to the system.
Includes:
• Video on Demand: Access to pre-recorded educational content.

2. TEACHER

Responsible for managing classes and content.

Actions:

• New Registration: Enrolls new teachers into the system.

• Class Control: Governs class activities.
• Includes Login (teacher authentication).

3. ADMIN

Oversees system health and performance. Solely responsible for System Monitoring
and controlling the backend.

Interactions

Arrows indicate interactions between actors and use cases.

• A STUDENT can log in, access video content.
• TEACHERS control classes through the Class Control feature.
• ADMIN focuses on system monitoring.

24
3.5 ENTITY RELATIONSHIP DIAGRAM

Figure 3.5: Entity Relationship Diagram

The Entity Relationship Diagram is described as follows:
1. Student:
o The Student entity represents individual learners who use the system.
o It has two primary attributes:

• Student ID (s_id): A unique identifier for each student.

• Password (st_pwd): The password associated with the student’s
account.

2. Course:
o The Course entity represents educational courses offered within the
system.
o Its main attribute is the Course Number (course no.), which uniquely
identifies each course.
3. Instructors/Teachers:
o The Instructors/Teachers entity represents educators responsible for
teaching courses.
o It includes the following attributes:

• Instructor ID (inst_id): A unique identifier for each instructor.

25
 • Password (inst_pwd): The password associated with the
instructor’s account.

4. Admin:
o The Admin entity represents system administrators who have control
over the entire platform.
o Admins manage students, instructors, and courses.
o Attributes:

• Admin ID (a_id): A unique identifier for each admin.

• Password (a_pwd): The password associated with the admin’s
account.

Relationships:

1. Learn:

• The Learn relationship connects students to specific courses.

• It indicates that students participate in particular courses.

2. Teach:

• The Teach relationship connects instructors to courses they teach.

• It specifies which instructors are responsible for which courses.

3. Controls:

• The Controls relationship links the admin to all other entities.

• Admins have administrative control over students, instructors, and
courses.

26
3.6 DATA FLOW DIAGRAM

Figure 3.6.1: DFD Level 0

Figure 3.6.2: DFD Level 1

27
3.7 TOOLS USED

3.7.1 NODE.JS
The Node.js is utilized to handle all the major back end of StudyNotion, the major tasks
that were implemented using the Node.js are as follows:

• Server-Side Development: Node.js is the foundational technology used for

server-side development in StudyNotion. It powers the server, handling
incoming requests from clients and generating responses.
• Event-Driven Architecture: Leveraging Node.js' event-driven architecture,
StudyNotion manages concurrent connections efficiently. It handles multiple
requests simultaneously without blocking processes, leading to improved
scalability and responsiveness.
• Non-Blocking I/O Operations: Node.js utilizes non-blocking I/O operations,
enabling StudyNotion to handle numerous I/O operations concurrently. This
feature ensures that the app remains responsive and performs well under heavy
loads.
• Scalability: The scalability offered by Node.js is crucial for StudyNotion's
growth. It allows the app to handle an increasing number of users and requests
without compromising performance, making it suitable for handling a large user
base.
• Rich Ecosystem of Modules and Libraries: Node.js provides access to a vast
array of modules and libraries through npm (Node Package Manager).
StudyNotion leverages these modules to enhance functionality, add features,
and expedite development, thereby increasing productivity.
• Microservices Architecture: StudyNotion can adopt a microservices
architecture using Node.js, allowing the system to be broken down into smaller,
independent services. This approach enhances modularity, flexibility, and
maintainability of the application.
• API Development: Node.js is used to create APIs that facilitate communication
between the StudyNotion front end and back end, enabling seamless data
exchange and functionality.

28
 • Rapid Development: The simplicity and flexibility of Node.js contribute to
rapid development cycles. Its ease of use and adaptability aid developers in
building and iterating StudyNotion's features efficiently.
• Community Support and Updates: Node.js benefits from an active and robust
community, providing continuous updates, security patches, and support,
ensuring that StudyNotion stays current, secure, and reliable.

3.7.2 MONGODB
StudyNotion adopts MongoDB as its primary database management system. MongoDB
is a NoSQL database that offers flexibility and scalability, making it suitable for the
dynamic nature of StudyNotion's educational content and user data. It stores data in a
document-oriented manner, allowing for easy handling of complex structures and
relationships. MongoDB's scalability ensures that StudyNotion can handle the growing
volume of data and user interactions without compromising performance. The tasks
that were done using MongoDB are enlisted below:

• Primary Database Management System: MongoDB serves as the primary

database management system for StudyNotion. It is responsible for storing and
managing various types of data, including educational content, user profiles,
course materials, discussions, and interactions.
• Storage of Educational Content: MongoDB stores educational content, such as
course materials and multimedia elements like URLs of videos and images. Its
document-oriented storage allows for the easy organization and retrieval of
diverse content types.
• Flexible Data Model: MongoDB's flexible schema design accommodates the
dynamic nature of StudyNotion's educational content and user data. It allows
for the storage of data in a format that can evolve over time without requiring a
predefined schema, providing agility in handling diverse content structures.
• Handling Complex Structures and Relationships: MongoDB's document-
oriented approach enables the storage of complex data structures and
relationships between various elements within StudyNotion. It facilitates the
representation of interconnected data, such as courses linked to multiple
modules, lectures, and user interactions.

29
 • Scalability and Performance: MongoDB's scalability capabilities ensure that
StudyNotion can handle the increasing volume of educational content, user
interactions, and data without compromising performance. Its ability to
distribute data across multiple servers efficiently supports the platform's growth
and usage.
• Optimized for User Interactions: MongoDB's document-oriented nature allows
StudyNotion to efficiently manage user interactions, including discussions,
comments, user progress, and personalized recommendations. This optimizes
user experience by providing responsive and dynamic content delivery.
• Enhanced Querying and Indexing: MongoDB offers robust querying
capabilities and indexing features that optimize data retrieval. This allows
StudyNotion to quickly access and retrieve specific information, supporting
efficient search functionalities and content delivery to users.

In summary, MongoDB serves as a flexible, scalable, and performance-oriented

database management system within StudyNotion. It effectively handles the storage,
organization, and retrieval of diverse educational content and user data, contributing
significantly to the platform's functionality and user experience.

3.7.3 EXPRESS.JS
StudyNotion utilizes Express.js, a popular web application framework built on top of
Node.js. Express.js provides a minimal and flexible set of tools and features for
building web applications. It simplifies the creation of RESTful APIs, routing,
middleware integration, and request handling. Express.js enhances the development
process by providing a clean and organized structure for the back-end codebase, making
it easier to manage and maintain. The tasks that we completed using Express.js can be
enlisted in following points:

• Web Application Framework on Node.js: Express.js acts as the web application

framework that is built on top of Node.js, forming the backbone of
StudyNotion's back-end architecture.
• RESTful API Development: Express.js simplifies the creation of RESTful
APIs, enabling StudyNotion to design and implement APIs for handling various
functionalities such as user authentication, content delivery, interaction
tracking, and communication between the front end and back end.
30
 • Routing and Middleware Integration: Express.js facilitates easy routing of
HTTP requests to specific endpoints and integrates middleware functions to
handle these requests. This capability allows StudyNotion to define routes for
different functionalities and execute specific middleware functions for
processing requests.
• Request Handling and Response Generation: Express.js streamlines the
handling of incoming HTTP requests and enables the generation of appropriate
responses. It manages the logic to process user requests and delivers responses,
ensuring smooth communication between clients and the server.
• Clean and Organized Code Structure: Express.js encourages a clean and
organized structure for the back-end codebase of StudyNotion. It promotes
modularization and separation of concerns, making the codebase more
manageable, readable, and maintainable.
• Middleware Stack for Functionality: StudyNotion utilizes Express.js
middleware stack to incorporate additional functionalities such as
authentication, logging, error handling, and data validation. This enhances
security, tracks interactions, and ensures smooth operation of the application.
• Enhanced Development Process: Express.js expedites the development process
by offering a minimalistic and flexible set of tools and features. It simplifies the
creation of routes, handling of HTTP requests, and integration of middleware,
contributing to faster development cycles.

Therefore, Express.js serves as a powerful and versatile framework within

StudyNotion, streamlining the development of RESTful APIs, enabling efficient
request handling, and promoting a structured and maintainable codebase for the back-
end, ultimately contributing to the platform's functionality and performance.

3.7.4 JWT (JSON WEB TOKENS)

StudyNotion employs JWT for authentication and authorization. JWT is a compact and
secure means of transmitting information between parties as a JSON object. It allows
StudyNotion to generate tokens upon user login, which are securely signed and can be
used to authenticate subsequent API requests. JWTs contain user information and
access permissions, ensuring that only authorized users can access specific resources

31
and perform actions within the platform. The utilization of this tool is enlisted as
follows:

• Authentication and Authorization Mechanism: JWT serves as StudyNotion's

authentication and authorization mechanism, facilitating secure information
transmission between the client and server.
• Token Generation upon User Login: After a successful login, StudyNotion
generates a JWT for the user. This token, securely signed, contains specific user
information, such as user ID, roles, and access permissions.
• Secure Transmission of Information: JWTs are compact and securely encode
information, ensuring integrity and authenticity. Their digital signature prevents
unauthorized tampering or modifications.
• Authentication of Subsequent API Requests: Clients are required to include the
JWT in subsequent API requests' headers. The server validates the token's
signature to authenticate the user and their permissions.
• User Information and Access Permissions: Encrypted within JWTs, user
information and access permissions allow StudyNotion to verify user identity
and authorize their access to specific resources.
• Stateless and Scalable Authentication: JWT-based authentication is stateless,
alleviating the need for server-side session storage. This approach supports
StudyNotion's scalability and efficiency.
• Token Expiration and Renewal: JWTs can have expiration times, enhancing
security. StudyNotion implements token renewal strategies for seamless user
experience while maintaining security.
• Fine-Grained Access Control: With embedded access permissions,
StudyNotion exercises fine-grained access control, allowing or restricting user
access based on their roles or permissions.

Therefore, JWT-based authentication and authorization in StudyNotion offer a secure,

efficient means of managing user identity and access control, ensuring only
authenticated and authorized users access the platform's resources.

32
3.7.5 BCRYPT
StudyNotion enhances password security using Bcrypt, a popular cryptographic
algorithm. Bcrypt hashes passwords with a salt and multiple rounds of hashing, making
it computationally expensive for potential attackers to crack passwords through brute-
force or dictionary attacks. By utilizing Bcrypt, StudyNotion ensures that user
passwords are securely stored and protected against unauthorized access. The main
utilization of Bcrypt are as follows:

• Password Security Enhancement: StudyNotion employs Bcrypt, a robust

cryptographic algorithm, to bolster the security of user passwords stored within
the system.
• Hashing with Salt and Multiple Rounds: Bcrypt hashes user passwords by
incorporating a randomly generated salt along with multiple rounds of hashing.
This process makes it significantly more computationally expensive for
potential attackers to decipher passwords through brute-force or dictionary
attacks.
• Salting Technique: The use of salt involves appending a random string of
characters to each password before hashing. This unique salt value added to
each password ensures that even identical passwords result in different hashes,
thwarting rainbow table attacks.
• Computational Expense for Attackers: Bcrypt's multiple rounds of hashing
exponentially increase the computational resources required to crack
passwords. This deliberate slowness significantly hinders attackers attempting
to guess passwords by iterating through possible combinations.
• Protection Against Unauthorized Access: By utilizing Bcrypt, StudyNotion
ensures that user passwords are securely stored and guarded against
unauthorized access. This method strengthens the overall security posture of the
platform by minimizing the risk of password-related breaches.
• Security Best Practice Implementation: Employing Bcrypt aligns with industry
best practices for password security. It reflects StudyNotion's commitment to
adopting robust measures to safeguard user data and privacy.

In a nutshell, StudyNotion fortifies password security using Bcrypt, a potent

cryptographic algorithm. Bcrypt employs salting and multiple hashing rounds,

33
rendering it arduous for potential attackers to crack passwords via brute-force methods.
This approach ensures that user passwords are stored securely, safeguarding against
unauthorized access and aligning with industry best practices for robust data protection.
Moreover, Bcrypt's deliberate slowness drastically impedes password decryption
attempts, enhancing StudyNotion's overall platform security.

3.7.6 MONGOOSE
StudyNotion integrates Mongoose, an Object Data Modeling (ODM) library, to
simplify interactions with MongoDB. Mongoose provides a higher-level abstraction,
allowing StudyNotion to define data models, establish relationships between entities,
and perform database operations using JavaScript syntax. It enforces data consistency,
validation, and simplifies querying, enabling efficient and structured data management
within the application.

• Simplified Interactions with MongoDB: Mongoose simplifies interactions with

MongoDB, streamlining the process of handling database operations. It
provides a more intuitive and JavaScript-oriented approach, reducing
complexity in managing MongoDB queries and transactions.
• Higher-Level Abstraction for Data Models: With Mongoose, StudyNotion can
define data models at a higher level of abstraction, allowing for easy
representation and structuring of complex data. This abstraction aids in creating
consistent and standardized data models throughout the application.
• Establishment of Entity Relationships: Mongoose facilitates the establishment
of relationships between different entities or data structures within
StudyNotion's database. This capability allows for efficient management of
associations between various data elements, enhancing data integrity and
coherence.
• Data Consistency and Validation: Mongoose enforces data consistency and
validation rules defined within StudyNotion's data models. It ensures that data
adheres to specified criteria and constraints, maintaining accuracy and integrity
across the application.
• Simplified Database Operations: By using Mongoose, StudyNotion simplifies
database operations such as creating, reading, updating, and deleting (CRUD)

34
 data. This simplification reduces the complexity of coding these operations,
leading to more efficient and structured data management.
• Streamlined Querying with JavaScript Syntax: Mongoose enables StudyNotion
to perform database queries using familiar JavaScript syntax. This feature
simplifies the querying process, making it more accessible for developers and
enhancing productivity.
• Enhanced Data Management: Overall, Mongoose enhances StudyNotion's data
management capabilities by providing a structured approach to modeling data,
defining relationships, enforcing validations, and simplifying interactions with
MongoDB. This results in a more organized and efficient handling of data
within the application.

3.7.7 REACTJS
React is a powerful JavaScript library that revolutionized the way user interfaces are
built. Its component-based architecture enables developers to create reusable UI
elements, enhancing code reusability and maintainability. React's virtual DOM
efficiently updates and renders components, reducing the need for manual DOM
manipulation. With its declarative syntax, developers can easily express how the UI
should look based on the application state, and React takes care of efficiently updating
the actual DOM to reflect those changes. This approach simplifies UI development and
helps create responsive and interactive user interfaces. React's popularity and extensive
ecosystem of libraries and tools make it a go-to choice for front-end development,
enabling developers to build robust and efficient web applications.

Together, these technologies and frameworks form the robust foundation of

StudyNotion's technical stack, ensuring scalability, security, and efficient data
management, all while providing a seamless and interactive learning experience for
users. The achievements that were possible through the use of React.js are as follows:

• Component-Based Architecture: React's component-based architecture allows

StudyNotion to create reusable and modular UI elements. This approach
improves code reusability, simplifies maintenance, and facilitates the creation
of consistent UI components throughout the application.
• Virtual DOM: React utilizes a virtual DOM that efficiently updates and renders
components. By minimizing direct manipulation of the actual DOM,
35
 StudyNotion achieves better performance and faster rendering, resulting in a
smoother user experience.
• Declarative Syntax: React's declarative syntax enables developers to describe
the UI based on the application's state. StudyNotion benefits from this approach
as it simplifies the process of expressing how the UI should look in response to
changes in data or user interactions.
• Efficient UI Updates: With React, StudyNotion can efficiently update the real
DOM to reflect changes in the application state. This efficient updating
mechanism enhances responsiveness and ensures that the user interface remains
synchronized with the underlying data.
• Simplified UI Development: React simplifies UI development by abstracting
complex DOM manipulation and providing a more structured and predictable
way of building interfaces. This simplicity streamlines the development process
and allows StudyNotion to create responsive and interactive user interfaces
more effectively.
• Extensive Ecosystem and Popularity: React's popularity and vast ecosystem of
libraries and tools offer StudyNotion access to a wide range of resources and
community support. This ecosystem empowers developers to leverage existing
solutions and best practices, contributing to the creation of robust and efficient
web applications.

In conclusion, React serves as a fundamental technology in StudyNotion's technical

stack, contributing to scalable, secure, and efficient front-end development. Its
component-based approach, virtual DOM usage, and declarative syntax play a pivotal
role in creating a seamless and interactive learning experience for StudyNotion's users.

3.7.8.FIGMA
Figma is a cloud-based design and prototyping tool that has gained immense popularity
for its collaborative features and versatility. It allows designers to work on projects in
real-time, facilitating seamless collaboration among team members. With its robust set
of features, Figma supports the entire design process, from wireframing to high-fidelity
prototyping. This makes it an ideal choice for teams working on complex projects, such
as the development of Ed-Tech applications like StudyNotion.

Designing StudyNotion in Figma:

36
Project Initialization and Wireframing:

• Setup: Initiate the StudyNotion project in Figma, establishing a well-organized

folder structure.
• Wireframing: Leverage Figma for creating initial wireframes, concentrating on
the application's layout and user journey.

Design System Implementation:

• Consistency: Develop a comprehensive design system within Figma to maintain

visual consistency.
• Components: Utilize Figma's component functionality for creating reusable UI
elements, ensuring efficiency in design iterations.

High-Fidelity Mockups and Prototyping:

• Mockups: Utilize Figma to craft high-fidelity mockups for each StudyNotion

screen, aligning them with the established design system.
• Prototyping: Leverage Figma's prototyping features to create interactive
prototypes, allowing stakeholders to visualize user interactions.

Collaboration and User Testing:

• Real-time Collaboration: Leverage Figma's collaborative capabilities by

inviting team members to contribute in real-time.
• User Testing: Use Figma's interactive prototypes to conduct user testing, gather
feedback, and iterate on the design accordingly.

Handoff to Development and Final Review:

• Development Handoff: Utilize Figma's features to provide comprehensive

design specifications for the StudyNotion development team.
• Final Review: Conduct a thorough review of the design within Figma, ensuring
all aspects are refined and ready for implementation.

37
3.7.9. POSTMAN

Postman API serves as a robust tool for developers to streamline the creation, testing,
and management of APIs. It offers a comprehensive suite of features accessible
programmatically, enabling seamless integration into various development workflows.
Through its RESTful interface, developers can interact with Postman's functionalities,
facilitating automation and extensibility. Key features of the Postman API include
automated testing, collection management, environment configuration, monitoring, and
documentation generation.

• Automated Backend Testing: Developers can automate backend API testing by

leveraging the Postman API to trigger collections or individual requests,
enabling comprehensive testing of endpoints and assertions of responses.
• Community and Support: Postman boasts a vibrant community of developers
who contribute to its ecosystem by sharing collections, scripts, and best
practices. Extensive documentation, tutorials, and support resources further aid
developers in maximizing the potential of the Postman API.

3.8 VERIFICATION AND VALIDATION

Verification involves a series of activities that focus on assessing whether the software
product accurately implements the defined specifications and adheres to the established
standards. It ensures that each component of StudyNotion, from its individual
functionalities to the integrated modules, aligns with the predetermined requirements
and operates as expected. This phase involves rigorous testing, reviews, and inspections
to detect and rectify any discrepancies between the actual implementation and the
intended design.

On the other hand, validation concentrates on evaluating whether StudyNotion meets

the users' needs and expectations effectively. This phase ensures that the software
fulfills its intended purpose in the real-world context, providing a seamless and
satisfactory experience for its intended users. Validation activities encompass user
acceptance testing, usability assessments, and feedback analysis to verify that
StudyNotion meets the usability, functionality, and performance expectations of its
end-users.

38
Both verification and validation are indispensable processes that work in conjunction
to guarantee the success and reliability of StudyNotion. The subsequent points will
highlight the specific steps and methodologies employed in the verification and
validation phases of StudyNotion, elucidating the meticulous measures taken to ensure
a robust, user-friendly, and efficient Ed-tech platform.

Verification Steps:

• Requirements Review: Conducted a thorough review of the initial requirements,

emphasizing features like content creation, consumption, ratings, and user
interaction. Ensured these requirements were accurately documented and
aligned with stakeholders' expectations. The aim was to ascertain the
completeness and accuracy of the gathered requirements before proceeding to
the next phase.
• Design Phase: Commenced the design phase, emphasizing continuous
development involving coding and logic design to implement the identified
functionalities. This stage aimed to transform conceptual ideas into practical
designs while ensuring that the design addressed the outlined functionalities to
the proposed architecture.
• Incremental Development: Utilized an incremental model, breaking down the
development process into structured increments. Each increment was dedicated
to adding specific features or components, ensuring that a functioning module
was achieved at the end of each cycle. The goal was to build upon the previous
increment's foundation, ensuring a steady and structured development
approach.
• Integration and Testing: Integrated the developed functionalities into the system
to verify their proper functioning. Rigorous testing was conducted at this stage
to validate that the new features or components met the specified requirements.
The focus was on ensuring that the integrated components seamlessly worked
together and aligned with the intended functionality.
The testing of front end of StudyNotion was done utilizing routes while the
backend testing was done using postman.

39
Validation Steps

• Performance Testing: Conducted comprehensive performance tests to validate

the application's responsiveness under various load conditions. Ensured that the
system could handle expected user traffic without compromising performance.
The focus was on validating the system's reliability and responsiveness in real-
world scenarios.
• Security Assessment: Performed rigorous security assessments to validate the
application's resilience against potential threats. Ensured adherence to security
best practices and standards to safeguard user data. This phase aimed to identify
and address any security vulnerabilities, ensuring a robust and secure
application environment.
• Compatibility Checks: Validated application compatibility across different
devices, browsers, and operating systems. Ensured consistent functionality and
user experience across varied platforms. The goal was to confirm that the
application provided a seamless experience irrespective of the user's device or
browser choice.
• Feedback Incorporation: Incorporated feedback from stakeholders, users, and
testing phases to refine and improve the application. Actively considered
validated feedback to implement necessary changes and enhancements. This
phase aimed to ensure continuous improvement based on validated feedback for
a refined user experience.

40
 4. EPILOGUE

4.1 RESULT AND DISCUSSIONS

The results that were obtained are as listed as follows.

4.1.1 User-Friendly Interface

Designed and implemented a user-friendly interface with intuitive navigation, clear
information architecture, and visually appealing design for easy access to different
sections like courses, compiler, progress tracking as well as payment integration.

4.1.2 Responsive and Accessible Design

Developed a responsive design ensuring adaptability across various devices and screen
sizes, enabling access from desktops, laptops, tablets, and smartphones, ensuring
convenience and accessibility for users.

4.1.3 Engaging Content Delivery

Figure 4.1.3: View of the multimedia content i.e video lecture content.

Implemented multimedia support for videos, images, and interactive quizzes to enhance
engagement. Introduced customized learning features to motivate and engage users
during their learning process.

41
4.1.4 Collaborative Tools

Figure 4.1.4 (a) Easy buying/ cart layout.

Figure 4.1.4 (b): Integrated Razorpay payment system.

42
 Figure 4.1.4 (c): Student's progress tracking.

Integrated Razorpay which allows the easy and secured purchase of course. Contains
the students course progress tracking.

4.1.5 Robust Instructor Tools

Provided comprehensive tools for instructors, facilitating course creation, content
management, assessment creation, and student progress tracking. Customization
options for courses and monitoring tools for student engagement and performance have
been developed.

4.1.6 API Integration

Figure 4.1.6 (a) Denied backend category creation while using Postman.

43
 Figure 4.1.6 (b) The admin login success from backend API using Postman.

Figure 4.1.6 (c). The admin login allowed updating content.

StudyNotion integrates Application Programming Interfaces (APIs) to facilitate

seamless communication between its front-end and back-end components. These APIs

44
define well-defined endpoints for content creation, access, and user interaction,
enabling efficient data exchange and interaction within the platform. The integration of
APIs ensures that StudyNotion remains scalable and adaptable to future enhancements
and integrations with third-party services. The postman is utilized to create an access
for the admin where in admin is able to update course.

4.1.7 Scalable and Schema-Free Database

Figure 4.1.7 Schema-free database using MongoDB.

StudyNotion leverages MongoDB, a NoSQL database, for its data storage needs,
ensuring scalability and flexibility. Unlike traditional relational databases, MongoDB
is schema-free, allowing for dynamic data modeling and adaptation to evolving content
and user requirements. This schema-free nature enables StudyNotion to accommodate
diverse content types and user interactions without constraints, facilitating seamless
platform evolution and growth.

45
4.1.8 IDE
StudyNotion's Integrated Development Environment (IDE) seamlessly integrates with
Programmiz's website, redirecting users to the platform to utilize its compiler. This
collaboration enables students to access a comprehensive coding environment without
leaving StudyNotion. By leveraging Programmiz's compiler through this integration,
StudyNotion facilitates smooth coding experiences, empowering students to write,
compile, and test code effortlessly within the platform. This approach promotes real-
time collaboration and feedback among students and instructors, enriching the learning
experience and fostering hands-on coding practice directly within StudyNotion.

4.2 CONCLUSION
In summary of our report, StudyNotion draws inspiration from Notion's collaborative
functionalities but introduces tightly coupled data control mechanisms to maintain a
focused learning environment. Through robust authentication protocols, StudyNotion
ensures students remain engaged in classroom activities, fostering attentiveness and
participation. This emphasis on centralized control enables educators to effectively
manage student interactions and content access, enhancing overall educational quality.
The platform facilitates student collaboration through intuitive features, allowing for
group study sessions and resource sharing. Additionally, StudyNotion incorporates
compilers for coding practice, providing students with hands-on experience and skill
development opportunities. By integrating diverse educational resources, including
multimedia content and interactive exercises, StudyNotion caters to different learning
styles and preferences. StudyNotion's strength lies in its comprehensive approach,
seamlessly combining elements from various educational tools and platforms into a
unified system. This integration streamlines the learning process, simplifies
administrative tasks, and enhances the efficiency of online education. Overall,
StudyNotion represents a significant advancement in educational technology,
empowering students to learn effectively and collaboratively in the digital age.

46
4.3 FUTURE ENHANCEMENTS
The future enhancements for StudyNotion include the following features:

• Internal IDE: Though there is utilization of external redirect from StudyNotion

itself, it is essential to use an internal IDE utilizing API for practicing coding
during the live classes within the webapp.
• Live Video Lecture Sessions: StudyNotion will contain the feature for live
video lectures which will be notified to students and live classes can be
conducted. Integration of web sockets enabling the live classes.

47
 REFERENCES

[1] C. Dichev and D. Dicheva, "Gamifying education: what is known, what is believed
and what remains uncertain: a critical review," International Journal of Educational
Technology in Higher Education, vol. 14, no. 1, p. 9, 2017. [Online]. Available:
https://doi.org/10.1186/s41239-017-0042-5

[2] B. Means et al., "Evaluation of evidence-based practices in online learning: A meta-

analysis and review of online learning studies," U.S. Department of Education, Office
of Planning, Evaluation, and Policy Development, 2010. [Online]. Available:
https://www2.ed.gov/rschstat/eval/tech/evidence-based-practices/finalreport.pdf

[3] G. D. Kuh, "High-impact educational practices: What they are, who has access to
them, and why they matter," Association of American Colleges and Universities, 2008.
[Online]. Available: https://www.aacu.org/leap/hips

[4] R. E. Mayer, Multimedia learning (2nd ed.). Cambridge University Press, 2009.

[5] L. Johnson et al., "NMC/CoSN Horizon Report: 2014 K-12 Edition," The New
Media Consortium, 2014. [Online]. Available: https://library.educause.edu/-
/media/files/library/2014/2/hr2014.pdf

[6] J. Voogt et al., International Handbook of Information Technology in Primary and

Secondary Education. Springer International Publishing, 2018.

[7] J. Hattie, Visible Learning for Teachers: Maximizing Impact on Learning.

Routledge, 2012.

[8] J. F. Pane et al., "Continued progress: Promising evidence on personalized

learning," RAND Corporation, 2015. [Online]. Available:
https://www.rand.org/pubs/research_reports/RR1365.html

48
 BIBLIOGRAPHY

G. Dawson, The EdTech Startup Handbook: Everything You Need to Know to Design,
Develop, and Deploy Your Educational Technology Startup, Stylus Publishing, 2020.

L. Kolb, The EdTech Advocate's Guide to Leading Change in Schools, International

Society for Technology in Education, 2018.

B. Ferster, Teaching Machines: Learning from the Intersection of Education and

Technology, The MIT Press, 2014.

S. Hoque and H. Singh, "MERN Quick Start Guide: Build web applications with
MongoDB, Express.js, React, and Node," Packt Publishing, 2018.

V. Subramanian, "Pro MERN Stack: Full Stack Web App Development with Mongo,
Express, React, and Node," Apress, 2017.

R. Rupareliya, "MERN Essentials: Build universal apps using MongoDB, Express,

React, and Node," Packt Publishing, 2018.

D. Guralnick, Learning Transformation: How Learning and Development Are

Reshaping the Digital Economy, CreateSpace Independent Publishing Platform, 2018.

H. Clark and T. Avrith, EdTech in the Classroom: Making a Difference in Teaching

and Learning, EdTechTeam Press, 2018.

49
SCREENSHOTS

50
51
52
53