WEB BASE APPLICATION DEVELOPMENT
description
Transcript of WEB BASE APPLICATION DEVELOPMENT
![Page 1: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/1.jpg)
WEB BASE APPLICATION
DEVELOPMENTNASRULLAH KHAN
![Page 2: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/2.jpg)
Introduction to web Development
Lecturer : Nasrullah
Email :[email protected]
Website :http://iba-s13-cse308.wikispaces.com
![Page 3: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/3.jpg)
World wide web
The World Wide Web, (WWW) is a system of
interlinked hypertext documents accessed via
the Internet. With a web browser, one can view
web pages that may contain text, images,
videos, and other multimedia and navigate
between them via hyperlinks
![Page 4: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/4.jpg)
Just two things(IT IS ALL ABOUT)
Web browser (client)
Web server (on which web site is hosted).
![Page 5: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/5.jpg)
What is web browser A browser is an application that displays
websites from remote server through the
internet.
web browser is a software application for
retrieving, presenting, and traversing information
resources on the World Wide Web.
Most popular web browsers ?
![Page 6: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/6.jpg)
Web server A web server is a piece of software that manages
web pages and makes them available to client browsers via a local network or over the internet.
Web server :- Apache,IIS,Iplanet’s Enterprise server
We had to install IIS 7.0 services on our machine to make our machine a web server.
![Page 7: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/7.jpg)
Web server
The primary function of a web server is to deliver
web pages on the request to clients. This means
delivery of HTML documents and any additional
content that may be included by a document,
such as images, style sheets and scripts.
![Page 8: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/8.jpg)
Hyper text transfer protocol HTTP, short for HyperText Transfer Protocol, is
the protocol for transferring hypertext documents that makes the World Wide Web possible. A standard web address
http://www.google.com/ is called a URL; the prefix (http in the example) indicates its protocol.
![Page 9: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/9.jpg)
Hyper text Hypertext is text displayed on a computer or
other electronic device with references (hyperlinks) to other text that the reader can immediately access, usually by a mouse click or key press sequence.
![Page 10: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/10.jpg)
HYPER TEXT MARKUP LANGUAGE Hypertext Markup Language, a standardized
system for tagging text files to achieve font, color, graphic, and hyperlink effects on World Wide Web pages.
HTML stands for Hyper Text Markup Language HTML is not a programming language, it is a
markup language A markup language is a set of markup tags HTML uses markup tags to describe web pages
![Page 11: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/11.jpg)
WEB APPLICATION Web applications are applications that use the
Internet’s infrastructure to delivere their functionality.
A web application is an application that is accessed over a network such as the Internet or an intranet.
Web Applications do not use the more traditional client/server technologies,but are using web technologies such as web browsers and web servers.
![Page 12: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/12.jpg)
WEB APPLICATION The Internet carries a vast range of information
resources and services, such as the inter-linked hypertext documents of the World Wide Web (WWW) and the infrastructure to support electronic mail.
intranet is a private computer network that uses Internet Protocol technology to securely share any part of an organization's informationlectronic mail. It is an organization's internal website
![Page 13: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/13.jpg)
Benefits Web applications do not require any complex "roll
out" procedure to deploy in large organizations. A compatible web browser is all that is needed
Browser applications typically require little or no
disk space on the client They require no upgrade procedure since all new
features are implemented on the server and automatically delivered to the users
![Page 14: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/14.jpg)
Benefits Web applications integrate easily into other
server-side web procedures, such as email and searching.
They also provide cross-platform compatibility in most cases (i.e., Windows, Mac, Linux, etc.) because they operate within a web browser window.
![Page 15: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/15.jpg)
Advantages of Web Applications No special configuration or changes are need on
user's PCs. Lower costs. Centralised data is secure and easy to backup.
Updates can be made quickly and easily. Information is accessible to a wide audience anywhere in the world.
Available 24 hours a day, 7 days a week. Everybody has a browser - familiar interface
encourages. Always up-to-date.
![Page 16: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/16.jpg)
WEB APPLICATION Web server: a system on the internet containg one or
more web site Web site: a collection of one or more web pages Web pages: single disk file with a single file name Home pages: first page in website
![Page 17: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/17.jpg)
Staic web site or page A static website contains Web pages with fixed
content. Each page is coded in HTML and
displays the same information to every visitor.
Static sites are the most basic type of website
and are the easiest to create.
![Page 18: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/18.jpg)
![Page 19: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/19.jpg)
Limitations of static web page
?
![Page 20: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/20.jpg)
We need to generate the html after the page is requested.
![Page 21: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/21.jpg)
Dynamic web pages Client side dynamic web pages:-
Server side dynamic web pages
![Page 22: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/22.jpg)
Client side dynamic web page
![Page 23: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/23.jpg)
Server side dynamic web page
![Page 24: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/24.jpg)
Client side technologies for providing dynamic content Javascript Vbscript activeX Controls Java Applets Curl
![Page 25: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/25.jpg)
Server side technologies for providing dynamic content CGI ASP JSP COLDFUSION PHP
ASP.NET
![Page 26: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/26.jpg)
HTML
<HTML> <HEAD> <TITLE>IBA</TITLE> </HEAD> <BODY> IBA </BODY> </HTML>
![Page 27: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/27.jpg)
HTML1.Use an text editor such as Notepad to write the
document. 2.Save the file as filename.html on a PC. This is called
the Document Source. 3.Open internet Explorer (or any browser) Off-Line 4.Switch to Explorer. 5.Click on File, Open File and select the filename.html
document that you just created. 6.Your HTML page should now appear in Explorer.
![Page 28: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/28.jpg)
HTML7.You may now switch back and forth between the
Source and the HTML Document switch to Notepad with the Document Source make changes save the document again switch back to Internet Explorer click on RELOAD and view the new HTML Document switch to Notepad with the Document Source......
![Page 29: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/29.jpg)
<HEAD>...</HEAD>-- contains information about the document The <head> element is a container for all the head elements.
Elements inside <head> can include scripts, instruct the browser where to find style sheets, provide meta information, and more.
The following tags can be added to the head section: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.
<TITLE>...</TITLE>-- puts text on the browser's title bar. Heading: <H1> </H1>Center:<Center> </Center>Line Break <P> ,<Br>Phrase Markups: <I></I> ,<B></B>Unordered list : <UL><li>Ordered list: <OL><li>Nested
![Page 30: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/30.jpg)
ADD IMAGEUse <IMG SRC=imagefilename> tagsAttributes of IMG tag
-width, height-Alt-Align-<Img src=my.gif width=50 height=50 align=right alt=“My image”>
Use <A href=filename|URL></a>tags
![Page 31: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/31.jpg)
<head><HEAD>...</HEAD>-- contains information about the document The <head> element is a container for all the head elements.
Elements inside <head> can include scripts, instruct the browser where to find style sheets, provide meta information, and more.
The following tags can be added to the head section: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.
<head><link rel="stylesheet" type="text/css" href="mystyle.css"></head>
![Page 32: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/32.jpg)
<img> <!DOCTYPE html> <html> <body>
<h2>Norwegian Mountain Trip</h2> <img border="0" src="/images/pulpit.jpg" alt="Pulpit
rock" width="304" height="228">
</body> </html>
![Page 33: WEB BASE APPLICATION DEVELOPMENT](https://reader035.fdocuments.net/reader035/viewer/2022062814/568167e3550346895ddd4b65/html5/thumbnails/33.jpg)
<table> <table border="1">
<tr><th>Header 1</th><th>Header 2</th></tr><tr><td>row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>