UNIT-I
User:
• The user is the person interacting with the web application.
• Users access web applications through devices such as desktops, laptops,
tablets, or smartphones.
• User experience (UX) and user interface (UI) design play a significant
role in ensuring usability and engagement.
• Interacts with the browser (client-side) to request resources (HTML, CSS,
JS, APIs).
• Example actions: Submitting forms, clicking buttons, navigating pages.
Browser
• A browser is a software application that enables users to access and
interact with web pages.
• Popular browsers include Google Chrome, Mozilla Firefox, Microsoft
Edge, and Safari.
• The browser processes HTML, CSS, and JavaScript to render web pages.
• Key components of a browser:
o Rendering Engine: Converts HTML, CSS, and JavaScript into a
visual representation.
o JavaScript Engine: Executes JavaScript code for dynamic
interactions.
o Networking Module: Handles communication with web servers
using HTTP/HTTPS.
o User Interface: Displays the web page and provides navigation
controls
o Parsing and executing JavaScript.
o Managing cookies and sessions.
o Handling client-side routing (e.g., React Router).
Web Server
• A web server is a computer system that processes and serves web pages
to users.
• It handles HTTP requests and responses between the browser and the
backend.
• They are two types of servers are available
1. Static Server: Serves pre-built files (e.g., Nginx, Apache).
2. Dynamic Server: Processes requests using backend logic
(e.g., Node.js + Express, Python + Django).
• Common web servers:
o Apache HTTP Server
o NGINX
o Microsoft IIS
• Functions of a web server:
o Receives HTTP requests from the browser.
o Retrieves the requested resource (HTML, CSS, JavaScript, images,
etc.).
o Processes dynamic content with backend services.
o Sends the response back to the browser.
o Handles tasks like authentication, routing, and interacting
with backend services.
Backend Services:
The backend refers to the server-side logic and databases that process
requests and manage data.
o Databases: Store and retrieve data (e.g., MongoDB, MySQL).
o APIs: External services (e.g., payment gateways, weather APIs).
o Caching: Tools like Redis for performance optimization.
o Message Queues: RabbitMQ/Kafka for asynchronous task
processing.
Responsibilities of the backend:
1. Authentication and user management.
2. Data processing and validation.
3. Business logic execution.
4. Managing API requests and responses.
Full Stack Components - Node.js, MongoDB, Express, React, Angular.
• Combines frontend (UI), backend (server + database), and infrastructure.
• Popular stacks:
o MERN: MongoDB, Express, React, Node.js.
o MEAN: MongoDB, Express, Angular, Node.js.
• Node.js:
o Runtime: Executes JavaScript outside the browser (V8 engine).
o Event-Driven: Non-blocking I/O using an event loop.
o Use Cases: APIs, real-time apps (chat), microservices.
• MongoDB:
o NoSQL Database: Stores JSON-like documents (BSON).
o Flexible Schema: No fixed table structure (unlike SQL).
o Scalability: Horizontal scaling via sharding.
• Express.js:
o Backend Framework: Simplifies HTTP server creation in
Node.js.
o Middleware: Functions to process requests (e.g., express.json() for
parsing JSON).
o Routing: Define endpoints (e.g., app.get('/users', handler)).
• React:
o Frontend Library: Builds UI components (virtual DOM for
efficiency).
o State Management: Tools like Redux or Context API.
o Component-Based: Reusable, self-contained UI elements.
• Angular:
o Frontend Framework: Full MVC architecture.
o TypeScript: Primary language (statically typed).
o Features: Dependency injection, two-way data binding.
Interaction Between Components
1. The user requests a web page by entering a URL in the browser.
2. The browser sends an HTTP request to the web server.
3. The web server processes the request, retrieves resources, and interacts with the
backend if needed.
4. The backend fetches data from the database and returns a response.
5. The web server sends the final response to the browser.
6. The browser renders the web page for the user.
JavaScript Fundamentals
Introduction
JavaScript is a powerful, high-level, and interpreted programming language used for
web development. It allows developers to create dynamic and interactive websites.
JavaScript Basics
• JavaScript is a client-side scripting language, but it can also be used on the
server-side (Node.js).
• It is executed within a browser to manipulate web pages dynamically.
• JavaScript code is written within <script> tags or in external .js files.
Variables and Data Types
Declaring Variables
• var (function-scoped, can be redeclared)
• let (block-scoped, cannot be redeclared within the same scope)
• const (block-scoped, cannot be reassigned)
var
let:
const
Data Types
• Primitive Data Types: String, Number, Boolean, Null, Undefined, Symbol, BigInt
• Reference Data Types: Object, Array, Function
4. Operators
• Arithmetic Operators: +, -, *, /, %, ++, --
• Comparison Operators: ==, !=, ===, !==, >, <, >=, <=
• Logical Operators: &&, ||, !
• Assignment Operators: =, +=, -=, *=, /=
• Bitwise Operators: &, |, ^, ~, <<, >>
5. Control Structures
5.1 Conditional Statements
• if statement
• if-else statement
• if-else if-else statement
• switch statement
5.2 Loops
• for loop
• while loop
• do-while loop
• forEach loop (for arrays)
6. Functions
• Function Declaration: function functionName() {}
• Function Expression: const func = function() {}
• Arrow Function: const func = () => {}
• Parameters and Return Values
7.1 Arrays
• Declaring Arrays: let arr = [1, 2, 3];
• Array Methods: push(), pop(), shift(), unshift(), map(), filter(), reduce()
What is promise in javascript ?explain in detail
What is Node.js?
Node.js is an open-source, cross-platform JavaScript runtime environment and library
for running web applications outside the client's browser. Ryan Dahl developed it in
2009, and its latest iteration, version 15.14, was released in April 2021. Developers use
Node.js to create server-side web applications, and it is perfect for data-intensive
applications since it uses an asynchronous, event-driven model.
How Node.js Works
Node.js is a runtime environment that allows JavaScript to be executed on the server
side. It is built on the V8 JavaScript engine from Chrome, which compiles JavaScript into
efficient machine code. Node.js operates on a single-threaded event-driven
architecture, utilizing an event loop to handle multiple concurrent operations without
blocking.
When a client sends a request to a Node.js server, the request is added to an event
queue. The event loop continuously checks this queue and processes each request. If a
request involves an I/O operation, Node.js offloads it to the system kernel, which
handles it asynchronously. Once the I/O operation is complete, the kernel notifies
Node.js, executing the corresponding callback function.
This non-blocking I/O and event-driven model allows Node.js to handle many
simultaneous connections efficiently, making it ideal for building scalable, high-
performance network applications.
Why Do We Use NodeJs?
There are many reasons for which we prefer using NodeJs for the server side of our
application, some of them are discussed in the following:
• NodeJs is built on Google Chrome’s V8 engine, and for this reason its execution
time is very fast and it runs very quickly.
• There are more than 50,000 bundles available in the Node Package Manager and
for that reason developers can import any of the packages any time according to
their needed functionality for which a lot of time is saved.
• As NodeJs do not need to wait for an API to return data , so for building real time
and data intensive web applications, it is very useful. It is totally asynchronous in
nature that means it is totally non-blocking.
• The loading time for an audio or video is reduced by NodeJs because there is
better synchronization of the code between the client and server for having the
same code base.
• As NodeJs is open-source and it is nothing but a JavaScript framework , so for the
developers who are already used to JavaScript, for them starting developing their
projects with NodeJs is very easy.
Features of NodeJs
Asynchronous in Nature and Event driven
The servers made with the NodeJs never waits for the from an API. Without waiting for
the data from the API, it directly moves to the next API. So all the APIs of NodeJS are
totally non-blocking in nature. In order to receive and track all the responses of the
previous API requests, it follows an event driven mechanism. Hence we can say that all
the NodeJs API are non-blocking in nature.
Single Threaded Architecture
With event looping, a single threaded architecture is followed by NodeJs and for this
architecture makes NodeJs more scalable. In contrast to other servers, limited threads
are created by them for processing the requests. Whereas for the event driven
mechanism, the NodeJS servers reply in a non-blocking or an asynchronous manner
and for this reason NodeJS becomes more scalable. If we compare NodeJs with other
traditional servers like Apache HTTP servers, then we can say NodeJs handles a larger
number of requests. A single threaded program is followed by NodeJS and this allows
NodeJs to process a huge amount of requests.
Scalable
Nowadays, scalable software is demanded by most of the companies. One of the most
pressing concerns in Software Development is addressed by NodeJs and that is
scalability. Concurrent requests can be handled very efficiently using NodeJs. A cluster
module is used by NodeJs for managing the load balancing for all the active CPU cores.
The most appealing feature of NodeJs is that it can partition the applications
horizontally and this partition procedure is mainly achieved by it due to the use of child
processes. Using this feature, the distinct app versions are provided to the different
target audiences and also for customization it allows them for catering to the client
preferences.
Quick Execution Time for Code
V8 JavaScript runtime motor is used by NodeJs and this is also used by Google chrome.
A wrapper is provided for the JavaScript by the hub and for that reason the runtime
motor becomes faster and for this reason inside NodeJs, the preposition process of the
requests also become faster.
Compatibility on the Cross Platforms
Different types of systems like Windows, UNIX, LINUX, MacOS and other mobile devices
can use NodeJs. For generating a self-sufficient execution, it can be paired with any
appropriate package.
Uses JavaScript
From an engineer's perspective, it is a very important aspect of NodeJs that this
framework uses JavaScript Most of the developers are familiar with JavaScript, so for
them it becomes very easier to grab NodeJs.
Fast Data Streaming
The processing time of the data that have been transmitted to different streams takes a
long time. Whereas for processing the data, NodeJs takes a very short amount of time
and it does it at a very fast rate. NodeJs saves a lot of time because the files are
processed and uploaded simultaneously by NodeJs. So as a result, the overall speed of
data and video streaming is improved by NodeJs.
No Buffering
The data is never buffered in NodeJs application.
Is Node.js a Programming Language?
Node.js is not a programming language; it is a runtime environment allowing you to
execute JavaScript code on the server side, outside a web browser. Built on the V8
JavaScript engine from Chrome, Node.js compiles JavaScript into machine code for
efficient execution. It extends JavaScript capabilities by providing additional features
and libraries for server-side development, such as file system access, network
communication, and asynchronous I/O operations.
While JavaScript is the programming language used with Node.js, the runtime
environment provides the tools and frameworks to build scalable and high-performance
server applications. Node.js’s non-blocking, event-driven architecture makes it ideal for
real-time applications, web servers, APIs, and more. In summary, Node.js is a robust
environment that leverages JavaScript to enable server-side programming, but it is not a
programming language.
Node.js Architecture
Parts of Node.js
