Collegify

You might also like

Download as pdf or txt
Download as pdf or txt
You are on page 1of 59

C LLEGIFY

A Major Project Report Submitted in partial fulfilment for the award of Degree
of Master of Computer Applications

In

Computer Science & Information Technology

Submitted By

Arun Gautam (239019020020)


Puneet Kumar (239019020026)
Arpit Sharma (239019020019)
Amit Kumar Mourya (239019020018)
Shiv Pratap Singh (23901920031)
Rajat Gangwar (239019020027)

Under Supervision of
Dr Akhtar Husain
Mr. BR Ambedkar
Mrs. Nisha Singh

Department of Computer Science & Information Technology

Faculty of Engineering & Technology


M.J.P. Rohilkhand University, Bareilly

2024
Candidate’s Declaration
I hereby declared that major project report titled “COLLEGIFY”, is prepared by me based
on available literature and I have not submitted it anywhere else for the award of any other
degree or diploma.

Date: ArunGautam(239019020020)
Puneet Kumar (239019020026)
Arpit Sharma (239019020019)
Amit Kumar Mourya (239019020018)
Shiv Pratap Singh (239019020031)
Rajat Gangwar (239019020027)

Certificate from Supervisor

I certify that the above statement made by the candidate is true to the best of my knowledge

Date: Dr Akhtar Husain


Mr. BR Ambedkar
Mrs. Nisha Singh

ii
Acknowledgement
With great pleasure I take this opportunity to express my heartfelt gratitude to all people who

helped in making this major project a grand success. First of all, I thank God Almighty for

giving me strength, courage and blessings to complete this work. I express my sincere thanks

to my supervisors for their continuous care towards this major project work.

Arun Gautam (239019020020)


Puneet Kumar (239019020026)
Arpit Sharma (239019020019)
Amit Kumar Mourya (239019020018)
Shiv Pratap Singh (239019020031)
Rajat Gangwar (239019020027)

