Your SlideShare is downloading. ×
0
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Ggc
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Ggc

761

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
761
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • http://www.ipoque.com/resources/internet-studies/internet-study-2007
  • As a developer, which browser do you prefer?
  • As a developer, which browser do you prefer?
  • Web 2.0 http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html http://en.wikipedia.org/wiki/Web_2 http://news.zdnet.com/2036-2_22-6103931.html
  • Massive participation, sharing and collaboration Content created by users; Content from multiple sources;
  • Social websites will be united Browser can become more versatile More gadgets than pages 3D Fusion with other software and hardware Web in TV, video, game, etc. More applications will become a mixture of online and offline
  • Transcript

    • 1. Introduction to the Web and Web Applications Teaching Presentation at Georgia Gwinnett College Jack G. Zheng Feb 20 th 2009
    • 2. Agenda <ul><li>What is the web? What is web application? </li></ul><ul><li>How does it work? </li></ul><ul><li>Evolution of the web and web applications </li></ul><ul><ul><li>Pre-web (before 1990) </li></ul></ul><ul><ul><li>Early web (1990s) </li></ul></ul><ul><ul><li>Dynamic web (since second-half 1990s) </li></ul></ul><ul><ul><li>Current web (21 st century) </li></ul></ul>
    • 3. Pre-Web <ul><li>Before there was the Web, there was the Internet </li></ul><ul><li>Internet Applications </li></ul><ul><ul><li>Usenet, BBS, Telnet </li></ul></ul><ul><ul><li>Email, FTP </li></ul></ul><ul><ul><li>Web </li></ul></ul><ul><ul><li>(More recently) </li></ul></ul><ul><ul><li>P2P </li></ul></ul><ul><ul><li>Video streaming </li></ul></ul><ul><ul><li>Instant messaging, VoIP </li></ul></ul><ul><ul><li>Gaming </li></ul></ul><ul><li>Which one generates the most traffic volume on the Internet? </li></ul><ul><ul><li>Answer form: ipoque , Cisco , Sandvine </li></ul></ul>
    • 4. Early Web, Simple Web <ul><li>Sir Tim Berners-Lee, 1989 </li></ul><ul><li>A client/server application for information and other services </li></ul><ul><li>Fundamental elements of web applications </li></ul><ul><ul><li>Web server </li></ul></ul><ul><ul><li>Web client: browser </li></ul></ul><ul><ul><li>Web content: HTML (hypertext markup language) </li></ul></ul><ul><ul><li>Web protocol: HTTP (hypertext transfer protocol) </li></ul></ul><ul><ul><li>Web address: URL (uniform resource locator) </li></ul></ul>
    • 5. Simple Web Architecture The Internet HTTP URL Browser (Internet Explorer, Firefox, etc.) Web server HTML Files
    • 6. How does it work? <ul><li>What happens after a URL is entered in the web browser? </li></ul><ul><ul><li>http://gzheng.cis.gsu.edu/teaching/cis2010su2005/coursework.htm </li></ul></ul>DNS server(s) 1. Looking for the IP of the domain “gzheng.cis.gsu.edu” 2. Returning the IP of the domain: 131.96.101.119 3. Sending an HTTP request to 131.96.101.119 5. Sending an HTTP response back 4. Looking for the file “/teaching/cis2010su2005/coursework.htm”
    • 7. Simple Web Applications <ul><li>Document based web application </li></ul><ul><ul><li>Simple, small and fast </li></ul></ul><ul><li>Web presence, information publishing </li></ul><ul><ul><li>http://www.istanta.com/ </li></ul></ul><ul><ul><li>http://www.atlantapetrescue.org </li></ul></ul><ul><ul><li>http://facultyweb.ggc.usg.edu/cpark/ </li></ul></ul><ul><ul><li>http://desrist2009.ist.psu.edu/ </li></ul></ul><ul><ul><li>http://www.useit.com/alertbox/ </li></ul></ul>
    • 8. Dynamic Web <ul><li>Static  dynamic </li></ul><ul><ul><li>Web pages are constructed at design time  at run time </li></ul></ul><ul><ul><li>HTML files  a mixture of HTML, scripts, programming codes, executable programs, etc. </li></ul></ul><ul><ul><li>Content is from a single source  multiple sources (HTML files, XML files, other files, databases, other websites) </li></ul></ul><ul><li>Simple  complex </li></ul><ul><ul><li>Interaction mode: click and read  write/type, choose, move, slide, drag and drop, expand, draw, listen, speak, etc. </li></ul></ul><ul><ul><li>Development: Webpage authoring  web application development (web engineering) </li></ul></ul>
    • 9. Dynamic Web Technology: Client Side (DHTML) <ul><li>Style sheet ( CSS ) </li></ul><ul><ul><li>Page style (color, size, position, etc.): website themes </li></ul></ul><ul><ul><li>Style change on events: link hover </li></ul></ul><ul><li>Scripting (JavaScript) </li></ul><ul><ul><li>Dynamic content: calendar </li></ul></ul><ul><ul><li>Dynamically changing content: dropdown menu </li></ul></ul><ul><ul><li>Simple animations: text animation </li></ul></ul><ul><li>Plug-ins </li></ul><ul><ul><li>Flash, Sliverlight, Java Applets </li></ul></ul><ul><ul><li>http://kartoo.com </li></ul></ul>
    • 10. Dynamic Web Technology: Server Side <ul><li>Specialized servers </li></ul><ul><ul><li>Web server extensions or application servers </li></ul></ul><ul><ul><ul><li>Adding programming capabilities: ASP, ASP.Net, JSP, JSF, Servlet, PHP, ColdFusion, etc. </li></ul></ul></ul><ul><ul><li>Database servers </li></ul></ul><ul><ul><ul><li>Complementing file systems for content management </li></ul></ul></ul><ul><li>Dynamic pages: no longer stored in pure html </li></ul><ul><ul><li>Database populated: news site, portal, product catalog, directory, etc. </li></ul></ul><ul><ul><li>URL query string: product data </li></ul></ul><ul><ul><li>Acting on user input: web search, forum post, log in, etc. </li></ul></ul>
    • 11. Dynamic Web Applications <ul><li>E-Commerce </li></ul><ul><ul><li>Shopping, banking, bidding, trading, etc. </li></ul></ul><ul><ul><li>Dot-com bubble </li></ul></ul><ul><li>Web search engine </li></ul><ul><li>Online news and magazines </li></ul><ul><li>Web portal </li></ul><ul><li>E-government </li></ul><ul><li>… </li></ul>
    • 12. Current Web <ul><li>Web as a platform/infrastructure </li></ul><ul><ul><li>For enterprises and other organizations, web is becoming a fundamental piece of their information system </li></ul></ul><ul><li>Web 2.0 </li></ul><ul><ul><li>A general and loose concept for recent advancements of the World Wide Web </li></ul></ul>
    • 13. Web as a Platform <ul><li>A fundamental platform for organizational information systems (company, enterprise, non-profit, government, college, community, etc.) </li></ul><ul><ul><li>Add-on  infrastructure/platform </li></ul></ul><ul><ul><li>Separate  integrated </li></ul></ul><ul><li>Enabling technologies </li></ul><ul><ul><li>Web services </li></ul></ul><ul><ul><li>Security infrastructure: SSL, PKI </li></ul></ul><ul><ul><li>Matured web application servers and frameworks: SharePoint, DotNetNuke, Drupal, Structs, CommunityServer, etc. </li></ul></ul>
    • 14. Web 2.0 Applications <ul><li>Examples </li></ul><ul><ul><li>youtube.com, myspace.com, ireport.com, blogspot.com, yelp.com, </li></ul></ul><ul><ul><li>wikipedia.org </li></ul></ul><ul><ul><li>delicious.com </li></ul></ul><ul><ul><li>housingmaps.com </li></ul></ul><ul><ul><li>maps.google.com, Photoshop express, eyeos.info </li></ul></ul><ul><li>Buzz words </li></ul><ul><ul><li>Blog, Wiki, SNS, folksonomy, mash-up, web desktop </li></ul></ul>
    • 15. Web 2.0 Technologies <ul><li>AJAX </li></ul><ul><ul><li>Enables new interaction model: Yahoo Finance </li></ul></ul><ul><ul><li>Enables new navigation model: Yahoo Mail, MyYahoo </li></ul></ul><ul><li>XML (family) </li></ul><ul><ul><li>Bringing structure and meaning, for easy aggregation and integration </li></ul></ul><ul><ul><li>RSS: ZDNet News to MyYahoo </li></ul></ul><ul><li>Web services and APIs </li></ul><ul><ul><li>Distributed, but integrated </li></ul></ul><ul><ul><li>Example: Google search API </li></ul></ul>
    • 16. Summarizing Web Trend <ul><li>Web client </li></ul><ul><ul><li>Browser  any other application </li></ul></ul><ul><li>Web server </li></ul><ul><ul><li>One server handles all  multiple distributed and specialized servers </li></ul></ul><ul><li>Web content </li></ul><ul><ul><li>HTML  XML, XHTML, CSS, embedded content (Flash etc.), scripts </li></ul></ul><ul><li>Web protocol </li></ul><ul><ul><li>HTTP  working with other protocols (video streaming, email, etc.) </li></ul></ul><ul><li>Web URL </li></ul><ul><ul><li>Physical document  virtual entry point (resource identifier) </li></ul></ul>
    • 17. Future … <ul><li>What do you anticipate? </li></ul><ul><ul><li>If you are a user … </li></ul></ul><ul><ul><li>If you are a developer … </li></ul></ul>
    • 18. Summary <ul><li>Back to the opening </li></ul><ul><ul><li>What is the web (WWW)? </li></ul></ul><ul><ul><li>What is a web application? </li></ul></ul><ul><ul><ul><li>How do you classify an application as web application? </li></ul></ul></ul>
    • 19. Key Concepts <ul><li>Internet, web, web application </li></ul><ul><li>HTML, HTTP, URL </li></ul><ul><li>Web server, browser </li></ul><ul><li>Domain, IP, DNS </li></ul><ul><li>XML, CSS, DHTML, AJAX </li></ul><ul><li>Web service, API </li></ul><ul><li>SSL, PKI </li></ul><ul><li>Web 2.0 </li></ul>

    ×