Scribd
Upload
15 views27 pages

Web Development - Townhall

The document provides an overview of career paths after engineering and various topics related to web development. It discusses choosing a domain and gaining expertise in a tech stack. It also covers the basics of how the internet works using client-server architecture and domain name systems. Frontend topics like HTML, CSS, JavaScript, responsive design and client-side rendering are explained. Backend concepts such as APIs, databases, CRUD operations, REST APIs, and web sockets are summarized. Other sections cover web security threats, software architecture patterns like monolithic and microservices, and deployment methods including CDNs and VPS.

Uploaded by

anugyatiwari51117
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
15 views27 pages

Web Development - Townhall

The document provides an overview of career paths after engineering and various topics related to web development. It discusses choosing a domain and gaining expertise in a tech stack. It also covers the basics of how the internet works using client-server architecture and domain name systems. Frontend topics like HTML, CSS, JavaScript, responsive design and client-side rendering are explained. Backend concepts such as APIs, databases, CRUD operations, REST APIs, and web sockets are summarized. Other sections cover web security threats, software architecture patterns like monolithic and microservices, and deployment methods including CDNs and VPS.

Uploaded by

anugyatiwari51117
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 27

Career Paths After

Engineering

SDE Developer Etc.


Roadmap
How to choose your domain ? (Interest + Crowd)

2. Gain expertise in 4. Core subjects, OS,


a tech stack. Build DBMS, Networking etc.
projects, Interview preparation. Top Earners
hackathons. Suffer.

1. Strengthen 3. Strengthen DSA


programming fundamentals. Build
concepts. complex projects.
Start working on a
tech stack.
Web Development
Why learn web development ?
Internet
How does it work ?
The internet is a global system of interconnected
networks. It works on the client server architecture.

Client Server
Internet
What is a domain name and DNS ? wikipedia.org

A domain name is the address of a website. It's the name


208.80.154.224
you type into a web browser to access that specific
website.
Client DNS
req
google.com 142.251.167.100 ue
st 208.80.154.224
res
po
ns
wikipedia.org 208.80.154.224 e

codeforces.com 104.26.6.164
Server
instagram.com 157.240.22.174
Internet
How do browsers work ?

A web browser has 5 major components:


1. Rendering Engine (HTML, XML, CSS)
2. JavaScript Runtime (JS)
3. Browser Engine (Actions, Events)
4. Networking (Requests)
5. Data Storage (Cookies, Local Storage)
Frontend
What comprises of frontend ?
The part of a website that the user interacts with directly,
is termed the front end. It is also referred to as the ‘client
side’ of the application.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-
HTML (HyperText Markup Language is the standard markup scale=1.0">
language used to create web pages. It is written in the form <meta http-equiv="X-UA-Compatible"
of HTML elements consisting of tags enclosed in angle content="ie=edge">
brackets. <title>HTML 5 Boilerplate</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<script src="index.js"></script>
</body>
</html>
CSS
CSS (Cascading Style Sheets) is a style sheet language used
for describing the look and formatting of a document written
in a markup language.
JS
Javascript(Js) is the most popular lightweight, interpreted compiled
programming language. It can be used for both Client-Side as well as Server-
side developments. Javascript also known as a scripting language for web pages.
Responsive Design
Responsive Web design is about using HTML and CSS to automatically
resize, hide, shrink or enlarge a website to make it look good on all
devices.

eg. desktops, Tablets and phones Responsive Design


Client Side Rendering
Html is generated on the client side by executing Javascript code in the
browser. The Javascript Code is executed by the browser Javascript engine.

eg. Chrome V8
Server Side Rendering
Html is generated by executing code on the server-side. The server-side code to
generate the html may be written in server-side languages (PHP, .NET etc) or the
server-side code could be a single Page application (written in React, Vue) that is
executed server-side by Node JS.
PWA
Progressive Web Applications (PWAs) are web applications that offer users an experience similar to that of
a native mobile app, including offline functionality, push notification and access to device hardware such
as cameras and GPS.

PWAs use modern web technologies, Such as Service workers and web app manifest to provide a seamless
experience across multiple device and platforms.

PWAs can be installed on user’s device without the need for an app store, making them easy to discover
and use.
Backend
What comprises of backend ?
Backend, also known as the ‘server side’ of a web
application, is a program that runs on a server and is
responsible for processing client requests and managing
data.

Client Backend
Backend
What are APIs ?
APIs (Application Programming Interfaces)
are mechanisms that enable two software components to
communicate with each other using a set of definitions
and protocols.

For web, APIs simply are URLs that return a response


when requested.

Example: https://jsonplaceholder.typicode.com/todos/
Backend
What is a database ? Why not files ? SQL NoSQL

Database is a organized collection of data, so that it can Table based Document based
be easily accessed and managed.
Static schema Dynamic schema
Example: Student data in a college
Vertical scaling Horizontal scaling
A software used to manage the database is known as
Database Management System. MySQL, Oracle MongoDB, GraphQL
Example: MySQL, MongoDB

Files are read in a sequential manner, which is slow and


not scalable.
Backend
CRUD (Create, Read, Update, Delete)
CRUD are the basic functions that can be performed on a
database, these form the basis of most software
applications.
Backend
REST APIs and Web Sockets
REpresentational State Transfer (REST) API is an Web Socket is a protocol for bi-directional, real-time, full
interface that two computers use to exchange information duplex communication between client and server.
over the internet.
Web Sockets are event driven and bidirectional.
REST APIs are request driven and unidirectional.
Web Security
Common web security threats
SQL Injection
Session Hijacking
Man in the Middle
Distributed Denial of Service
Software Architecture
Monolithic and Microservices
Deployment
CDN and VPS
A Content Delivery Network (CDN) is a server
optimized to deliver static content like files and web
pages. It has high bandwidth, caches content and is
geographically distributed for low latency.

Virtual Private Server (VPS) is a customizable dedicated


server that provides resources for hosting dynamic web
applications. It's ideal for complex apps that need
specific configurations.
END OF PRESENTATION

ANY QUESTIONS ?

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy