SlideShare a Scribd company logo
1 of 21
TOPIC:- WEB DEVELOPMENT
Prepared By:
Mr. Angelo P. Changcoco
OUTLINES
◾ What isWeb Development ?
◾ Front end development
◾ Front end development technologies
◾ Back end development
◾ Back end development technologies
◾ Who is aWeb Developer ?
◾ Types ofWeb Developer
◾ How a website works ?
◾ Difference BetweenWeb Developer andWeb Designer
◾ Projects
WHAT IS WEB DEVELOPMENT ?
◾ Web Development usually refers to developing the website for
the Internet (WorldWide Web) or for an Intranet (Private
network).
◾ Also known asWeb Programming.
◾ It is the creation of DynamicWeb Applications.
◾ Examples of Web Applications are Social networking sites like
Facebook or E-commerce sites likeAmazon, 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 Development).
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
◾ CSS
◾ JAVASCRIPT
FRONTEND DEVELOPMENT TECHNOLOGIES
◾ HTML was first created byTim Berners-Lee,starting in 1989.It stands
for HyperText 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
or .html extension.
FRONTEND DEVELOPMENT TECHNOLOGIES (CONT..)
◾ CSS was first proposed by Hakon Wium Lie on October 10,1994
at CERN (European Organization for Nuclear Research).
◾ Cascading Style Sheets (CSS) describes how HTML 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.
FRONTEND DEVELOPMENT TECHNOLOGIES (CONT..)
◾ Javascript was invented by Brendan Eich in 1995.
◾ Javascript is the Programming Language for theWeb.
◾ Javascript can update and change both HTML 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
◾ PHP
BACKEND DEVELOPMENT TECHNOLOGIES
◾ SQL stands for Structured Query Language.
◾ SQL let us access and manipulate databases.
◾ SQL became a standard of theAmerican National Standards
Institute (ANSI) in 1986,and of the International Organization
for standardization (ISO) in 1987.
◾ SQL 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 and retrived from the database. SQL
is the language for qurying and storing data in the database.
BACKEND DEVELOPMENT 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 HTML.
◾ It is used to manage dynamic content,databases,
session tracking,even build entire e-commerce
sites.
◾ A web developer is a programmer who specializes in the development
ofWorld 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.
◾ Create 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 website's layout.
◾ Integrate graphics,audio,and video into the website.
◾ Monitor website traffic.
WHO IS A WEB DEVELOPER ?
TYPES OF WEB DEVELOPER
◾ There are 3 kinds of Web Developers –
◾ Front End Developer,
◾ Back End Developer and,
◾ Full Stack Developer.
◾ 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.
HOW A WEBSITE WORKS ?
When you type a web address into your browser :
◾ The browser goes to the DNS server,and finds the real
address of the server that the website lives on.
◾ The browser sends an HTTP 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 OK" 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
series of small chunks called data packets.
◾ The browser assembles the Data Packets into a
complete web page and displays it to you.
WEB DEVELOPER VS. WEB DESIGNER
Web Developer
◾ Web Developers 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 Designer
◾ 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 includeAbobe Photoshop,
Illustrater, DreamWeaver,Sketch etc.
PROJECTS
My First Project 
PROJECTS (CONT...)
Flipkart Clone Project 
PROJECTS (CONT...)
Responsive Blogging Website 
PROJECTS (CONT...)
Web-Development Powerpoint Presentation.
Web-Development Powerpoint Presentation.

More Related Content

Similar to Web-Development Powerpoint Presentation.

webdevelopmentppt-210923044639 (1).pptx
webdevelopmentppt-210923044639 (1).pptxwebdevelopmentppt-210923044639 (1).pptx
webdevelopmentppt-210923044639 (1).pptxlearnEnglish51
 
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptxINDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx12KritiGaneriwal
 
WEB DEVELOPMENT.pptx
WEB DEVELOPMENT.pptxWEB DEVELOPMENT.pptx
WEB DEVELOPMENT.pptxRajnirani18
 
Introduction to HTML, CSS, and JavaScript for Web Development
Introduction to HTML, CSS, and JavaScript for Web DevelopmentIntroduction to HTML, CSS, and JavaScript for Web Development
Introduction to HTML, CSS, and JavaScript for Web DevelopmentQurinom Solutions
 
web development.pptx
web development.pptxweb development.pptx
web development.pptxMohdArbazraza
 
Gettings started with Web development
Gettings started with Web developmentGettings started with Web development
Gettings started with Web developmentUjjwal Ojha
 
Web-Development-ppt (1).pptx
Web-Development-ppt (1).pptxWeb-Development-ppt (1).pptx
Web-Development-ppt (1).pptxRaihanUddin57
 
Introduction to HTML, CSS, and JavaScript for Web Development
Introduction to HTML, CSS, and JavaScript for Web DevelopmentIntroduction to HTML, CSS, and JavaScript for Web Development
Introduction to HTML, CSS, and JavaScript for Web DevelopmentQurinom Solutions
 
Web-Development-ppt.pptx
Web-Development-ppt.pptxWeb-Development-ppt.pptx
Web-Development-ppt.pptxEleenaJha
 
frontendwebdevelopment-190510024804 (1).pptx
frontendwebdevelopment-190510024804 (1).pptxfrontendwebdevelopment-190510024804 (1).pptx
frontendwebdevelopment-190510024804 (1).pptxReemaAsker1
 
Learn web development: Front-end vs Back-end development
Learn web development: Front-end vs Back-end developmentLearn web development: Front-end vs Back-end development
Learn web development: Front-end vs Back-end developmentpuneetbatra24
 
internship presentation 123445667890987a
internship presentation 123445667890987ainternship presentation 123445667890987a
internship presentation 123445667890987adhimanakshit76
 
Web Devlopment ppt.pptx
Web Devlopment ppt.pptxWeb Devlopment ppt.pptx
Web Devlopment ppt.pptxAartiVerma64
 
Web-Development-ppt.pptx
Web-Development-ppt.pptxWeb-Development-ppt.pptx
Web-Development-ppt.pptxAADITYADEVA
 
Web development revolution
Web development revolutionWeb development revolution
Web development revolutionAhmed El-Zekred
 
Web design and development (1) converted
Web design and development (1) convertedWeb design and development (1) converted
Web design and development (1) convertedSandy Gupta
 

Similar to Web-Development Powerpoint Presentation. (20)

webdevelopmentppt-210923044639 (1).pptx
webdevelopmentppt-210923044639 (1).pptxwebdevelopmentppt-210923044639 (1).pptx
webdevelopmentppt-210923044639 (1).pptx
 
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptxINDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
 
WEB DEVELOPMENT.pptx
WEB DEVELOPMENT.pptxWEB DEVELOPMENT.pptx
WEB DEVELOPMENT.pptx
 
Introduction to HTML, CSS, and JavaScript for Web Development
Introduction to HTML, CSS, and JavaScript for Web DevelopmentIntroduction to HTML, CSS, and JavaScript for Web Development
Introduction to HTML, CSS, and JavaScript for Web Development
 
amanWeb.ppt.pptx
amanWeb.ppt.pptxamanWeb.ppt.pptx
amanWeb.ppt.pptx
 
web development.pptx
web development.pptxweb development.pptx
web development.pptx
 
Gettings started with Web development
Gettings started with Web developmentGettings started with Web development
Gettings started with Web development
 
Web Development
Web DevelopmentWeb Development
Web Development
 
Web-Development-ppt (1).pptx
Web-Development-ppt (1).pptxWeb-Development-ppt (1).pptx
Web-Development-ppt (1).pptx
 
Introduction to HTML, CSS, and JavaScript for Web Development
Introduction to HTML, CSS, and JavaScript for Web DevelopmentIntroduction to HTML, CSS, and JavaScript for Web Development
Introduction to HTML, CSS, and JavaScript for Web Development
 
Web-Development-ppt.pptx
Web-Development-ppt.pptxWeb-Development-ppt.pptx
Web-Development-ppt.pptx
 
Mini Project PPT.pptx
Mini Project PPT.pptxMini Project PPT.pptx
Mini Project PPT.pptx
 
frontendwebdevelopment-190510024804 (1).pptx
frontendwebdevelopment-190510024804 (1).pptxfrontendwebdevelopment-190510024804 (1).pptx
frontendwebdevelopment-190510024804 (1).pptx
 
Learn web development: Front-end vs Back-end development
Learn web development: Front-end vs Back-end developmentLearn web development: Front-end vs Back-end development
Learn web development: Front-end vs Back-end development
 
Web development
Web developmentWeb development
Web development
 
internship presentation 123445667890987a
internship presentation 123445667890987ainternship presentation 123445667890987a
internship presentation 123445667890987a
 
Web Devlopment ppt.pptx
Web Devlopment ppt.pptxWeb Devlopment ppt.pptx
Web Devlopment ppt.pptx
 
Web-Development-ppt.pptx
Web-Development-ppt.pptxWeb-Development-ppt.pptx
Web-Development-ppt.pptx
 
Web development revolution
Web development revolutionWeb development revolution
Web development revolution
 
Web design and development (1) converted
Web design and development (1) convertedWeb design and development (1) converted
Web design and development (1) converted
 

More from JohnLagman3

8.-Javascript-report powerpoint presentation
8.-Javascript-report powerpoint presentation8.-Javascript-report powerpoint presentation
8.-Javascript-report powerpoint presentationJohnLagman3
 
7.-Bootstrap-5-report powerpoint presentation
7.-Bootstrap-5-report powerpoint presentation7.-Bootstrap-5-report powerpoint presentation
7.-Bootstrap-5-report powerpoint presentationJohnLagman3
 
1._Introduction_to_HTML5 powerpoint presentation
1._Introduction_to_HTML5 powerpoint presentation1._Introduction_to_HTML5 powerpoint presentation
1._Introduction_to_HTML5 powerpoint presentationJohnLagman3
 
bufferoverflow-151214121251 presentation
bufferoverflow-151214121251 presentationbufferoverflow-151214121251 presentation
bufferoverflow-151214121251 presentationJohnLagman3
 
Variables in MIT App Inventor powerpoint
Variables in MIT App Inventor powerpointVariables in MIT App Inventor powerpoint
Variables in MIT App Inventor powerpointJohnLagman3
 
History of Android powerpoint presentation
History of Android powerpoint presentationHistory of Android powerpoint presentation
History of Android powerpoint presentationJohnLagman3
 
Mobile Application Development powerpoint
Mobile Application Development powerpointMobile Application Development powerpoint
Mobile Application Development powerpointJohnLagman3
 
Presentation of Hyper Text Markup Language
Presentation of Hyper Text Markup LanguagePresentation of Hyper Text Markup Language
Presentation of Hyper Text Markup LanguageJohnLagman3
 
html-150424090224-conversion-gate0.2.pdf
html-150424090224-conversion-gate0.2.pdfhtml-150424090224-conversion-gate0.2.pdf
html-150424090224-conversion-gate0.2.pdfJohnLagman3
 
Hypertext Mark Up Language Introduction.
Hypertext Mark Up Language Introduction.Hypertext Mark Up Language Introduction.
Hypertext Mark Up Language Introduction.JohnLagman3
 
Multiple_Linear_Regression Presentation.
Multiple_Linear_Regression Presentation.Multiple_Linear_Regression Presentation.
Multiple_Linear_Regression Presentation.JohnLagman3
 
Lesson 4 - Introduction to Filmora.pptx
Lesson 4 - Introduction to Filmora.pptxLesson 4 - Introduction to Filmora.pptx
Lesson 4 - Introduction to Filmora.pptxJohnLagman3
 
1.-Introduction-report.pdf
1.-Introduction-report.pdf1.-Introduction-report.pdf
1.-Introduction-report.pdfJohnLagman3
 
Lesson 1 Animation.pdf
Lesson 1 Animation.pdfLesson 1 Animation.pdf
Lesson 1 Animation.pdfJohnLagman3
 
Confidentiality Privacy and Security.ppt
Confidentiality Privacy and Security.pptConfidentiality Privacy and Security.ppt
Confidentiality Privacy and Security.pptJohnLagman3
 
physicalsecurity-150317020111-conversion-gate01.pdf
physicalsecurity-150317020111-conversion-gate01.pdfphysicalsecurity-150317020111-conversion-gate01.pdf
physicalsecurity-150317020111-conversion-gate01.pdfJohnLagman3
 
Introduction to BIOMETRICS Security.pptx
Introduction to BIOMETRICS Security.pptxIntroduction to BIOMETRICS Security.pptx
Introduction to BIOMETRICS Security.pptxJohnLagman3
 
1.-Introduction-report.pptx
1.-Introduction-report.pptx1.-Introduction-report.pptx
1.-Introduction-report.pptxJohnLagman3
 
ORIENTATION-CIS.pdf
ORIENTATION-CIS.pdfORIENTATION-CIS.pdf
ORIENTATION-CIS.pdfJohnLagman3
 

More from JohnLagman3 (20)

8.-Javascript-report powerpoint presentation
8.-Javascript-report powerpoint presentation8.-Javascript-report powerpoint presentation
8.-Javascript-report powerpoint presentation
 
7.-Bootstrap-5-report powerpoint presentation
7.-Bootstrap-5-report powerpoint presentation7.-Bootstrap-5-report powerpoint presentation
7.-Bootstrap-5-report powerpoint presentation
 
1._Introduction_to_HTML5 powerpoint presentation
1._Introduction_to_HTML5 powerpoint presentation1._Introduction_to_HTML5 powerpoint presentation
1._Introduction_to_HTML5 powerpoint presentation
 
bufferoverflow-151214121251 presentation
bufferoverflow-151214121251 presentationbufferoverflow-151214121251 presentation
bufferoverflow-151214121251 presentation
 
Variables in MIT App Inventor powerpoint
Variables in MIT App Inventor powerpointVariables in MIT App Inventor powerpoint
Variables in MIT App Inventor powerpoint
 
History of Android powerpoint presentation
History of Android powerpoint presentationHistory of Android powerpoint presentation
History of Android powerpoint presentation
 
Mobile Application Development powerpoint
Mobile Application Development powerpointMobile Application Development powerpoint
Mobile Application Development powerpoint
 
Presentation of Hyper Text Markup Language
Presentation of Hyper Text Markup LanguagePresentation of Hyper Text Markup Language
Presentation of Hyper Text Markup Language
 
html-150424090224-conversion-gate0.2.pdf
html-150424090224-conversion-gate0.2.pdfhtml-150424090224-conversion-gate0.2.pdf
html-150424090224-conversion-gate0.2.pdf
 
Hypertext Mark Up Language Introduction.
Hypertext Mark Up Language Introduction.Hypertext Mark Up Language Introduction.
Hypertext Mark Up Language Introduction.
 
Multiple_Linear_Regression Presentation.
Multiple_Linear_Regression Presentation.Multiple_Linear_Regression Presentation.
Multiple_Linear_Regression Presentation.
 
Lesson 4 - Introduction to Filmora.pptx
Lesson 4 - Introduction to Filmora.pptxLesson 4 - Introduction to Filmora.pptx
Lesson 4 - Introduction to Filmora.pptx
 
1.-Introduction-report.pdf
1.-Introduction-report.pdf1.-Introduction-report.pdf
1.-Introduction-report.pdf
 
Lesson 1 Animation.pdf
Lesson 1 Animation.pdfLesson 1 Animation.pdf
Lesson 1 Animation.pdf
 
Lesson 1.pdf
Lesson 1.pdfLesson 1.pdf
Lesson 1.pdf
 
Confidentiality Privacy and Security.ppt
Confidentiality Privacy and Security.pptConfidentiality Privacy and Security.ppt
Confidentiality Privacy and Security.ppt
 
