Acknowledgment

I would like to express my sincere gratitude to everyone who has supported me throughout my virtual
internship in web development. First, I would like to thank Coginfy for providing me with this
incredible opportunity to enhance my skills and gain practical experience in the field of web
development.

I am deeply thankful to my supervisor, for their guidance, feedback, and encouragement during this
internship. Their expertise and insights have been invaluable in helping me understand key concepts
and apply them effectively in real-world projects.

I would also like to acknowledge my fellow interns and colleagues for their collaboration and support,
making this virtual experience both educational and enjoyable. Finally, I want to express appreciation
to my family and friends for their continuous motivation and encouragement.

This internship has been a transformative experience, and I am grateful for the skills and knowledge I
have gained, which will undoubtedly benefit my future endeavors in web development.
 Cognifyz Cognifyz Technologies
Where Data Meets Intelligence

Internship Completion Certificate

Date -17/05/2024

This is to certify that Kunal Ranjan (Intern ID: CTIAD/X9/C29738652) pursuing

B.Tech from Cambridge Institute Of Technology, was working as a Web Develo-
pment Intern with Cognifyz Technologies from May 2024 - June 2024.

During this period, he has served as a Web Development Intern and has
displayed remarkable dedication, sincerity, and a strong desire to learn. He has
exhibited exceptional data analysis skills and effective communication
abilities. Moreover, his attention to detail has been truly impressive.

He has consistently approached new assignments and challenges with

enthusiasm, showcasing his passion for Web Development. His commitment
and willingness to acquire new knowledge and skills have been evident
throughout his internship.

We extend our best wishes to Kunal Ranjan for a successful future, and we have
no doubt that he will continue to excel in the field of Web Development.

With Regards,
Cognifyz Technologies

[email protected] www.cognifyz.com
 ABSTRACT

The internship was focused on learning various aspects of frontend and backend
development on MERN and MEAN stack. During the course of my Internship with
cognify I was able to learn many new technologies. I created multiple learning projects
during my internship period.
The very first project was on DOM manipulation in which by using ES6 JavaScript I built
user add, update and delete features. Then the same project I built using JavaScript
templating library EJS. Then worked on building an API for CRUD operations using
NodeJS and ExpressJS and testing them on POSTMAN. Further I connected them to a
frontend built on ReactJS. Also built few POC on redux and using context Library in
ReactJS.
I learnt Angular and also did authentication of users using JWT tokens. Features like
change password, update credentials, update and delete users were added.
 Table of Contents

1. INTRODUCTION 1
1.1 INTRODUCTION 1
1.2 CORE VALUES
1.3 EXPERIENCE
2. LITERATURE SURVEY 4
3. SYSTEM DEVELOPMENT 15
4. PERFORMANCE ANALYSIS 21
5. CONCLUSION 28
6. REFERENCES 34
 CHAPTER 1

INTRODUCTION

1.1 INTRODUCTION

I got virtual internship opportunity at Cognify and carried out my 4 weeks of mandatory
internship in the company. My title during the course of internship was Software
Engineer- Trainee. I was mainly responsible for building API and frontend of webapps.
The functioning of the team is very smooth due to the core values followed and is also
highly productive. We have a good number of projects which are operational
simultaneously and the outcomes are really impressive.

1.2 EXPERIENCE

I started my internship with Cognify on 5th May, 2024. I joined the Web development
team and was successfully able to understand the work pattern and structure.
I was given multiple technologies to explore and learn during my internship like
Javascript, Nodejs, ExpressJS, Git/Github, NoSQL based database like MongoDB, React
and Angular. I was also provided with multiple projects to understand the project
structure and also have ideas about its flow. I also got to learn soft skills like working in a
team, communication within a corporate firm. Because of this training I was able to
understand some of the company's products.

6
 CHAPTER 2
LITERATURE SURVEY

During my internship at Coginfy I learnt about various technologies like javascript,

typescript, NodeJs, ExpressJs, React, Angular, MongoDB, Github. I also learnt about
Postman and React Redux.

Javascript

JavaScript is the most widely used programming language on the planet. The Web's
programming language is JavaScript. JavaScript is a simple language to learn.
JavaScript (JS) is a first-class compiled programming language that is lightweight,
interpreted, or just-in-time compiled. While it is best known as a scripting language for
Web pages, it is also used in a variety of non-browser settings, including Node.js, Apache
CouchDB, and Adobe Acrobat. JavaScript is a single-threaded, prototype-based, dynamic
language that supports object-oriented, imperative, and declarative (e.g. functional
programming) programming styles.

