Program: Damina’s E-Learning

TOPIC:- WEB DEVELOPMENT

 Program: Damina’s E-Learning

TOPIC:- WEB DEVELOPMENT

◾ By: Mohammed Abdukadir (MA.)

 OUTLINES
◾ What is Web D evelopment ?
◾ Front end development
◾ Front end development technologies
◾ Back end development
◾ Back end development technologies
◾ Who is a Web D eveloper ?
◾ Types of Web D eveloper
◾ How a website works ?
◾ Difference Between Web Developer
and Web Designer
◾ Projects
 WHAT IS WEB DEVELOPMENT ?

◾ Web Development usually refers to developing the

website for the Internet (W orld Wide Web) or for
an Intranet (Private network).
◾ Also known as Web Programming.
◾ It is the creation of D ynamic Web Applications.
◾ Examples of Web Applications are Social networking
sites like Facebook or E-commerce sites like Amazon,
Flipkart, etc.
◾ There are two broad division of Web Development –
 Front-end Development (also called Client-side
Development)
 Back-end Development (also called Server-side
FRONT END DEVELOPMENT
◾ Front end development refers to producing a web
application so that a user can see and interact with them
directly.
◾ It is also known as Client side development.
◾ It focuses on the visual elements of a website that a user
will interact
with.
◾ A front end developer has one general responsibility: to
ensure that website visitors can easily interact with the
page.They do this through the combination of design,
technology and programming to code a website's
appearance, as well as taking care of debugging.
◾ The common technologies we can use in front-end
development are:
◾ HTML
 FRONTEN D DEVELOPMENT TECHNOLOGIES

◾ HTML was first created by Tim Berners-Lee, starting in

1989. It stands for Hyper Text Markup Language.
◾ Hypertext means that the document contains links that
allow the reader to jump to other places in the
document.
◾ A Markup Language is a way that computers speak to
each other to control how text is processed and presented.
◾ It describes the structure of a web page and consists series
of elements.
◾ Its elements tells browser how to display the content.
◾ It’s code is written in Notepad or any text editor but
save it as .htm
FRONTEN D DEVELOPMENT TECHNOLOGIES (CONT..)

◾ CSS was first proposed by Hakon Wium Lie on October 10,

1994
at C E R N (European Organization for Nuclear Research).

◾ Cascading Style Sheets (CSS) describes how H T M L

elements are to be displayed on screen.

◾ CSS saves a lot of work. It can control the layout of multiple

web pages all at once.

◾ It is also responsible for responsive layouts of a website.

◾ It is also written in any text editor but save as .css

extension.
 FRONTEN D DEVELOPMENT TECHNOLOGIES (CONT..)

◾ Javascript was invented by Brendan Eich in 1995.

◾ Javascript is the Programming Language for the Web.

◾ Javascript can update and change both H T M L and CSS.

◾ Javascript is responsible for the Functioning of the website.

◾ It is a scripting language that enables us to create dynamically

updating content, control multimedia, animate images, and pretty

much everything else.

◾ It is also written in any text editor but add the .js extension.
EXAMPLE OF A WEBSITE
 BACK END DEVELOPMENT

◾ Backend development controls what goes on behind

the
scenes of the web applications.
◾ It is also known as server side development.
◾ Backend usually consists of three parts:
◾ A server
◾ An Application
◾ A Database

◾ Users can’t see how the backend works but this

code is what
communicates the database information to the
browser.
◾ Common Backend development technologies are:
◾ SQL
BACKEND D EVELOPMENT TECHNOLOGIES

◾ S Q L stands for Structured Query Language.

◾ S Q L let us access and manipulate databases.
◾ S Q L became a standard of the American National
Standards Institute (A N S I) in 1986, and of the
International O rganization for standardization (ISO )
in 1987.
◾ S Q L is a database language, it is used for
database creation, deletion, fetching rows, and
modifying rows, etc.
◾ It can retrieve data and executes queries against
the database.
◾ Every website is supported by a database at the
backend. Each time a user submits information or
searches something in the website, data gets stored
BACKEND D EVELOPMENT TECHNOLOGIES (CONT..)

◾ PHP is an acronym for “PHP:

Hypertext Preprocessor”.
◾ PHP is a widely-used, open source
scripting language.
◾ PHP scripts are executed on the
server.
◾ PHP is free to download and use.
◾ PHP is a server side scripting
language that is
embedded in H T M L.
◾ It is used to manage dynamic content,
databases, session tracking, even build
entire e-commerce sites.
 W H O IS A WEB DEVELOPER ?
◾ A web developer is a programmer who specializes in the
development of World Wide Web applications using a client–
server model.
◾ The applications typically use HTML, CSS and JavaScript
in the client, PHP, C#, Python, Node.js or Java in the
server, and http for communications between client
and server.
◾ Web developers typically do the following:
◾ Meet with clients or management to discuss the needs and
design of a website.
◾ C reate and test applications for a website.
◾ Write code for the website, using programming languages such as
HTML, CSS, etc.
◾ Work with other team members to determine what information
the site will contain.
◾ Work with graphics and other designers to determine the
 TYPES OF WEB DEVELOPER

◾ There are 3 kinds of Web Developers –

◾ Front End Developer,
◾ Back End Developer and,
◾ Full Stack D eveloper.
◾ Front-End Developer :-They are responsible for how a
website looks. They create the site's layout and integrate
graphics, applications (such as a retail checkout tool), and
other content.They also write web design programs in a
variety of computer languages, such as HTML or JavaScript.
◾ Back-End Developer :- They are responsible for server-side
web application logic and integration of the work front-end
developers do.
◾ Full-Stack Developer :- A full-stack web developer is a
person who can develop both client and server software.
They perform the task of both Front end and Back End
Developer.
 HO W A WEBSITE W ORKS ?

When you type a web address into your

browser :
◾ The browser goes to the D N S server, and
finds the real address of the server that the
website lives on.
◾ The browser sends an H T T P request
message to the
server, asking it to send a copy of the website to
the client.
◾ If the server approves the client's request, the
server sends the client a "200 O K " message,
which means "Of course you can look at
that website! Here it is", and then starts
sending the website's files to the browser as a
WEB DEVELOPER VS. WEB DESIGNER

Web Developer
◾ Web D evelopers are more technical in nature.
◾ Web development refers to building user-friendly
websites based on client’s specifications.
◾ They transform designs into fully functional websites.
◾ Web development refers to the functionality of the website on how it
works.
◾ Languages used are HTML, PHP, JavaScript, CSS, Python, Ruby, jQuery
etc.
 WEB DEVELOPER VS. WEB DESIGNER
Web Designer
My First
Project 
◾ Web Designers are very creative in nature.
◾ Web designers are the aesthetic element.
◾ They transform the ideas into visually appealing
designs.
◾ Web designs refers to how the websites looks and
feels on the outside.
◾ Web designing tools include Abobe Photoshop,
Who need for web develop

• ZAMPP/WAMP
• Sublime/notepad++
• Full package driver
 PROJECTS
Flipkart Clone
<html>
Project 

<title>Getting Started
With PHP</title> Output
<body>
<?php echo”Your first Your first
PHP code.”; ?>
</body>
PHP code.
</html>