physicalsecurity-150317020111-conversion-gate01.pdf
physicalsecurity-150317020111-conversion-gate01.pdfphysicalsecurity-150317020111-conversion-gate01.pdf
physicalsecurity-150317020111-conversion-gate01.pdf
 
Introduction to BIOMETRICS Security.pptx
Introduction to BIOMETRICS Security.pptxIntroduction to BIOMETRICS Security.pptx
Introduction to BIOMETRICS Security.pptx
 
1.-Introduction-report.pptx
1.-Introduction-report.pptx1.-Introduction-report.pptx
1.-Introduction-report.pptx
 
ORIENTATION-CIS.pdf
ORIENTATION-CIS.pdfORIENTATION-CIS.pdf
ORIENTATION-CIS.pdf
 

Recently uploaded

Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Pooja Bhuva
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxRamakrishna Reddy Bijjam
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17Celine George
 
AIM of Education-Teachers Training-2024.ppt
AIM of Education-Teachers Training-2024.pptAIM of Education-Teachers Training-2024.ppt
AIM of Education-Teachers Training-2024.pptNishitharanjan Rout
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfPondicherry University
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jisc
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Jisc
 
QUATER-1-PE-HEALTH-LC2- this is just a sample of unpacked lesson
QUATER-1-PE-HEALTH-LC2- this is just a sample of unpacked lessonQUATER-1-PE-HEALTH-LC2- this is just a sample of unpacked lesson
QUATER-1-PE-HEALTH-LC2- this is just a sample of unpacked lessonhttgc7rh9c
 
Tatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsTatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsNbelano25
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17Celine George
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxCeline George
 
UGC NET Paper 1 Unit 7 DATA INTERPRETATION.pdf
UGC NET Paper 1 Unit 7 DATA INTERPRETATION.pdfUGC NET Paper 1 Unit 7 DATA INTERPRETATION.pdf
UGC NET Paper 1 Unit 7 DATA INTERPRETATION.pdfNirmal Dwivedi
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxEsquimalt MFRC
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...Nguyen Thanh Tu Collection
 
Simple, Complex, and Compound Sentences Exercises.pdf
Simple, Complex, and Compound Sentences Exercises.pdfSimple, Complex, and Compound Sentences Exercises.pdf
Simple, Complex, and Compound Sentences Exercises.pdfstareducators107
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxJisc
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...Nguyen Thanh Tu Collection
 
Economic Importance Of Fungi In Food Additives
Economic Importance Of Fungi In Food AdditivesEconomic Importance Of Fungi In Food Additives
Economic Importance Of Fungi In Food AdditivesSHIVANANDaRV
 

Recently uploaded (20)

Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
Beyond_Borders_Understanding_Anime_and_Manga_Fandom_A_Comprehensive_Audience_...
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
Our Environment Class 10 Science Notes pdf
Our Environment Class 10 Science Notes pdfOur Environment Class 10 Science Notes pdf
Our Environment Class 10 Science Notes pdf
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
AIM of Education-Teachers Training-2024.ppt
AIM of Education-Teachers Training-2024.pptAIM of Education-Teachers Training-2024.ppt
AIM of Education-Teachers Training-2024.ppt
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)
 
QUATER-1-PE-HEALTH-LC2- this is just a sample of unpacked lesson
QUATER-1-PE-HEALTH-LC2- this is just a sample of unpacked lessonQUATER-1-PE-HEALTH-LC2- this is just a sample of unpacked lesson
QUATER-1-PE-HEALTH-LC2- this is just a sample of unpacked lesson
 
OS-operating systems- ch05 (CPU Scheduling) ...
OS-operating systems- ch05 (CPU Scheduling) ...OS-operating systems- ch05 (CPU Scheduling) ...
OS-operating systems- ch05 (CPU Scheduling) ...
 
Tatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsTatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf arts
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptx
 