iii
TABLE OF CONTENTS
CHAPTER NO. TITLE PAGE NO.
Certificate …………………………………………………………………………. i
Abstract ……………………………………………………………………………. ii
Acknowledgment ………………………………………………………………….. iii
1. Introduction ………………………………………………………………………. 1-4
1.1 Project Overview ……………………………………………………………….. 1
1.2 Project Purpose …………………………………………………………………. 1
1.3 Background ……………………………………………………………………... 2
1.4 Benefits …………………………………………………………………………. 3
1.5 Scope …………………………………………………………………………… 4
1.6 Login module …………………………………………………………………… 4
1.7 Registration Module ……………………………………………………………..4
2. Literature Survey ………………………………………………………………….. 5-6
2.1 Existing Systems ………………………………………………………………… 5
2.2 Drawbacks in The Existing System ……………………………………………... 5
2.3 Proposed System ………………………………………………………………… 5
2.4 Benefits of The Proposed System ……………………………………………….. 6
2.5 Feasibility Analysis ……………………………………………………………… 6
2.5.1 Technical Feasibility …………………………………………………… 6
2.5.2 Economical Feasibility …………………………………………………. 6
3. MERN STACK …………………………………………………………………….. 7-23
3.1 JavaScript ……………………………………………………………………….....7
3.1.1 Client-side JavaScript …………………………………………………... 7
3.1.2 Server-side JavaScript …………………………………………………...7
3.2 ReactJS …………………………………………………………………………….8
3.2.1 Virtual-DOM ………………………………………………………….….8
3.2.2 Component ……………………………………………………………….8
3.2.3 Props and State ………………………………………………..………….8-9
3.2.4 Pros of ReactJS ………………………………………………….……….9
3.2.5 Cons of ReactJS ………………………………………………………….10
3.2.6 Why React? ……………………………………………...……………….10
3.3 NPM & NodeJS …………………………………………………..……………….11
3.3.1 Application using NodeJS ……………………………………………….12
3.3.2 Features of NodeJS ……………………………………...……………….12
3.3.3 Pros of NodeJS …………………………………………………….…….13
3.3.4 Cons of NodeJS ………………………………………………………….13
3.3.5 Who use NodeJS? ………………………………………………….…….14
3.3.6 NodeJS should not be used when …………………………….………….15
3.4 Express.js ………………………………………………………………………….16
3.5 MongoDB ………………………………………………………………………….16
3.5.1 Commonly used terms in MongoDB …………………………………….17
3.5.2 Features and Components ……………………………………………….18
3.5.3 Why MongoDB? ……………………………………………...………….19-21
3.6 MERN Stack in Website Development ………………………………..………….21
3.6.1 Concept of Stack technology …………………………………………….21
3.6.2 Concept of MERN Stack …………………………………..…………….22
3.6.3 Highlights in MERN Stack…………………………………………..…. 21
4. Tools Used ……………………………………………………………………………22
4.1 Visual Code Editor ………………………………………………………...22-23
5. System Requirements Specification ……………………………………………..….24
5.1 Hardware Requirements ……………………………………………………….….24
6. System Design ………………………………………………………………………..25-37
6.1 Introduction ………………………………………………………………………..25
6.1.1 Conceptual Design ……………………………………………………….26
6.1.2 Logical Design ………………………………………………………..….26
6.1.3 Physical Design …………………………………………………………. 26-27
6.2 UML Diagrams …………………………………………………………………….27
6.2.1 Introduction ………………………………………………………...…….27
6.2.2 Types of UML Diagrams ………………………………………..……….28-30
6.3 E-R Diagram ……………………………………………………………………….31
6.4 Data Flow Diagram ……………………………………………………..………….32
6.4.1 Data Flow Diagram Symbols ……………………………..………………33
6.4.2 Steps to Construct DFD …………………………………….…………….33
6.4.3 Rules for Constructing a DFD …………………………………………….33
6.4.4 First-Level DFD FOR STUDENT ………………………….…………….34
6.4.5 Second Level DFD FOR ADMIN ……………………….……………….35
6.4.6 Second-Level DFD FOR STUDENT……………………………………. 37
7. TESTING …………………………………………………………………….……….38-41
7.1 Types of Testing ………………………………………………………..………….38
7.1.1 Black Box (Functional) Testing ………………………………………….38
7.1.2 White Box (Structural) Testing ………………………………………….39
7.1.3 Unit Testing …………………………………………………..………….40
7.1.4 Incremental Integration Testing ………………………………………….40
7.1.5 Integration Testing ……………………………………………………….40
7.1.6 Functional Testing …………………………………………….………….40
7.1.7 System Testing ………………………………………….….…………….40
7.1.8 End-to-End Testing ……………………………………..……….……….40
7.1.9 Regression Testing …………………………………….………………….41
7.1.10 Acceptance Testing ……………………………………….…………….41
7.1.11 Performance Testing …………………………………………………….41
7.1.12 Alpha Testing ……………………………………….……………….….41
7.1.13 Beta Testing ……………………….…………………………………….41
8. Screenshots …………………………………….…………………..………………….42-50
9. Conclusion …………………………………….……………………...……………….51
References …………………………………….……………………………………….52-53
1. INTRODUCTION
When we ask the educational academy or a school to enter the electronics world in which he
asked to electronics advantages make we processions electronic which has become all the
world is it and that make we continuously with students and teachers quickly. Here we
require a website so that this site covers the needs of teachers and students at one time so that
it is students special site where watching the monthly marks of the students obtained at the
educational academy or a school and also can request permission in the case not go to school
and teachers (who can put signs and writes reports on each student activity, and duties can be
director, principal or owner of the educational academy or a school that is watching all the
students and teachers in terms of absence and attendance and also can see that all the
observations and monitors all complaints and reports.

1.1 Project Overview

The student portal system is a comprehensive web-based platform designed to enhance the
academic experience for both students and teachers. Through this portal, students can access
a wide range of features, including the ability to view their academic progress, track
assignments, receive important notifications, and stay updated on school events and
announcements. The system provides a centralized location where students can manage their
schedules, check grades, and engage in various academic activities, ensuring they stay on top
of their educational responsibilities.

For teachers, the portal offers robust tools to monitor and support student performance.
Educators can easily track student activities, such as assignment submissions and
participation in class discussions, allowing them to provide timely feedback and address any
issues promptly. The system also facilitates communication between teachers and students,
fostering a more interactive and supportive learning environment. Overall, the student portal
system aims to streamline academic administration, promote better educational outcomes,
and enhance the overall efficiency of the school's academic processes.

1.2 Project Purpose

The primary purpose of this project is to develop a robust and user-friendly process system
that significantly simplifies and streamlines the way students manage and carry out their
academic activities. This system is designed to facilitate an organized approach to learning,
ensuring that students can easily access and engage with their educational responsibilities
1
while adhering to the established academic guidelines and processes. By providing a
centralized platform, the system enables students to efficiently track their assignments,
manage their schedules, and stay informed about important academic updates, thus promoting
a more structured and disciplined approach to their studies.

In addition to benefiting students, the project also aims to support teachers by offering tools
to monitor and evaluate both their own activities and those of their students. Teachers can use
the system to keep a detailed record of student participation, track progress over time, and
ensure that academic standards are being met. This comprehensive oversight allows educators
to provide more targeted and effective support, fostering an environment where students can
thrive. Ultimately, the project seeks to enhance the overall educational experience by making
academic processes more transparent, accessible, and efficient for everyone involved.

1.3 Background

This portal management system is designed with comprehensive specifications to cater to the
needs of both students and teachers by providing a detailed overview of their activities.
Unlike traditional management systems that often focus solely on the interaction between
students and teachers, our system extends its reach to include parents as well. By integrating
features that allow parents to access their child's academic activities, we ensure that parents
can stay informed and engaged in their child's education. This added layer of transparency
and communication helps create a more supportive and involved educational environment.

The system allows students to log in and view their schedules, assignments, grades, and other
important academic information, ensuring they have all the necessary tools to manage their
education effectively. Teachers can utilize the system to track student performance, monitor
classroom activities, and maintain an organized record of each student's progress. This dual
functionality ensures that both students and teachers can efficiently manage their respective
tasks and responsibilities within the academic framework.

Moreover, by providing parents with access to their child's academic activities, the system
fosters a collaborative approach to education. Parents can view real-time updates on their
child's performance, attendance, and participation in school activities, enabling them to
provide timely support and encouragement. This holistic approach to portal management not
only enhances communication between all parties involved but also promotes a more

2
cohesive and collaborative educational experience, ultimately contributing to the academic
success and well-being of the students.

1.4 Benefits

1. Streamlined Administrative Tasks: Automates processes such as admissions,


enrolment, and fee management, reducing paperwork and saving time.
2. Improved Communication: Facilitates easy communication and collaboration
among students, faculty, and staff through online portals, messaging systems, and
discussion forums.
3. Enhanced Academic Monitoring: Provides teachers with tools to track student
progress, identify areas for improvement, and offer timely interventions, leading to
improved academic outcomes.
4. Increased Parent Involvement: Gives parents access to their child's academic
information, including grades and attendance records, fostering a stronger home-
school partnership.
5. Optimized Resource Management: Includes features for managing resources such
as libraries, inventory, and facilities, leading to cost savings and improved operational
efficiency.
6. Centralized Data Management: Stores all academic and administrative data in a
centralized location, making it easily accessible and reducing the risk of data loss or
duplication.
7. Customization and Scalability: Can be customized to suit the specific needs of
different colleges and scaled up as the institution grows.
8. Enhanced Security: Implements robust security measures to protect sensitive data
and ensure compliance with data protection regulations.
9. Efficient Reporting: Generates detailed reports on various aspects of college
operations, facilitating data-driven decision-making and institutional improvement.
10. Integration with Other Systems: Integrates seamlessly with other systems such as
learning management systems and finance systems, ensuring smooth data flow across
the institution

3
1.5 Scope

Without a student information System, managing and maintaining the details of the student is
a tedious job for any organization. Student Information system will store all the details of the
students including their background information, educational qualifications, personal details
and all the information related to their resume.

1.6 Login module

Login module will help in authentication of user accounts. Users who have valid login id and
password can only login into their respective accounts.

1.7 Registration Module

This module will help the student get registered from anywhere if internet is present. This
module will really simplify the task of on paper registration. Also, after successful
registration the user can update information and change their password as and when required.

4
2. LITERATURE SURVEY

2.1 EXISTING SYSTEMS

As the system used in the institute is outdated as it requires paper, files, and binders, which
will require the human workforce to maintain them. To get registered in the institute, a
student in this system should come to the university. Get the forms from the counter while
standing in the queue which consumes a lot of the student’s time as well as of the
management team. As the number of the student increases in the institute, manually
managing the strength becomes a hectic job for the administrator. This computerized system
stores all the data in the database which makes it easy to fetch and update whenever needed.

2.2 DRAWBACKS IN THE EXISTING SYSTEM

 Cannot be accessed by the student from his place


 Manual records have the possibility of getting missed or destroyed due to any
accidents
 It is limited to physical controls
 Security issues
 Searching of records is not easy (Retrieval).
 Time-consuming
 Chances of error is maximum in manual method
 Difficult for administrator to maintain all the records.
 If something is wrong, then the student has to fill a new form again
2.3 PROPOSED SYSTEM

The Proposed methodology maintains all the details and data of the student in web- based
system. Student data can be entered and viewed at any point of time. One can also update/edit
the values that are already uploaded. Student data includes,

 Personal Information
 Academic details (CGPA)
 Achievements of a particular student
 Workshops and events attended
 Online Courses completed
 Project details

5
Each student has separate login that will be automatically generated once if the student gets
enrolled in the college. Students can also view the details at any point of time.

2.4 BENEFITS OF THE PROPOSED SYSTEM

 Completely computerized (no paper work)


 Easy back-up facilities
 No need to wait for someone
 Data Security is high
 Data Integrity is maintained
 Even if the data in the report is wrong, we can easily edit it and take another copy of
it.
2.5 FEASIBILITY ANALYSIS

Whatever we think need not be feasible It is wise to think about the feasibility of any problem
we undertake. Feasibility is the study of impact, which happens in the organization by the
development of a system. The impact can be either positive or negative. When the positives
nominate the negatives, then the system is considered feasible. Here the feasibility study can
be performed in two ways such as technical feasibility and Economical Feasibility.

2.5.1 Technical Feasibility

We can strongly say that it is technically feasible, since there will not be much difficulty in
getting required resources for the development and maintaining the system as well. All the
resources needed for the development of the software as well as the maintenance of the same
is available in the organization here we are utilizing the resources which are available
already.

2.5.2 Economical Feasibility

Development of this application is highly economically feasible. The organization needed not
spend much money for the development of the system already available. The only thing is to
be done is making an environment for the development with an effective supervision. If we
are doing so, we can attain the maximum usability of the corresponding resources. Even after
the development, the organization will not be in condition to invest more in the organization.
Therefore, the system is economically feasible
6
3 MERN STACK

3.1 JavaScript

JavaScript is a scripting, object-oriented, cross-platform programming language. Objects of


host environment can be connected to JavaScript and arrange ways to operate them.

Standard libraries for objects are contained by JavaScript, for such as Array, Date, Math, and
the essence component of programming languages for instance managers, control framework
and statements.

By adding objects, JavaScript could be protracted for many principles, such as:

3.1.1 Client-side JavaScript

JavaScript is developed by implementing objects for controlling the browser and DOM. For
instance, an application is granted by client-side extensions to influence components on an
HTML page and answer to user behaviour like mouse hovers, form input and page
changeover.

3.1.2 Server-side JavaScript

JavaScript is developed by implementing the supplementary objects required to run


JavaScript on the server. For instance, an application is granted by this server-side extension
to connect to a database, transfer data frequently from one request to other section of the
application or execute application with another function file on the server.

In 1996, JavaScript was officially named ECMAScript. ECMAScript 2 was released in 1998
and ECMAScript 3 was released in 1999. It is continuously evolving into today's JavaScript,
now works on all browsers and devices from mobile to desktop. Open standard language can
be used by association to establish their own JavaScript applications. The ECMAScript
Standard is one of the parts of the ECMA-262 specification. ISO has approved the ECMA-
262 standard at ISO- 16262. The ECMAScript standard does not include descriptions for the
DOM, it is standardized by the W3C. The DOM specifies how your scripts display objects.
To get a advance anticipate of the distinctive innovations used when programming with
JavaScript, check out the JavaScript technology analysis article.

7
3.2 ReactJS

React is a JavaScript-based UI development library. Facebook and an open-source developer


community run it. Although react is a library rather than a language, it is widely used in web
development. The library first appeared in May 2013 and is now one of the most commonly
used frontend libraries for web development. React offers various extensions for entire
application architectural support, such as Flux and React Native, beyond mere UI.

3.2.1 Virtual-DOM

Virtual-DOM is a JavaScript object, each object contains all the information needed to create
a DOM, when the data changes it will calculate the change between the object and the real
tree, which will help optimize re-render DOM tree. It can be assumed that is a virtual model
can handle client data.

3.2.2 Component

React is built around components, not templates like other frameworks. A component can be
created by the create Class function of the React object, the starting point when accessing this
library.

ReactJS creates HTML tags unlike we normally write but uses Component to wrap HTML
tags into stratified objects to render.

Among React Components, render function is the most important. It is a function that handles
the generation of HTML tags as well as a demonstration of the ability to process via Virtual-
DOM. Any changes of data at any time will be processed and updated immediately by
Virtual-DOM.

3.2.3 Props and State

Props: are not controlled by Component, actually stands for Properties.

8
The title = “Title” line creates a name attribute with the value "Title". It looks like a function
call. It is true that props are passed to the component in the same way that an argument is
passed to a function.

A component may also have a default prop, so if the component does not pass any props, it
will still be set.

State: private data is controlled by Component.

Like props, sate also holds information about the component. However, the type of
information and how to handle it varies. State works differently than Props. The state is a
component of the component, while props are passed in from the outside into the component.
It should be noted that we should not update the state directly using this. State but always use
setState to update. Update the state of the objects. Use setState to re-renders one component
and all its children. This is great, because you don't have to worry about writing event
handlers like any other language.

3.2.4 Pros of ReactJS

 Update data changes quickly


 React is not a framework so it offloads the constraints of libraries together.
 Easy access to who understands JS

9
3.2.5 Cons of ReactJS

 ReactJS only serves the View tier, but the library size is on par with Angular while
Angular is a complete framework
 Incorporating ReactJS within common MVC frameworks demands reconfiguration.
 Hard to reach for beginners on website developing.

3.2.6 Why React?

React popularity today has eclipsed that of all other front-end development frameworks. Here
is why:

 Easy creation of dynamic applications: React makes it easier to create dynamic web
applications because it requires less coding and offers more functionality, as opposed
to JavaScript, where coding often gets complex very quickly.
 Improved performance: React uses Virtual DOM, thereby creating web applications
faster. Virtual DOM compares the components’ previous states and updates only the
items in the Real DOM that were changed, instead of updating all of the components
again, as conventional web applications do.
 Reusable components: Components are the building blocks of any React application,
and a single app usually consists of multiple components. These components have
their logic and controls, and they can be reused throughout the application, which in
turn dramatically reduces the application’s development time.
 Unidirectional data flow: React follows a unidirectional data flow. This means that
when designing a React app, developers often nest child components within parent
components. Since the data flows in a single direction, it becomes easier to debug
errors and know where a problem occurs in an application at the moment in question
 Small learning curve: React is easy to learn, as it mostly combines basic HTML and
JavaScript concepts with some beneficial additions. Still, as is the case with other
tools and frameworks, you have to spend some time to get a proper understanding of
React library.
 It can be used for the development of both web and mobile apps: We already know
that React is used for the development of web applications, but that’s not all it can do.
There is a framework called React Native, derived from React itself, that is hugely
popular and is used for creating beautiful mobile applications. So, in reality, React can
10
be used for making both web and mobile applications.
 Dedicated tools for easy debugging: Facebook have released a Chrome extension
that can be used to debug React applications. This makes the process of debugging
React web applications faster and easier. The above reasons more than justify the
popularity of the React library and why it is being adopted by a large number of
organizations and businesses. Now let’s familiarize ourselves with React features.
3.3 NPM & NodeJS

Node.js is an open source, a system application and furthermore is an environment for


servers. Nodejs is an independent development platform built on Chrome's JavaScript
Runtime that we can build network applications quickly and easily. Google V8 JavaScript
engine is used by Node.js to execute code. Moreover, a huge proportion of essential modules
are written in JavaScript.

Node.js accommodate a built-in library which allows applications to serve as a Web- server
left out demanding software like Apache HTTP Server, Nginx or IIS.

An event-driven, non-blocking I / O mechanisms (Input / Output) are implemented by


Node.js. It optimizes application throughout and is extremely high extensible. Node.js use
asynchronous in it functions. Therefore, Node.js processes and executes all tasks in the
background (background processing). Products that have a lot of traffic are applying Node.js.
Nonetheless, Node.js handle the application that need to spread expeditiously, develop
innovation, or build Start-up projects as rapidly as possible.

Node.js is a server-side platform built on Google Chrome's JavaScript Engine (V8 Engine).
Node.js was developed by Ryan Dahl in 2009 and its latest version is v0.10.36. The
definition of Node.js as supplied by its official documentation is as follows − Node.js is a
platform built on Chrome's JavaScript runtime for easily

building fast and scalable network applications. Node.js uses an event-driven, non- blocking
I/O model that makes it lightweight and efficient, perfect for data-intensive real-time
applications that run across distributed devices. Node.js is an open source, cross-platform
runtime environment for developing server-side and networking applications. Node.js
applications are written in JavaScript, and can be run within the Node.js runtime on OS X,
Microsoft Windows, and Linux. Node.js also provides a rich library of various JavaScript

11
modules which simplifies the development of web applications using Node.js to a great
extent. Node.js = Runtime Environment+ JavaScript Library.

npm, Inc. is a company founded in 2014, and was acquired by GitHub in 2020. npm is a
critical part of the JavaScript community and helps support one of the largest developer
ecosystems in the world. npm is lots of things.

 npm is the package manager for Node.js. It was created in 2009 as an open-source
project to help JavaScript developers easily share packaged modules of code.
 The npm Registry is a public collection of packages of open-source code for Node.js,
front-end web apps, mobile apps, robots, routers, and countless other needs of the
JavaScript community.
 npm is the command line client that allows developers to install and publish those
packages.
3.3.1 Application using NodeJS

 WebSocket server
 Notification system
 Applications that need to upload files on the client
 Other real-time data applications

3.3.2 Features of NodeJS

 Following are some of the important features that make Node.js the first choice of
software architects.
 Asynchronous and Event Driven: All APIs of Node.js library is asynchronous, that
is, nonblocking. It essentially means a Node.js based server never waits for an
 API to return data. The server moves to the next API after calling it and a notification
mechanism of Events of Node.js helps the server to get a response from the previous
API call.
 Very Fast: Being built on Google Chrome's V8 JavaScript Engine, Node.js library is
very fast in code execution.
 Single Threaded but Highly Scalable: Node.js uses a single threaded model with
event looping. Event mechanism helps the server to respond in a non-blocking way
and makes the server highly scalable as opposed to traditional servers which create
limited threads to handle requests. Node.js uses a single threaded program and the
12
same program can provide service to a much larger number of requests than
traditional servers like Apache HTTP Server.
 No Buffering: Node.js applications never buffer any data. These applications simply
output the data in chunks.
 License: Node.js is released under the MIT license.

3.3.3 Pros of NodeJS

 Node.js is the exclusive application that with only a single thread, it can obtain and
handle numerous connections. Building new threads for each query is not needed,
therefore the structure expends the least amount of RAM and run rapidly. Secondly,
Node.js produces the most of server property without generate latency with the
JavaScript’s non-blocking I/O.
 JSON APIs JSON Web services can take advantages of that because of the event-
driven, non-blocking I/O structures and JavaScript-enabled model.
 Single page application NodeJS is very suitable with an application on a single page.
Node.js has the capability to handle different requests concurrent and quick return.
Node JS should be used in an application that does not have to reload the page,
including users who makes a vast number of requests and need a quick procedure to
show professionalism.
 Shelling tools Unix Node.js usually uses Unix to work. They can handle multiple
processes and return them for best performance. Programmers often use Node.js to
build real Web applications like chat, feeds, etc.
 Streaming Data Typical websites send HTTP requests and also receive responses.
Node.js can handle many questions and feedback, so they are suitable if the developer
wants to create an application on the page. In addition, Node.js also builds proxies to
stream the data, this is to ensure maximum operation for other data streams.
 Real-time Web Application Node.js is sufficient to develop real-time innovations
like chat apps, social networking services like Facebook, Twitter because of the
opening of mobile application.

3.3.4 Cons of NodeJS

 Resource-intensive applications, Node.js is written in C ++ & JavaScript, so when


programmers need to handle applications that use a lot of file conversion, video
13
encoding, decoding, etc., they should not be used Node.js. Programmers need to use it
more carefully in this case.
 The final purpose of NodeJS is like other programming languages such as Ruby, PHP,
.NET, Python, that is developing web application. Therefore, do not expect NodeJS to
outperform other language for now. But with NodeJS the application can be
developed successfully as expected

3.3.5 Who use NodeJS?

 Following is the link on GitHub wiki containing an exhaustive list of projects,


application and companies which are using Node.js. This list includes eBay, General
Electric, GoDaddy, Microsoft, PayPal, Uber, Wikipin, Yahoo!, and Yammer to name
a few.
 Projects, Applications, and Companies Using Node

3.3.6 Concepts
The following diagram depicts some important parts of Node.js which we will discuss in
detail in the subsequent chapters.

14
Figure 2: Features of NodeJS [2]

3.3.7 NodeJS should not be used when

 Build resource-intensive applications: Do not use Node.js when creating a video


converter application. Node.js often comes down to bottlenecks when working with
large files.
 An All-CRUD-only application: Node.js is not faster than PHP when doing heavy
I/O tasks. In addition, with the long-term stability of other webserver scripts, its
CRUD tasks have been optimized. Node.js will come up with odd APIs and never be
used.
 Stability in the application: Within 11 years of development (2009-2020), the
current version of Node.js is already v14.2.0. Every API can be changed – in a way
that is not backwards compatible.
 Lack of knowledge about Node.js: Node.js is extremely dangerous in this case, you
will fall into a world full of difficulties. With most non-blocking/async APIs, not
understanding the problem will cause an error that you do not even know where it
came from. Moreover, when the Node.js community is not strong enough, and there
will be less support from the community.

15
3.3.8 NodeJS should be used when

 Building RESTful API (JSON). You can use Node.js in building RESTful API
(JSON). They handle JSON very easily, even more than JavaScript. API servers
 when using Node.js usually do not have to perform heavy processing, but the number
of concurrent requests is high.
 Applications that demand alternative connection protocols, not just http. With TCP
protocol backing, any custom protocol can be built easily.
 Real-time applications
 Stateful websites. Every request on the invariable procedure is handled by Node.js,
therefore building caching is simpler: store it to a comprehensive variable then all
requests can approach the cache. The status of one client can be saved and shared with
other clients and do not have to go through external memory.
3.4 Express.js

Express.js is a framework built on top of Nodejs. It provides powerful features for web or
mobile development. Express.js supports HTTP and middleware methods, making the API
extremely powerful and easy to use.

Express implements extra features to developer which help them get a better programming
environment, not scaling down the speed of NodeJS.

Importantly, the well-known frameworks of NodeJS apply Express.js as a substance function,


for instance: Sails.js, MEAN.

3.5 MongoDB

MongoDB is an open-source database; it is also the leading NoSQL (*) database currently
used by millions of people. It is written in one of the most popular programming languages
today. In addition, MongoDB is cross-platform data that operates on the concepts of
Collections and Documents, providing high performance with high availability and ease of
expansion.

(*) NoSQL is a source database format that does not use Transact-SQL to access information,
this database was developed on JavaScript Framework on JSON data type. With its

introduction, it has overcome the disadvantages of RDBMS relational data model to improve
operating speed, functionality, model scalability, cache.

16
Furthermore, MongoDB is a cross-platform database, performing on Collection and
Document approach, it produces sharp production, huge availability, and effortless
scalability.

3.5.1 Commonly used terms in MongoDB

 _id: Almost every document required this field. The _id field illustrates a exceptional
value in the MongoDB document. The _id field can also be interpreted as the primary
key in the document. If you add a new document, MongoDB will automatically
generate a _id representing that document and be unique in the MongoDB database
 Collection: A group of many documents in MongoDB. Collection can be interpreted
as a corresponding table in the RDBMS (Relational Database Management System)
database. Collection resides in a single database. Collections do not have to define
columns, rows or data types first
 Cursor: This is a pointer to the outcome set of a query. The client can emphasize
over a cursor to get the result.
 Database: The location of the collections, similar to the RDMS database that contains
the tables. Each Database has a separate file stored on physical memory. Some
MongoDB owners may contain various databases
 Document: A transcript belonging to a Collection. Documents, in turn, include name
and value fields.
 Field: A name-value pair in a document. A document may not need all the fields. The
fields are like columns in a relational database.
 JSON: Short for JavaScript Object Notation. Human readability is in the plain text
format representing structured data. JSON currently supports a lot of programming
languages.
 Index: Exclusive data structures used to save a small allocation of data sets for simple
scannin0g. The index puts the value of a individual field or sets of fields, sorted by the
value of these fields. Index effectively supports the analysis of queries. Without an
index, MongoDB will have to scan all the documents of the set to choose
the documents that pair the query. This scan is ineffective and requires MongoDB to progress
a vast amount of data

17
MongoDB Atlas is MongoDB's cloud database launched in 2016 on AWS, Microsoft Azure
and Google Cloud Platform.

The data in each Cluster in the Atlas is stored by Replication mechanism, with 3 nodes: 1
master (primary) and 2 slaves (secondary).

17

Figure 3: MongoDB Atlas screenshot [3]

3.5.2 Features and Components

 Document Model: MongoDB uses a flexible document model, where data is stored
in JSON-like documents called BSON documents. BSON documents are schema-less,
meaning each document can have a different structure, allowing for easy handling of
evolving data.
 Scalability: MongoDB is designed to scale horizontally across multiple servers,
enabling it to handle large amounts of data and high traffic loads. It supports
automatic sharding, which distributes data across multiple machines in a cluster,
allowing for seamless scalability.
 Querying and Indexing: MongoDB provides a powerful query language that
supports rich queries, including filtering, sorting, aggregations, and geospatial queries.
It also supports secondary indexes to optimize query performance.

18
 Replication: MongoDB supports replica sets, which are a group of database servers
that maintain the same data set. Replica sets provide high availability and automatic
failover, ensuring data durability and continuous service availability.
 High Availability: MongoDB offers built-in replication and automatic failover,
allowing for fault tolerance and high availability. In the event of a primary node
failure, a secondary node can automatically take over as the new primary, ensuring
uninterrupted service.
 Ad hoc Updates: MongoDB supports flexible updates, allowing for atomic
modifications to individual fields or entire documents. This makes it easy to evolve
the data model over time without requiring extensive schema migrations.
 Aggregation Framework: MongoDB provides a powerful aggregation framework
that allows for complex data transformations, calculations, and analytics. It supports
grouping, sorting, filtering, and other operations to process and analyze data within
the database.
 Geospatial Capabilities: MongoDB has built-in support for geospatial indexing and
queries, making it a suitable choice for applications that require location-based
services or spatial data processing.
 Full-Text Search: MongoDB offers a text search feature that enables efficient
searching of text content across collections, with support for language-specific
stemming, tokenization, and relevance ranking.
 Integration and Ecosystem: MongoDB provides official drivers for various
programming languages, making it easy to integrate with different application stacks.
It also has a vibrant ecosystem with numerous libraries, frameworks, and tools built
around it.
MongoDB's flexible data model, scalability, and rich feature set make it well-suited
for a wide range of use cases, including content management systems, real-time
analytics, mobile applications, IoT (Internet of Things) platforms, and more.
3.5.3 Why MongoDB?

MongoDB offers several advantages that make it a popular choice for many developers and
organizations:

1. Flexibility: MongoDB's flexible document model allows for dynamic and evolving
schemas. It enables developers to store and retrieve data in a format that closely
resembles their application objects, eliminating the need for complex object-

19
relational mapping (ORM) layers.

2. Scalability: MongoDB's architecture supports horizontal scaling by distributing data


across multiple servers or clusters. It can handle massive amounts of data and high
traffic loads by automatically partitioning data through sharding. This scalability is
crucial for applications that need to grow and handle increasing data volumes.
3. Performance: MongoDB's design and indexing capabilities provide high-
performance data access. It can efficiently execute complex queries, aggregations, and
geospatial operations. Additionally, its ability to store related data together in a
document reduces the need for costly joins commonly found in relational databases.
4. High Availability and Fault Tolerance: MongoDB's replica sets ensure data
redundancy and automatic failover. By maintaining multiple copies of data across
different servers, it provides high availability and ensures continuous service even in
the event of hardware failures or network issues.
5. Developer Productivity: MongoDB's JSON-like document format and query
language (MongoDB Query Language or MQL) make it developer-friendly. It allows
developers to work with data in a familiar and intuitive manner. The absence of strict
schemas allows for agile development, as it accommodates changing requirements
without extensive schema migrations.
6. Ad Hoc Updates: MongoDB's atomic and flexible update operations allow for easy
modification of data at a granular level. It supports efficient updates to
7. individual fields within a document, reducing the need to retrieve and update entire
records.
8. Rich Querying and Indexing: MongoDB provides a powerful query language and
supports various types of indexes, including single-field indexes, compound indexes,
geospatial indexes, and full-text search indexes. These features enable efficient data
retrieval and complex data analysis.
9. Ecosystem and Community: MongoDB has a thriving ecosystem with extensive
community support. It offers official drivers for various programming languages and
has integrations with popular frameworks and tools. The active community provides
resources, tutorials, and best practices, making it easier for developers to get started
and find help when needed.
10. Horizontal Integration: MongoDB can be integrated with other components of the
modern technology stack. It works well with popular programming languages,

20
frameworks, and platforms, making it suitable for building applications that require
diverse technologies and services.
Overall, MongoDB's flexibility, scalability, performance, developer-friendly features,
and extensive ecosystem make it a compelling choice for applications that handle
large volumes of data, require high availability, and need the flexibility to adapt to
changing requirements.
3.6 MERN Stack in Website Development

3.6.1 Concept of Stack technology

The technical stack is a combination of technologies / frameworks / programming languages,


etc. to create a complete software.

With current software, there are usually two parts: client side and server side, also known as
frontend and backend. Therefore, people also split the backend stack, the frontend stack as
well. We often use the first letter to name the technical stack: LAMP (Linux, Apache,
MySQL, PHP), MEAN (MongoDB, Express, Angular, NodeJS).

3.6.2 Concept of MERN Stack

The MERN stack is a complete open-source combination, all JavaScript-related technologies


are also the hottest today: MongoDB, Express.js, React / React Native, NodeJS. People use
the MERN stack to build Universal React App.

3.6.3 Highlights in MERN Stack

 Hot Reloading for React Components


 The code snippets are divided by React Router
 Multi-language support
 Generate code support
 Modular structure
 Docker support
 Can customize the MERN version for individual users

21
4. Tools Used

4.1 Visual Code Editor

Visual Studio Code (VS Code) is a lightweight, open-source code editor developed by
Microsoft. It has gained significant popularity among developers due to its extensive features,
flexibility, and robust ecosystem. Here's an overview of the key aspects of Visual Studio
Code:

1. Cross-Platform Support: VS Code is available for Windows, macOS, and Linux,


making it a versatile choice for developers regardless of their operating system.
2. Lightweight and Performance: VS Code is designed to be lightweight and fast. It
has a minimalistic user interface and consumes fewer system resources, allowing for
smooth and responsive performance even when working with large codebases.
3. Integrated Development Environment (IDE) Features: Although VS Code is a
code editor, it offers many features typically associated with full- fledged IDEs. It
includes functionalities like code completion, intelligent code suggestions, syntax
highlighting, code formatting, debugging capabilities, and version control system
integration (such as Git).
4. Customization and Extensions: VS Code can be tailored to individual preferences
through its vast library of extensions. There are extensions available for various
programming languages, frameworks, and tools, allowing developers to enhance their
workflows, productivity, and language-specific support.
5. Integrated Terminal: VS Code provides an integrated terminal, allowing developers
to run commands and interact with their project's shell without leaving the editor. This
feature streamlines development tasks, making it convenient to execute commands
and manage workflows within a single interface.
6. Version Control Integration: VS Code seamlessly integrates with popular version
control systems, most notably Git. It offers features like source control management,
visual diff tools, and the ability to stage, commit, and push changes directly from the
editor.
7. Debugger: VS Code includes a built-in debugger that supports multiple languages
and frameworks. It allows developers to set breakpoints, step through code, inspect
variables, and diagnose issues during the debugging process.
8. IntelliSense: VS Code incorporates IntelliSense, a powerful code- completion feature

22
that provides context-aware suggestions and autocompletion while coding. It assists
developers by offering relevant code snippets, function signatures, and documentation
for libraries and APIs.
9. Task Automation: VS Code supports task automation through its task runner system.
It allows developers to define custom tasks, such as compiling code, running tests,
and executing build scripts. These tasks can be executed directly within the editor or
through keyboard shortcuts.
10. Collaboration and Live Share: VS Code offers Live Share, a feature that enables
real-time collaboration with other developers. It allows multiple people to work
together in the same codebase, facilitating pair programming, code reviews, and
troubleshooting sessions.
11. Accessibility: Visual Studio Code prioritizes accessibility by offering features like
keyboard navigation, screen reader support, and customizable accessibility settings. It
aims to ensure that the editor is accessible to a diverse range of developers.

23
5. System Requirements Specification

5.1 Hardware Requirements

Processor : i3 7 Gen

RAM : 4 GB

Hard Disk : 1 TB

Monitor : 15” Color monitor Key Board: 104 Keys

5.2 Software Requirements

Operating System : Windows 10

Language : ReactJS, HTML, CSS, JavaScript

Database : MongoDB

IDE : VS Code Editor

24
6. System Design

6.1 Introduction

System design is a process through which requirements are translated into a representation of
software. Initially the representation depicts a holistic view of software. Subsequent
refinement leads to a design representation that is very close to source code. Design is a place
where quality fostered in software development. Design provides us with representation of
software that can be assessed for quality; this is the only way that can accurately translate the
customer requirements into finished software product or system. System design serves as the
foundation for all software engineering and software maintenance steps that follow.

We look the design process from three distinct perspectives:

 Conceptual Design
 Logical Design
 Physical Design
The higher view is the conceptual view, followed by the logical view and finally the physical
view. In designing an application, we generally begin and end each phase in a sequentially
order, although they may overlap one another along the way.

6.1.1 Conceptual Design

Conceptual Design is the process of acquiring and evaluating, documenting and then
validating what the user envisions to be the business relation. It identifies the user and
business requirements of the application and leads to a business solution as seen by the user.

All applications are built to solve business problems, and it is important to pay close attention
to principle that the business need drives application development. Atany point in the design
process, the current state of the design should be directly traceable to a business problem and
requirements.

To achieve this conceptual design is driven by developing usage scenarios. These scenarios
are a direct representation of the user’s view of the solution to a specific

business problem. A conceptual view places the emphasize on solving a business problem
and deriving a solution that corresponds to the needs and requirements of the users. It is
based on deriving the behavior of the solution32with a primary emphasizes on the user.
5

25
Beginning with a emphasis on the activities of the business rather than aspects of software
development, underscores the fact that systems exists to serve the business. A strong focus on
the user in the beginning of the project will help in maintaining a proper perspective
throughput the development lifecycle. The conceptual design results in the first description of
what the system does to solve the business problem articulated in the vision/scope document.

6.1.2 Logical Design

Logical Design derives business objects and their related services directly from these usage
scenarios. The logical view of the solution provides a basis for evaluating different physical
options. It also formalizes the solution for the project team.

The idea of the application is that the system first emerges in logical design. Its boundaries
and business objects and it contain the system definition. Logical design specifies the
interfaces between the system and external entities, such as users and other systems. Within a
system there may be a number of sub-systems, and these boundaries are also specified.

Logical System Design consists of the following steps:

 Input/Output Specifications
 File Specifications
 Processing Specifications
Logical design should be technologically independent as possible, in order to separate system
behaviour issues from system implementation issues. Implementation constraints should only
be considered only after the project team verifies that the essential behaviour has been
incorporated onto a logical design. This approach does not establish a technical direction until
the system is well understood and documented.

6.1.3 Physical Design

The purpose of Physical Design is to translate the logical design into a solution that can be
implemented effectively, according to performance, administration and development process
requirements. This physical view should correctly implement the desired system behavior
while meeting the constraints imposed by the technology.

In Physical Design, the perspective shifts from an abstraction of system behavior to an


implementation of the behavior. Whereas the logical design is largely technology
32
independent, physical design is necessarily tied to6 chosen set of technologies, these being the

26
hardware and software on which the application will run. The aim of physical design is to
specify how to build portioned applications from software components. The interaction of
these components through defined interfaces results in the desired behavior of the system as a
whole. The rules for communicating between components are defined by interaction
standards: what a component does and how it communicates are major considerations in
physical design.

1. Physical design consists of the following steps:


 Design the physical media
 Specify input/output media.
 Design the database and specify backup procedures.
 Design physical information flow through the system
2. Plan the system implementation
 Prepare a conversion schedule target date.
 Determine training procedure, courses and timetable
3. Device a test and implementation plan
4. Specify any new Hardware/Software usage
5. Update benefits, costs, conversion date and system constraints.

6.2 UML Diagrams

6.2.1 Introduction

Design is the first step in the development phase for an engineered product or system. Design
is the place where quality is fostered in software development. Design is the only way that we
can accurately translate a user’s requirements into a finished software product or system.
Software design serves as the foundation for all software engineers and software maintenance
steps that follow. Without design we risk building an unstable design -one that will fail when
small changes are made, one that may be difficult to test, and one whose quantity cannot be
accessed until late in the software engineering process.

Taking software requirements specification document of analysis phase as input to the design
phase we have drawn Unified Modelling Language (UML) diagrams. UML depends on the
visual modelling of the system. Visual modelling is the process of taking the information
32 some sort of standards set of graphical
from the model and displaying it graphically using
7
elements.

27
UML Diagrams are drawn using the Pace Star UML Diagrammed Software. We seem to able
to understand complexity better when it is displayed to us visually as opposed to written
textually. By producing visual models of a system, we can show how system works on
several levels. We can model and the interactions between the users and the system.

6.2.2 Types of UML Diagrams

Each UML diagram is designed to let developers and customers view a software system from
a different perspective and in varying degrees of abstraction. UML diagrams commonly
created in visual modeling tools include

6.2.2.1 Use Case Diagram displays the relationship among actors and use cases

Figure 5: Use Case Diagram [5]

6.2.2.2 Interaction Diagram

Sequence Diagram display the time sequence of the object participating in the interaction.
This consists of the vertical dimension (time) and horizontal dimension (different time).
32
8

28
Figure 6: Sequence Diagram [6]

State Diagram displays the sequence of states that an object of an interaction goes through
during its life in response to received stimuli, together with its response and actions.

Figure 7: State Diagram [7]

32
9

29
6.2.2.3 Collaboration Diagram displays an interaction organized around the objects and
their links to one another Numbers are used to show the sequence of messages.

Figure 8: Collaboration Diagram [8]

Activity Diagram displays a special state diagram where most of the states are action states
and most of the transitions are triggered by completion of the actions in the source states.
This diagram focuses on flows driven by internal processing.

6.2.2.4 Physical Diagrams

Physical Diagram is further divided into 2 types: -

6.2.2.5 Component Diagram displays the high-level packaged structure of the code itself
Dependencies among components are shown, include source code components, binary code
components, and executable components. Some components exist at compile time, at link
time, at run times well as at more than one time.

Deployment Diagram displays the configuration of run-time processing elements and the
software components, processes, and objects that live on them. Software component instances
represent run-time manifestations of code units.

33
0

30
6.3 E-R Diagram

Entity-Relationship Model

The Entity-Relationship data model is based on a perception of a real world, which is consists
of set of basic objects called entities and relationships among these objects. An entity is an
object that exists and is distinguishable from other objects/entity is an object as a concept
meaningful to the organization. An entity set is a set of entities of the same type. A primary
key is an attribute which when take, allows us to identify uniquely an entity in the entity set.

Before explaining the ER diagram of the student management system, the following labels
are used. These are as follows.

Entity: In a relational database, it represents the table in which all the row represents an
entity instance. In an entity, the primary piece of code is called an entity class, and all the
entities can be utilized with the help of a helper class.

Attribute: In the Database management system, the attributes refer to the database
component. The database component includes a table. The attribute

also refers to the field of the database. It also specifies the instances in the database column.

Relationship: In the Database management system, a relationship is present between the two
relational database tables. This is possible when the foreign key of one table references the
primary key of another table. With the help of relationships, we can store and divide the data
in the table.

33
1

31
E-R diagram for college

6.4 Data Flow Diagram

A Data Flow Diagram (DFD) is a diagram that describes the flow of data and the processes
that change or transform data throughout a system. The Data Flow Diagram reviews the
current physical system, prepares input and output specification, specifies the implementation
plan etc.

Four basic symbols are used to construct data flow diagrams. They are symbols that represent
data source, data flows, and data transformations and data storage. The points at which data
are transformed are represented by enclosed figures, usually circles, which are called nodes.
33
2

32
6.4.1 Data Flow Diagram Symbols: -

6.4.2 Steps to Construct Data Flow Diagrams

Four steps are commonly used to construct a DFD: -

i. Process should be named and numbered for easy reference. Each name should be
representative of the process.
ii. The direction of flow is from top to bottom and from left to right.
iii. When a process is exploded into lower-level details they are numbered.
iv. The names of data stores, sources and destinations are written in capital letters.

6.4.3 Rules for constructing a Data Flow Diagram

i. Arrows should not cross each other.


ii. Squares, Circles and files must bear names.
iii. Decomposed data flow squares and circles can have same names
iv. Choose meaningful names for dataflow.

33
3

33
Context Diagram USER

6.4.4 First-Level DFD FOR ADMIN

To elaborate more on the context diagram, the 1st level in DFD is applied. DFD level 1 gives
more specificity to the idea given in DFD level 0. Therefore, DFD level 1 is the expanded
version of the context.

33
4

34
6.4.5 First-Level DFD FOR STUDENT

33
5

35
6.4.6 Second Level DFD FOR ADMIN

2-level DFD goes one process deeper into parts of 1-level DFD. It can be used to project or
record the specific/necessary detail about the system's functioning.

33
6

36
6.4.7 Second-Level DFD FOR STUDENT

33
7

37
7. TESTING
Testing is the integral part of any System Development Life Cycle insufficient and interested
application tends to crash and result in loss of economic and manpower investment besides
user's dissatisfaction and downfall of reputation.

“Software Testing can be looked upon as one among much process, an organization performs
and that provides the last opportunity to correct any flaws in the developed system. Software
Testing includes selecting test data that have more probability of giving errors." The first step
in System testing is to develop the plan that all aspect of system Complements, Correctness,
Reliability and Maintainability.

Software is to be tested for the best quality assurance, an assurance that system meets the and
requirement for its intended use and performance.

System Testing is the most useful practical process of executing the program with the implicit
intention of finding errors that makes the program fail.

7.1 Types of Testing

7.1.1 Black Box (Functional) Testing

Testing against specification of system or component. Study it by examining its inputs and
related outputs. Key is to devise inputs that have a higher likelihood of causing outputs that
reveal the presence of defects. Use experience and knowledge of domain to identify such test
cases. Failing this a systematic approach may be necessary. Equivalence partitioning is where
the input to a program falls into a number of classes, e.g., positive numbers vs. negative
numbers. Programs normally behave the same way for each member of a class. Partitions
exist for both input and output. Partitions may be discrete or overlap. Invalid data (i.e.,
outside the normal partitions) is one or more partitions that should be tested.

Internal System design is not considered in this type of testing. Tests are based on
requirements and functionality.

This type of test case design method focuses on the functional requirements of the software,
ignoring the control structure of the program. Black box testing attempts to find errors in the
following categories:
33
8

38
 Incorrect or missing functions
 Interface errors
 Errors in data structure or external database access
 Performance error
 Initialization and termination errors

7.1.2 White Box (Structural) Testing

Testing based on knowledge of structure of component (e.g., by looking at source code).


Advantage is that structure of code can be used to find out how many tests case need to be
performed. Knowledge of the algorithm (examination of the code) can be used to identify the
equivalence partitions. Path testing is where the tester aims to exercise every independent
path through the component. All conditional statements tested for both true and false cases. If
a unit no control statements, there will be up to 2n possible paths through it. This
demonstrates that it is much easier to test small program units than large ones. Flow graphs
are a pictorial representation of the paths of control through a program (ignoring assignments,
procedure calls statements). Use flow graph to design test cases that execute each path. Static
tools may be used to make this easier in programs that have a complex branching structure. If
a unit no control statements, there will be up to 2n possible paths through it. Tools support.
Dynamic program analysers instrument a program with additional code. Typically, this will
count how many times each statement is executed. At end print out report showing which
statements have and have not been executed. Problems with flow graph derived testing.

 Data complexity could not take into account


 We cannot test all into account
 In really only possible at unit and module testing stages because beyond that
complexity is too high.
This testing is based on knowledge of the internal logic of an application's code. Also known
as a Glass Box Testing Internal software and code working should be known for this type of
testing. Tests are based on coverage of code statements, branches, paths, conditions. If a unit
no control statements, there will be up to 2n possible paths through it.

33
9

39
7.1.3 Unit Testing

Unit testing concentrates on each unit of the software as implemented in the code. This is
done to check syntax and logical errors in programs. At this stage, the test focuses on each
module individually, assuring that it functions properly as a unit. In our case, we used
extensive white- box testing at the unit testing stage.

A developer and his team typically do the unit testing do the unit testing is done in parallel
with coding; it includes testing each function and procedure.

7.1.4 Incremental Integration Testing

Bottom-up approach for testing i.e., continuous testing of an application as new functionality
is added; Application functionality and modules should be independent enough to test
separately done by programmers or by testers.

7.1.5 Integration Testing

Testing of integration modules to verify combined functionality after integration Modules are
typically code modules, individual applications, client and server and distributed systems.

7.1.6 Functional Testing

This type of testing ignores the internal parts and focus on the output is as per requirement or
not Black box type testing geared to functionality requirements of an application.

7.1.7 System Testing

Entire system is tested as per the requirements. Black box type test that is based on overall
requirement specifications covers all combined parts of a system.

7.1.8 End-to-End Testing

Similar to system testing involves testing of a complete application environment in a situation


that mimics real-world use, such as interacting with a database using network
communications, or interacting with hardware, applications, or system if appropriate.

40
7.1.9 Regression Testing

Testing the application as a whole for the modification in any module or functionality.
Difficult to cover all the system in regression testing so typically automation tools are used
for these testing types.

7.1.10 Acceptance Testing

Normally this type of testing is done to if meets the customer specified requirements. User or
customers do this testing to determine whether to accept application.

7.1.11 Performance Testing

Term often used interchangeably with "stress" and "load" testing. To check whether system
meets performance requirements, used different performance and load tools to do this.

7.1.12 Alpha Testing

In house virtual user environment can be created for this type of testing. Testing is done at the
end of development Still minor design changes may be made as a result of such testing.

7.1.13 Beta Testing

Testing typically done by end-users or others. This is final testing before releasing application
for commercial purpose.

41
8. Screenshots

Login Page

Teacher Dashboard

42
Add Papers or Assignments

Attendance

43
Uploading Marks

Edit Schedule

44
Teache Profile

Student Dashboard

45
View and Join New Papers

Check Attendance

46
Check Marks

Check TimeTable

47
Join Paper

Student Profile

48
Admin Dashboard

Registration Page Student

49
Registration Page Staff

49

50
9. CONCLUSION
The student profile system is an invaluable tool that serves multiple purposes in educational
institutions. It provides a centralized platform for storing and managing comprehensive
information about students, including personal details, academic records, achievements, and
extracurricular activities. The system streamlines administrative tasks, enhances
communication between stakeholders, and enables data-driven decision-making.

By utilizing a student profile system, educational institutions can improve efficiency and
productivity. It eliminates the need for manual record-keeping and allows for easy retrieval of
student information, saving time and effort for administrators and teachers. With the system's
ability to generate reports and analytics, educators can gain insights into student performance,
identify areas of improvement, and tailor instructional strategies accordingly.

The student profile system is an essential tool for educational institutions, providing a
centralized platform for managing student information, streamlining administrative tasks,
enhancing communication, and promoting student success. Its implementation can lead to
improved efficiency, informed decision-making, and a more personalized educational
experience for students.

50

51
REFERENCES

References to Websites:
[1] JavaScript [Internet]. Mozilla.org. Available fromJavaScript | MDN (mozilla.org)

[2] NodeJS Introduction [Internet]. Tutorialspoint.com. Available from:

https://www.tutorialspoint.com/nodejs/nodejs_introduction.html

[3] NodeJS Pros and Cons [Internet]. Mindinventory.com. Available from:

[4] The Advantages and Disadvantages of Node.js Web App Development(mindinventory.com)

[5] Express.js Introduction [Internet]. Mozilla.org. Available from: Express/Node introduction -

Learn web development | MDN (mozilla.org)

[6] MongoDB [Internet]. Mongodb.com. Available from: Introduction to MongoDB — MongoDB

Manual

[7] Virtual-DOM [Internet]. Reactjs.org. Available from: Virtual DOM and Internals – React

(reactjs.org)

[8] Component [Internet]. Reactjs.org. Available from: Components and Props – React (reactjs.org)

[9] Pros and Cons of ReactJS [Internet]. Javatpoint.com. Available from: Pros and Cons of ReactJS -

javatpoint

[10] Stack technology [Internet]. Stackshare.io. Available from:

[11] What is a Tech Stack? What tools do popular tech companies use in 2023?(stackshare.io)

[12] MERN stack concept [Internet]. Mongodb.com. Available from: What Is The MERN

Stack? Introduction & Examples | MongoDB

52
51
References to Books:
[1] Elmarsi and Navathe, Fundamentals of Database System (Third Edition),
Addision Wesley.

[2] Ian Somerville, Software Engineering, Third Edition, Pearson Education.

[3] Ali Bahrami, Object-Oriented System Development, Third Edition, TataMcGraw Hill
Edition.

References to Figures:

[1] https://res.cloudinary.com/practicaldev/image/fetch/s--Oif7MEWJ--
/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-
uploads.s3.amazonaws.com/i/jekefjcp3dzt81m9dine.png

[2] https://www.tutorialspoint.com/nodejs/images/nodejs_concepts.jpg

[3] https://global.discoursecdn.com/freecodecamp/optimized/3X/9/e/9ebd85 0df6acb


3bab80847bc34bc57166c19bedd_2_1035x588.png

[4] https://upload.wikimedia.org/wikipedia/commons/thumb/9/9a/Visual_Studio_C
ode_1.35_icon.svg/2048px-Visual_Studio_Code_1.35_icon.svg.png

[5] https://www.researchgate.net/figure/The-use-case-diagrams-of-the-Send-Message-
functionality-from-the-GoPhone_fig5_319914546

[6] https://www.researchgate.net/figure/Sequential-diagram-for-Manipulating- Courses-use-case-


which-demonstrates-MVC-Model-Design_fig2_268300075

[7] http://www.cs.sjsu.edu/~pearce/modules/lectures/oop/threads/threads.htm

[8] https://www.sourcecodesolutions.in/2011/04/collaboration-diagrams-for- passport.html

53

You might also like