Typescript

TypeScript allows you to write JavaScript in the way you desire. TypeScript is a typed

JavaScript superset that compiles to plain JavaScript. TypeScript is a pure object-oriented

programming language with classes, interfaces, and statically typed code, similar to C# or

Java. TypeScript is used in the popular JavaScript framework Angular 2.0. Understanding

TypeScript may assist programmers in writing object-oriented applications that are

compiled to JavaScript on both the server and client sides.

TypeScript will be simple to use for programmers who come from an Object-Oriented

background. They can create web apps considerably quicker if they know TypeScript,

because TypeScript offers strong tooling support.

Microsoft created and maintains the TypeScript programming language. It's a syntactical

8
superset of JavaScript with the addition of optional static typing. It is designed for the

development of large applications and transpiled to JavaScript.

NodeJS

Node.js is a JavaScript runtime environment that is free and cross-platform. It's a

well-liked tool for practically any job!

Outside of the browser, Node.js operates the V8 JavaScript engine, which is at the heart
of Google Chrome. As a result, Node.js is extremely fast.

Without establishing a new thread for each request, a Node.js software operates in a
single process. Node.js' standard library includes a set of asynchronous I/O primitives that
prevent JavaScript code from blocking, and libraries in Node.js are often created
following non-blocking paradigms, thus blocking behavior is the exception rather than the
rule.

Instead of stalling the thread and wasting CPU cycles waiting for Node.js to complete an
I/O operation, such as reading from the network, accessing a database, or accessing the
filesystem, Node.js will continue the operations when the response comes back.

This allows Node.js to handle thousands of concurrent connections with a single server
without adding the overhead of thread concurrency management, which may be a major
cause of errors.

Because millions of frontend developers who write JavaScript for the browser can now
create server-side code in addition to client-side code without having to learn a new
language, Node.js offers a distinct advantage.

The new ECMAScript standards can be utilized without issue in Node.js since you don't
have to wait for all of your users' browsers to update - you can choose which
ECMAScript version to use by changing the Node.js version, and you can even enable
certain experimental features by running Node.js with flags.

9
ExpressJS

Express.js, or basically Express, is a back end web application structure for Node.js,
delivered as free and open-source programming under the MIT License. It is intended for
building web applications and APIs. It has been known as the accepted standard server
structure for Node.js.

The first creator, TJ Holowaychuk, depicted it as a Sinatra-propelled server, implying that

it is generally negligible with many elements accessible as modules. Express is the
back-end part of well known improvement stacks like the MEAN, MERN or MEVN
stack, along with the MongoDB data set programming and a JavaScript front-end
structure or library.

EJS

Embedded Javascript (EJS) is a type of Javascript that is embedded in a webpage. Node.js

uses Templating as a templating engine. The template engine makes it possible to develop
an HTML template with very little code. It may also inject data into an HTML template
on the client side before generating the final HTML. EJS is a basic templating language
that uses plain JavaScript to build HTML markup. It also aids in the integration of
JavaScript into HTML websites. The default behavior of EJS is to seek for templates to
render in the 'views' folder.

MongoDB

MongoDB stores data in JSON-like documents with flexible fields that may change from
document to document and data structures that can evolve over time. The document
model corresponds to the objects in your application code, allowing you to interact with
data more easily. Ad hoc searches, indexing, and real-time aggregation are all useful tools

10
for gaining access to and analyzing your data. Because MongoDB is a distributed
database at its heart, it comes with built-in high availability, horizontal scaling, and
geographic dispersion. MongoDB is a completely free database.

Postman

Postman is an application programming interface (API) development tool that aids in the
creation, testing, and modification of APIs. This utility has almost all of the features that a
developer would want. Every month, over 5 million developers utilise it to make API
development straightforward and easy. It can make a variety of HTTP queries (GET,
POST, PUT, PATCH), save environments for later usage, and convert API to code in a
variety of languages (like JavaScript, Python). The URL that we wish to GET, POST,
DELETE, etc. is entered into the longest middle input box, which looks like a search bar.

React

React.js was delivered by a computer programmer working for Facebook - Jordane Walke
in 2011. Respond is a JavaScript library zeroed in on making decisive UIs (UIs) utilizing
a part based idea. It's utilized for taking care of the view layer and can be utilized for web
and versatile applications. Responds principal objective is to be broad, quick, decisive,
adaptable, and straightforward.

Respond isn't a system, it is explicitly a library. The clarification for this is that React just
arrangements with delivering UIs and holds numerous things at the tact of individual
tasks. The standard arrangement of apparatuses for making an application utilizing
ReactJS is regularly called the stack.

High level libraries, for example, React, create a tree of components in memory identical
to the genuine DOM, which frames the virtual DOM in a decisive manner. The virtual
DOM is one of the elements that make the system so quick and dependable. JSX utilizes
Babel preprocessors to change over HTML-like text in JavaScript documents into
JavaScript objects to be parsed.

11
Respond doesn't need the utilization of JSX, yet most engineers find that it makes for a
more easy to use insight inside the JavaScript code.

Angular

Precise is an open-source, JavaScript structure written in TypeScript. Google keeps up

with it, and its main role is to foster single-page applications. As a system, Angular
enjoys clear benefits while likewise giving a standard design to engineers to work with. It
empowers clients to make huge applications in a viable way.

JavaScript is the most normally utilized client-side prearranging language. It is composed

into HTML reports to empower communications with website pages in numerous
extraordinary ways. As a generally simple to-learn language with unavoidable help,
creating present day applications is appropriate.

Yet, is JavaScript ideal for creating single-page applications that require seclusion,
testability, and engineer efficiency? Maybe not.

We now have a plethora of frameworks and libraries to choose from in order to give
different options. Angular addresses many, if not all, of the challenges that developers
have when utilizing JavaScript alone in front-end web development.

12
 CHAPTER 3
SYSTEM DEVELOPMENT

I created projects during my internship using various technologies mentioned above. The
projects were mainly focused on web applications and creating a full stack web app with
good UI for better user experience.

3.1 User Application on NodeJS and ReactJs

The process to start with project on terminal is :

1. mkdir node-user-app

2. cd node-user-app

3. npm init

4. npm install express body-parser mongoose --save

13
First we write the code for the connection of the database to our code. Using library
‘Mongoose’ to make code of mongoDB more fast working and creation of schemas much
easier

Then we can see data is stored in database

14
After this we write the code for various Crud operations on the server side and handling
the API calls by using POSTMAN

15
Coming forward to the client side we create a landing page where all users are displayed
from the database, with actions button to update, delete and view specific users and when
we click on a particular user, the details page opens up with an image and the link
directed to is the specific user ID.

Also the page has a toggle for different views we want to have (i.e. cards and table views)

16
Now when the user clicks on the AddUser button, the page opens to add the user and
when he clicks on the submit button, the user is added and the page is redirected to home.

In a similar way in the UpdateUser route, the user inputs are auto populated from existing
values and we can change them by overriding its value.

17
18
19
20
3.2 User Authentication using JSON web Token (JWT)

JSON Web Token (JWT) is an open norm (RFC 7519) that characterizes a minimized and
independent way for safely communicating data between parties as a JSON object. This
data can be confirmed and trusted in light of the fact that it is carefully marked. JWTs can
be marked utilizing confidentiality (with the HMAC calculation) or a public/confidential
key pair utilizing RSA or ECDSA.

In spite of the fact that JWTs can be encoded to likewise give mystery between parties,
we will zero in on marked tokens. Marked tokens can confirm the trustworthiness of the
cases held inside it, while scrambled tokens conceal those cases from different gatherings.
At the point when tokens are marked utilizing public/confidential key matches, the mark
likewise confirms that main the party holding the confidential key is the one that marked
it.JSON Web Token (JWT) is an open norm (RFC 7519) that characterizes a minimized
and independent way for safely communicating data between parties as a JSON object.
This data can be confirmed and trusted on the grounds that it is carefully marked. JWTs
can be marked utilizing confidentiality (with the HMAC calculation) or a
public/confidential key pair utilizing RSA or ECDSA.

In spite of the fact that JWTs can be encoded to likewise give mystery between parties,
we will zero in on marked tokens. Marked tokens can check the trustworthiness of the
cases held inside it, while encoded tokens conceal those cases from different gatherings.
At the point when tokens are marked utilizing public/confidential key matches, the mark
likewise ensures that the party holding the confidential key is the one that marked it.

JWT should be used when :

● Authorization is the most typical case in which JWT is used. Each subsequent
request will contain the JWT once the user has signed in, allowing the user to
access routes, services, and resources that are authorized with that token. Single
Sign On is a popular feature that makes use of JWT nowadays due to its low
overhead and ability to be utilized across many domains.

21
 ● Information Exchange: JSON Web Tokens are a safe mechanism to send data
between two parties. You can be sure the senders are who they say they are
because JWTs may be signed—for example, with public/private key pairs. You
may also check that the content hasn't been altered because the signature is
calculated based on the header and payload.

JSON Web Tokens are made up of three pieces that are separated by dots (.). They are:

● Header
● Payload
● Signature

First the user comes to the registration page and after registration its credentials are stored
in the database. Also the password is stored as in hash form by crypting so no one can see
it.

22
23
After successful registration, the user goes to the login page, where he enters his/her
email and password. There is a validation to check that if that email exist or not then
decrypt the password to compare it.

When user logins, that specific user page opens up with its unique id and a token is stored
in local storage and when user logouts that token in terminated.

24
Also functionalities like change password and update user password is also added to
enhance user experience.

25
26
27
 CHAPTER 4
PERFORMANCE ANALYSIS

4.1 USER APP PERFORMANCE ANALYSIS

To lay out the web application MERN stack was utilized. The web application was
created utilizing the MERN stack utilizing Mongoose and MongoDB information base.
Chrome designer instruments were used while testing involving revival devices for
reproduction. The accompanying area talks about MERN stack parts and their execution.
A. NodeJS Node.js is written in C ++ language, which is a JS working environment.
Node.js is a JS runtime environment. Node.js utilizes the Google Chrome V8 motor for
good execution. Node.js utilizes occasion driven, nonconcurrent programming callback
works, and planned utilizing single-string engineering. Node.js configuration utilizes the
occasion driven as the key center idea for its current circumstance, which provided us
with the different number of APIs that are occasion based and nonconcurrent in nature
which has helped us in building the site utilizing node.js for our back-end improvement.

28
Because Express is a Node.js framework, we used it. During the development of the
application, we discovered that instead of generating a slew of node modules and writing
the code in NodeJS, Express made writing the back-end code and putting it into an
organized fashion more simpler and easier. Express aided us in the construction of the
web apps and APIs we needed for our project since it supports a large number of
middlewares, making the code simpler and easier to develop. The most significant
advantages of adopting Express in our application are asynchronous programming and
single-threaded architecture. A comprehensive API is required for our application. To
begin our express project, we created a new folder, and the procedures were as follows:
we had to add a command to the command line to initialize the package. a file in json

We involved React.JS for building our UI for the web application, as it is utilized for the
improvement of a solitary page application since it can deliver powerfully changing
information at a fast rate. Respond permits designers to code in JS and make User
Interface parts. We concentrated on virtual DOM objects in React.JS, which we executed
in our task. Any progressions we made in our online business web application made the
whole User-Interface re-render the virtual DOM. This permits us to look at the likely
distinction between the DOM Object and Virtual DOM. We utilized JSX, It made our
code more straightforward and less complex to write in React application.[4] React.JS
utilizes Components. Parts are the structure blocks of User-Interface wherein every part
had a rationale connected with our online business application and it added to the by and
large

29
Our web application's user interface. Components may be reused, which made our web
application code easier to understand by other developers and improved the overall
efficiency of the online site.

For our project, we selected MongoDB, a document-oriented database. MongoDB is a

database where each record is in the form of a document. MongoDB turns our JSON data
into a binary version that can be stored and searched more effectively behind the scenes
on the server. To query the database, MongoDB employs BSON. MongoDB saves BSON
format both internally and across the network, although this does not imply that it is a
JSON database. Any data may be represented in JSON format and saved natively in
MongoDB, as well as retrieved in JSON format. We may argue that MongoDB is versatile
because it allows users to construct schema, databases, and tables, among other things,
based on our research and implementation.

Because MongoDB is a document-oriented database, indexing documents is simple. As a

result, it is able to respond at a faster rate. MongoDB is a scalable database. We managed
huge data in the MongoDB database by separating it into a layered described structure.
MongoDB is a database server that allows several databases to be run simultaneously.

30
31
4.2 USER AUTHENTICATION WITH JWT PERFORMANCE ANALYSIS

