1

Web Technologies
Introduction
BY:
IRSHAD KHAN
 Why you should become a web 3
programmer ?
Welcome to the field of Opportunities !!!
 Today, every business needs a website to remain competitive.
 As of January 2016, the World Wide Web contained at least
4.84 billion pages.
 This number underscores the abundant job opportunities and
job security that await web developers, the people who are
essential for coding, building, analyzing, and maintaining all
those websites.
 The size of the World Wide Web (The Internet) The Indexed
Web contains at least 3.7 billion pages (Tuesday, 08 March,
2022).
 Employment for web developers is projected to grow by 27%
over current levels by 2024, which is much faster than any
other occupation.
 According to the Bureau of Labor Statistics, job opportunities
for web developers are projected to grow by a whopping 20%
by 2022.
 This field gives you a chance to become your own boss
 Who is web Designer ? 4
 A Web designer is someone who prepares content for the Web.
This role is mainly related to the styling and layout of pages
with content, including text and images
 Web designers use many technologies but commonly rely on
resources including HTML, CSS , Bootstrap and additional Web
design tools like graphic design software (think Adobe
Photoshop , Illustrator and InDesign) to create a look for the
web.

EXAMPLE:
A web designer would be responsible for the aesthetic
design of the car (the comfort of the seats, the layout of the
dashboard, etc.)

“The life of a designer is a life of fight. Fight against the ugliness. Just
like a doctor fights against disease. For us, the visual disease is what
we have around, and what we try to do is cure it somehow with
design.” – Massimo Vignelli
 Who is web Developer ? 5

 A web developer is responsible for programming the code

that “tells” a website how to function.
 A web developer is a programmer who specializes in, or is
specifically engaged in, the development of World
Wide Web applications, or applications that are run over
HTTP from a web server to a web browser. (Wikipedia).

EXAMPLE:
A web developer would be responsible for using various
components like the engine, transmission, wheels, etc. to
construct a fully-functional car that is error-free in its
technical aspects.
 Web Development 6

 Web Development can be divided into three parts:

 Client-side scripting. (HTML, CSS, JavaScript, JQuery)
 Server-side scripting (PHP, ASP.NET , C , Java , Python Ruby)
 Database technology (MySQL, Oracle, Microsoft SQL Server,
IBM DB2, Apache, MongoDB).

Types of Web Developers:

o Front-End Developers - that codes the front end of the website –
the way a website looks .
o Back-End Developers – that builds something behind the scene.

o Full stack Developers - They are knowledgeable with the server

side as well as the client side’s user experience - Also
able to look at the 'big picture'.
Salary Information 7
So which is better: Web 8
design/development?
This is really hard to say, BUT look at what you are good
at.
 Right-Brained Vs. Left-Brained:
“It is said that people who enjoy creativity and
possess an artistic nature are right-brain
dominant and will flourish in web design”
-While-
“people who think more linearly and logically are
left-brain dominant and will enjoy and be more
comfortable with web development”.
Neil deGrasse Tyson put it, “Don’t call me left brained, right brained. Call
me human.” Don’t think you’re predisposed to do better in one area than
another – and this is my final point.
 Can you be a Designer or 9
Developer ?
 All of these differences seem to imply that designers and
developers are two very different jobs or roles.

 But they don’t have to be.

 You can be a designer and developer at the same time.

More people are beginning to label themselves in this way
and it is becoming an in-demand skill-set.

 I am even one of those people.

 Idea Behind Web Application1
 Desktop Applications
0
 Web Applications
 Mobile Applications

Some basic concept to web ?

HTTP: Hypertext Transfer Protocol
Send Our URL to the DNS Server

DNS Server:
 - Domain Name System
 - Give Name to IP Address like : 192.167.5.1 (mentorspakistan)
 - That Name is Called Domain Name
 - Like : http://www.aup.edu.com
 - Its work like Contact in Our Mobile.
 Basic Concept to web 1
1
URL
 Uniform resource locator
 It Points Location of Every Single Page.
 Like : szic.edu.pk/result.php
Domain
 If You want user to access your Website through
web You will must Purchase a Domain Name
From DNS.
 Like uop.edu.pk
 After Purchasing a domain name your website
will be accessible through HTTP.
Why DNS ?
 Just like your mobile contact.
 How Web Applications Work ?
1
2
 Enter URL in Browser like www.mentorspakistan.com
 Browser send URL to DNS through HTTP
 DNS Search for IP of required URL
 If DNS Find URL in their Table they will send back IP
address of required URL to The User otherwise they
will Send Message
“This webpage is not available”
 After receiving IP the Browser Will Send Request to
the required Server.
 The server will send back all the required data to the
browser in the form of HTML.
 The Browser Will read the tags and generate the
page.
How Web Applications Work ?
1
3
 Web Technologies 1
4
 HTML (HyperText Markup Language)
 HTML is used to create electronic documents (called
pages) that are displayed on the World Wide Web.
 HTML is used to give layout to resources(text, image,
video) in webpage.
 CSS (Cascading Style Sheets)
 Give style to the page.

 Bootstrap
 Bootstrap is responsive, mobile-first and front-end framework, which is
developed along with CSS, JavaScript, and HTML.
 Web Technologies 1
5
 JAVASCRIPT
 JavaScript is most commonly used as a client side
scripting language.
 Give programming tools to the HTML(Var, Condition, Loops
tec)
 JQUERY
 Third party package of JavaScript Readymade Code

 AJAX (asynchronous JavaScript & XML)

 Change page Without Refreshing/Reloading.

 PHP
 Give Connectivity between HTML and Database.
 MySQL
 Database Where all website data store.
 1
 What is Web Browser :
6
 The purpose of a web browser (like Internet Explorer or
Firefox) is to read HTML documents and display them as web
pages
 The browser does not display the HTML tags, but uses the
tags to interpret the content of the page.
 like : h1 give bigger layout and img insert image
 Static web page:
 A web page that displays same page/information to all users.
 No user interaction
 No Database
 Create in HTML,CSS,JS
 Dynamic web page:
 Information is different for each user e.g. Facebook, Google+
 Involves user interaction
 Must Have Database
 create in HTML, CSS, JS, php, Mysql
1
7
1
8