UGC NET Paper 1 Unit 7 DATA INTERPRETATION.pdf
UGC NET Paper 1 Unit 7 DATA INTERPRETATION.pdfUGC NET Paper 1 Unit 7 DATA INTERPRETATION.pdf
UGC NET Paper 1 Unit 7 DATA INTERPRETATION.pdf
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
Simple, Complex, and Compound Sentences Exercises.pdf
Simple, Complex, and Compound Sentences Exercises.pdfSimple, Complex, and Compound Sentences Exercises.pdf
Simple, Complex, and Compound Sentences Exercises.pdf
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptx
 
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
80 ĐỀ THI THỬ TUYỂN SINH TIẾNG ANH VÀO 10 SỞ GD – ĐT THÀNH PHỐ HỒ CHÍ MINH NĂ...
 
Economic Importance Of Fungi In Food Additives
Economic Importance Of Fungi In Food AdditivesEconomic Importance Of Fungi In Food Additives
Economic Importance Of Fungi In Food Additives
 

Web-Development Powerpoint Presentation.

  • 1. TOPIC:- WEB DEVELOPMENT Prepared By: Mr. Angelo P. Changcoco
  • 2. OUTLINES ◾ What isWeb Development ? ◾ Front end development ◾ Front end development technologies ◾ Back end development ◾ Back end development technologies ◾ Who is aWeb Developer ? ◾ Types ofWeb Developer ◾ How a website works ? ◾ Difference BetweenWeb Developer andWeb Designer ◾ Projects
  • 3. WHAT IS WEB DEVELOPMENT ? ◾ Web Development usually refers to developing the website for the Internet (WorldWide Web) or for an Intranet (Private network). ◾ Also known asWeb Programming. ◾ It is the creation of DynamicWeb Applications. ◾ Examples of Web Applications are Social networking sites like Facebook or E-commerce sites likeAmazon, 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 Development).
  • 4. 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 ◾ CSS ◾ JAVASCRIPT
  • 5. FRONTEND DEVELOPMENT TECHNOLOGIES ◾ HTML was first created byTim Berners-Lee,starting in 1989.It stands for HyperText 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 or .html extension.
  • 6. FRONTEND DEVELOPMENT TECHNOLOGIES (CONT..) ◾ CSS was first proposed by Hakon Wium Lie on October 10,1994 at CERN (European Organization for Nuclear Research). ◾ Cascading Style Sheets (CSS) describes how HTML 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.
  • 7. FRONTEND DEVELOPMENT TECHNOLOGIES (CONT..) ◾ Javascript was invented by Brendan Eich in 1995. ◾ Javascript is the Programming Language for theWeb. ◾ Javascript can update and change both HTML 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.
  • 8. EXAMPLE OF A WEBSITE
  • 9. 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 ◾ PHP
  • 10. BACKEND DEVELOPMENT TECHNOLOGIES ◾ SQL stands for Structured Query Language. ◾ SQL let us access and manipulate databases. ◾ SQL became a standard of theAmerican National Standards Institute (ANSI) in 1986,and of the International Organization for standardization (ISO) in 1987. ◾ SQL 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 and retrived from the database. SQL is the language for qurying and storing data in the database.
  • 11. BACKEND DEVELOPMENT 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 HTML. ◾ It is used to manage dynamic content,databases, session tracking,even build entire e-commerce sites.
  • 12. ◾ A web developer is a programmer who specializes in the development ofWorld 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. ◾ Create 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 website's layout. ◾ Integrate graphics,audio,and video into the website. ◾ Monitor website traffic. WHO IS A WEB DEVELOPER ?
  • 13. TYPES OF WEB DEVELOPER ◾ There are 3 kinds of Web Developers – ◾ Front End Developer, ◾ Back End Developer and, ◾ Full Stack Developer. ◾ 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.
  • 14. HOW A WEBSITE WORKS ? When you type a web address into your browser : ◾ The browser goes to the DNS server,and finds the real address of the server that the website lives on. ◾ The browser sends an HTTP 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 OK" 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 series of small chunks called data packets. ◾ The browser assembles the Data Packets into a complete web page and displays it to you.
  • 15. WEB DEVELOPER VS. WEB DESIGNER Web Developer ◾ Web Developers 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 Designer ◾ 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 includeAbobe Photoshop, Illustrater, DreamWeaver,Sketch etc.