The jsonwebtoken is the de-facto standard in the Node.js ecosystem, so here’s the golden
question: how does it perform?
In both cases, the hottest frames are in jsonwebtoken package and its direct dependency,
jwa (via jws). Let’s see how we can improve their performance.

Node’s crypto module performs the JWT signing and verifying operations. This is
currently the fastest implementation available. So, we analyzed the jsonwebtoken, jws
and jwa source code to see what we could do to improve performance and how.

While the jsonwebtoken implementation is robust and effective, we found a fundamental

problem; all operations are orchestrated by the jsonwebtoken package using the jws and
jwa packages. This is not generally a problem, but as each of the three packages are
developed as standalone packages, it is. This causes the repetition of many operations
(such as input type and format validations) as input must be validated at each layer. In
some cases, such as the stream interface of jws, which is not used by jsonwebtoken, there
is also unwanted and unused overhead.

Finally, the jsonwebtoken resides in the public API it exposes. Each time a signing,
decoding or verification is performed, the same set of options is provided and validated.
Even though each operation has minimal impact on each request, they add up and result
in slower operations (especially in a single-threaded environment like Node.js).

The split implementation also poses a problem when sending pull requests (PR) to change
the code; PRs should be sent to each of the three packages, and applied and released
together to ensure the changes work correctly. This is generally difficult but is even more
difficult in this case as jsonwebtoken, jws and jwa do not have a common maintainer.
Therefore, using a PR to improve the existing packages was not viable. Our solution was
to write a new package, fast-jwt.

The purpose of fast-jwt is to improve jsonwebtoken performance while keeping the same
features and a similar API. To do this, we established the following architecture
principles:

32
 1. Minimize the number of external dependencies: except for the cache layer and
a couple of small cryptographic utilities, fast-jwt has no external dependencies.
This ensures the code is easily maintained and data flow can be followed.
2. Use factory pattern and single ahead options verification: fast-jwt uses the
factory pattern to create the signer, decoder and verifier functions. This ensures
that all options (with the exception of the key, which might be fetched at
execution time, depending on the options passed) are validated only once and only
during the startup phase.
3. Small public API: the public fast-jwt API consists of three factory functions (one
for each operation) with a specific set of options.

Caching

We introduced the use of caching in verify operations while developing fast-jwt to further
improve performance further.

Most of the time, servers tend to process the same tokens. When verifying tokens, servers
perform the same operations on the same data all the time (as typically the same user uses
the same token in multiple time-close requests).

fast-jwt uses mnemonist to add a Least Recently Used (LRU) cache to all factories.
Verified tokens are always cached. If verification fails, the error is also cached and the
operation is not retried. Caching considers the time-sensitive claims of the token (iat, nbf
and exp) and makes sure the verification is retried after a token becomes valid or after a
token expires.

33
Fast-jet is an experimental library to check if we could improve the performance in JWT
verification. As for any experimental features, we are eager to receive feedback. We do
not plan to move restify-jwt orfastify-auth0-verify to this module yet as jsonwebtoken is
more stable and secure.

34
 CHAPTER 5
CONCLUSION

5.1 CONCLUSION

I am still on the way doing my internship with the Cognify and I have learned so much
from this internship offered by the internship, rally helped me in shaping my personality
and equipping me with the knowledge of this technologies. My Final internship project is
still remaining with Cognify internship and I will give my best in doing the internship
project.

I would like to thank in advance to the manager, colleagues and mentor of Cognify who
guided me through the whole journey of my internship in Cognify and solved all my
doubts during the internship. The manager and mentor were all of good nature and at
every moment helped me when I was doing wrong and shaped me during my whole
internship.

Specially the my mentor gave his more effort during the internship and solved my all
query in the project whether it was related to the reattempt of the assessment, technical
issue faced in the assessment or providing extra time to complete the work.

I would highly recommend my juniors to prepare well for the offer in the Cognify and get
the internship opportunity from Cognify because Cognify is one of the top fortune
companies in the information technology field.

5.2 FUTURE SCOPE

The future scope of the project is to implement both of them in an angular framework and
learn angular in a more fast and efficient way.

Also implement session and cookie authentication instead of JSON Web Tokens and
explore that field.

35
References

1) https://developer.mozilla.org/en-US/docs/Web

2) https://www.w3schools.com/xml/dom_nodetype.asp

3) https://www.ijert.org/research/performance-optimization-using-mern-stack-on-web-app
lication-IJERTV10IS060239.pdf

37