Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Welcome CSCI/CINF 4230 Web Application Developement • Section 02 Tue., 7:00–9:50 p.m. Instructor: Charles Moen • • • • Email – [email protected] Web page – http://sce.uhcl.edu/moenc Office – Delta Building 232 Office hours – Tue., 5:00–7:00 p.m. – If the hall door is locked, phone me at (281) 283-3848 • Home – 281-796-2820 1 CSCI/CINF 4230 Client-side Web development • HTML, XHTML, Cascading Style Sheets (CSS), JavaScript Server-side Web development • ASP.NET, C# Server-side database access • ASP.NET, C# Other basic topics in Web development • HTTP protocol, parameter passing, session tracking, cookies • Web 2.0 2 26-Aug-2008 Today’s Objectives Class roster Course overview • • • • • Required textbooks Web site Syllabus and schedule Hosting your web sites for this course at UHCL How to succeed Basic concepts Web 2.0 3 Course Overview Required Textbooks David Schultz and Craig Cook, Beginning HTML with CSS and XHTML: Modern Guide and Reference. Apress, 2007. ISBN 978-1-59059-747-7 Matthew MacDonald, Beginning ASP.NET 3.5 in C# 2008: From Novice to Professional, Second Edition. Apress, 2007. ISBN 978-1-59059-891-7 4 Course Overview Recommended Reference Books Stephen Spainhour and Robert Eckstein (ed.), Webmaster in a Nutshell, 3rd Edition. O’Reilly, 2002. ISBN 978-0-59600-357-9 Other books are listed in the “FAQs” page for this class Safari Books Online by O'Reilly http://safari.oreilly.com/ You can access Safari from any PC inside UHCL campus network. Provides the full text of hundreds of books 5 Course Overview Course Web Pages Course page http://sce.uhcl.edu/moenc/csci4230fall08/index.html Schedule http://sce.uhcl.edu/moenc/csci4230fall08/schedule.html Syllabus http://sce.uhcl.edu/moenc/csci4230fall08/syllabus.html FAQs http://sce.uhcl.edu/moenc/csci4230fall08/resources.html 6 Course Overview Hosting Your Web Site The dcm server is used to host Web sites for UHCL courses You will get an account on this server, and your homework must be done on it dcm.uhcl.edu • • • • • Operating system: Windows Server 2003 Web server: IIS6 http://dcm.uhcl.edu/yourUserName Files for your Web pages go in the “pages” folder The “db” folder has an Access database file, “db.mdb” Krishani Ekanayake is the administrator • [email protected] 7 Course Overview How to Succeed Expect to spend 10–15 hours per week on this class Use a text editor to write the code, and write a lot of code Read other peoples’ programs • After grading is finished, post your homework on your home page Homework assignments • • Start them early, and hand them in on time Check the requirements and make sure nothing is missing Team project • Select your team mates Attend the classes & participate Read the book and the resources 8 Basic Concepts 9 Basic Concepts (Dougherty, Howe, Tyson) The Internet A global network of interconnected networks Based on technology developed in the 1960’s • ARPAnet, the first version, was funded by the U.S. Department of Defense in a quest to implement a computer network that could survive a nuclear bomb attack – if part of the network was destroyed, then routers would direct packets through the surviving paths (ARPAnet = Advanced Research Projects Agency Network) • Goal: a robust network of many computers for sharing scientific and military data • Initially, ARPAnet connected only four computers at UCLA, Stanford Research Institute, UCSB, and the University of Utah. • Mid 1970s, many government agencies and universities were connected; Early 1990s, private and commercial networks were added No one owns the Internet • The Internet Society, a 1992 non-profit group, oversees its policies and 10 protocols Basic Concepts (http://www.internetworldstats.com) Growth of the Internet 11 Basic Concepts (Dougherty, Howe, Tyson) The Internet (Continued) General-purpose network • TCP/IP - protocols for sending packets of data on the network • Many services run on the Internet – email – FTP – telnet – World Wide Web (just one service that uses the Internet) Every computer that connects to the Internet is already part of a smaller network • When you connect to the Internet at home, you become part of your Internet Service Provider’s (ISP) network • At work or at school, your computer connects to the Internet through the Local Area Network (LAN) • Thus, the Internet is a network of networks 12 Basic Concepts (Tyson; Wikipedia) Internet Infrastructure Point of Presence is the physical connection to the Internet used by the ISP (servers, routers, switches) Internet Service Provider is a company that provides access to the Internet Network Access Point Four physical facilities for data exchange between service providers. Now replaced by Internet Exchange Points (IXP) (network switches) 13 Basic Concepts (Berners-Lee, Dougherty, Howe, Tyson, Wikipedia) World Wide Web “A system of interlinked hypertext documents accessed via the Internet” - Wikipedia Created by Tim Berners-Lee • • • • • In 1989, proposed it as a way to share documents over a network while he was working at CERN (European Laboratory for Particle Physics) Originally conceived as just a collection of shared documents Based on hypertext – links within the text that link to other text By 1990, built the first Web server, named “httpd,” and the first Web browser, named “WorldWideWeb” His work was released to the public in 1993 World Wide Web Consortium (W3C) • Standards organization for the Web • Founded by Tim Berners-Lee Sir Tim Berners-Lee from www.w3c.org/People/Berners-Lee 14 Basic Concepts (Guelich) How does the Web work? The Web uses a client-server architecture 1. A Web browser, such as FireFox is the client Web server software, such as Apache or IIS is the server The browser sends an HTTP request over the Internet to the server 3. 4. The server sends an HTTP response to the browser containing the HTML text The browser interprets the HTML and displays it as a Web page 2. The server examines the request to determine what document to return, index.html in this example GET /index.html HTTP/1.1 15 Basic Concepts (Guelich) Client-server Architecture Web application development technologies: Web server software, such as Apache or IIS is the server A Web browser, such as FireFox is the client HTTP Client-side Server-side HTML XHTML CSS JavaScript ASP.NET C# 16 Basic Concepts (Doughterty, Netcraft) Web Server Server software • • • • Installed on a computer connected to the Internet Often the computer that runs the server software is referred to as a “Web server” Manages a collection of HTML documents, as well as documents in other languages, such as C# Manages and “serves” the clients’ requests for the documents Two Web server programs dominate the market share today • Apache • Microsoft 17 Basic Concepts (Netcraft) Web Server Netcraft, June 2008 Web Server Survey. (2008). [Online]. Available: http://news.netcraft.com/archives/web_server_survey.html 18 Basic Concepts (Schultz) User Agents Software that interprets HTML • Many different devices can access the Web • Computers, PDAs, cell phones, game consoles, appliances Web browser • The most familiar user agent • Graphical Web browser – pages rendered with styled text, colors, and images • The most-popular browsers – Microsoft Internet Explorer – Firefox – Safari 19 Basic Concepts (Ding, Spainhour, Schultz) URL Uniform Resource Locator The address of a document on the Web http://sce.uhcl.edu/moenc/index.html Protocol Rules for moving data over the Internet Host name or IP address following by an optional port number, e.g. Path to the document The root directory in this path is defined by the server, and may not be the same as on the host’s file system sce.uhcl.edu:80 The human-readable domain name is translated to a machine usable IP address by the Internet’s Domain Naming Service servers Extension Indicates the type of file. If there is no document name in the URL, the server is usually configured to use “index.html” or “default.html” 20 Basic Concepts (Ding, Spainhour) URL for local development The loopback address http://127.0.0.1 http://localhost 21 Basic Concepts (Siegal, Ding) Web Design Evolution First Generation • Plain, mostly text • Single column • Presentation (appearance) set by browser defaults – Gray background with black text – Links were underlined and in color • Emphasis on structure, not design – Few images – Horizontal rules – Bullet lists From Wikipedia • Often created by programmers, not designers • Slow modem connections were common 22 Basic Concepts (Siegal, Ding) Web Design Evolution Second Generation • Netscape extensions to HTML introduced – <table> – JavaScript – The <blink> tag • Designers usually controlled the presentation • Some common features – – – – – – White backgrounds Banners across the top of the page Icons and graphic text for headings Graphic buttons with beveled edges Tiled images in the background Animated gif graphics From the Internet Archive WaybackMachine www.jpmorgan.com, June 30, 1998 23 Basic Concepts (Siegal, Ding) Web Design Evolution Second Generation (cont.) • Structure – Main, graphic-intensive home page – Menus and button bars for navigation – Tables, introduced by Netscape, were often used to organize the page into columns • Many sites were well-designed – The best ones showed that the designers were concerned about legibility and communicating clearly to the visitor • Many sites were garish and ugly – The worst second generation sites used technical tricks, such as animated gif icons just because they were “cool” From the Internet Archive WaybackMachine www.uiuc.edu, March 03, 1997 24 Basic Concepts (Siegal, Ding) Web Design Evolution Third Generation • E-commerce • Database-driven • Clever visual design based on a theme – Tables used extensively – CSS used for presentation – Designed to involve users with the site – Often started with a splash screen From the Internet Archive WaybackMachine www.klutz.com, Feb 02, 2001 25 Basic Concepts (Siegal, Ding) Web Design Evolution Fourth Generation • Sophisticated visual design – Presentation is designed with div elements, defined with CSS, not tables • Most sites use server-side software – Multi-tiered on the server side – Database driven – Possibly with web services • http://www.ncsa.uiuc.edu http://www.jpmorgan.com http://www.uiuc.edu http://www.klutz.com New technologies – AJAX and client-side software – Flash, Silverlight, Adobe AIR • Big focus is web usability and accessibility 26 Basic Concepts (Koch, Ding) Accessibility and Usability Accessibility • • Your Web site should be accessible to anyone under all circumstances Issues: – Users with diminished eyesight must use screen readers – Some users don’t use a mouse; they may be partially disabled – Some users disable JavaScript Usability • • Enhancing your page with features that make it easier to use Examples: – Show a form field only when it is needed by the user – Make important topics easy to find – Keep the user interface simple 27 Web 2.0 28 Web 2.0 (O’Reilly, Ding, Yue) What is Web 2.0? A phrase by Tim O’Reilly • • Published online, “What Is Web 2.0, Design Patterns and Business Models for the Next Generation of Software” September 2005 Web 2.0 Conference • Now in its fifth year, called “Web 2.0 Summit” “Web 2.0” and the conference were created by brainstorming about what is important to the Web after the collapse of the “dot-com bubble” 29 Web 2.0 (O’Reilly, Ding, Yue) What is Web 2.0? A buzzword – difficult to understand because there’s no consensus on its meaning Generally refers to a new phase of Web business models and technologies An attempt to identify characteristics of Web businesses that survived the dot-com crash It is not a new standard for the World Wide Web 30 Web 2.0 (O’Reilly, Ding, Yue) Web 1.0 vs. Web 2.0 Web 1.0 Web 2.0 Britannica Online Publishing Personal websites Screen scraping Directories Netscape Wikipedia Participation Blogging Web services Folksonomies Google 31 Web 2.0 (O’Reilly, Ding, Yue) Some Web 2.0 Characteristics Web-centric Data intensive Open architecture for participation Social networking Lightweight software development Perpetual beta Business model takes advantage of the long tail 32 Web 2.0 (O’Reilly, Ding, Yue) Software Development Web 2.0 Style Microsoft – “old school” Traditional sales and licensing Heavy weight desktop software Long update cycle Tens of versions Millions of copies Backward compatible Value is in the software Google – Web 2.0 Services through the Web, no sales, no licensing Universal thin client (browser) In “perpetual beta” – will be improved incrementally over the course of time One version One copy; hidden massive server farms Open standards and public API 33 Value is the data Web 2.0 (Anderson, Wikipedia) The Long Tail and Web 2.0 Chris Anderson (2005) http://www.wired.com/wired/archive/12.10/tail_pr.html “The future of business is selling less of more” • • • “Make everything available” Keep prices as low as possible Help the buyers find what they want The Long Tail Amazon.com vs. Barnes and Noble Netflix vs. Blockbuster Strategy differences • • Popularity “Blockbuster” strategy is to sell a large number of very popular items “Long Tail” - Sell small quantities of obscure items to a large number of people Most popular Least popular Products are ranked by popularity on the horizontal axis 34 Web 2.0 (Elberse) Food for Thought about The Long Tail Anita Elberse, “Should You Invest in the Long Tail?”. Harvard Business Review, 2008. http://harvardbusinessonline.hbsp.harvard.edu/hbsp/hbr/articles/article.jsp?ml_action=getarticle&articleID=R0807H&ml_issueid=BR0807&ml_subscriber=true&pageNumber=1&_requestid=57934 Anita Elberse investigated actual sales patterns in the music and home video industries to test whether the Long Tail theory has a good potential for profit Her conclusions: • The Long Tail theory might work, but in limited cases • The blockbuster strategy is still the most reliable Web 2.0 (O’Reilly, Ding, Yue) Some Web 2.0 Technologies XML AJAX Web Services API Social networking Web syndication, e.g. RSS Folksonomies – collaborative tagging Ruby on Rails 36 Web 2.0 (O’Reilly, Ding, Yue) Some Web 2.0 Applications Flickr • • http://www.flickr.com Select “Explore” to see a “tag cloud”, an example of a folksonomy where the most popular tags are in a larger font size Google Docs • • Cloud computing – software is provided as an Internet service http://docs.google.com/Presentation?id=dg787rt7_337dpzzgbdd Del.icio.us • Storing, sharing, and discovering web bookmarks GMail MySpace.com Bit Torrent 37 Web 2.0 (McAllister) Food for Thought about Web 2.0 technologies Is the Web still the Web? Neil McAllister (June 3, 2008) http://weblog.infoworld.com/fatalexception/archives/2008/07/is_the_web_stil.html “Given the growing number of data types and file formats being transmitted over HTTP and the increasing complexity of the applications that make use of them, is today’s Web really still the Web? Or is it morphing into something else?” Tim Berners-Lee – the Web as information storage based on hypertext Web documents – text marked up with HTML; linked to other documents Today: • Rich client interface • Technologies like Ajax, Flash, MS Silverlight, Google Web Toolkit, cloud computing • Is it inappropriate to force these technologies to use the Web infrastructure? 38 References Chris Anderson (2005). “The Long Tail”. [Online]. Available: http://www.wired.com/wired/archive/12.10/tail_pr.html Berners-Lee, Tim. (1990). “WorldWideWeb: Proposal for a HyperText Project”. [Online]. Available: http://www.w3.org/Proposal Berners-Lee, Tim. “Tim Berners-Lee” (Homepage). [Online]. Available: http://www.w3.org/People/Berners-Lee Ding, Wei, “Introduction of Web Application Development” UHCL lecture slides, 2008. Dougherty, Dale and Richard Koman, The Mosaic Handbook for Microsoft Windows. Sebastopol, CA: O’Reilly and Associates, Inc.,1994. Howe, Walt. (2007). “A Brief History of the Internet”. [Online]. Available: http://www.walthowe.com/navnet/history.html Koch, Peter-Paul, PPK on JavaScript. New Riders, 2007. O'Reilly, Tim. (2005). “What Is Web 2.0". [Online]. Available: http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html. Tyson, Jeff. “How Internet Infrastructure Works”. [Online]. Available: http://computer.howstuffworks.com/internet-infrastructure.htm Siegal, David, Creating Killer Web Sites (Second Edition). Hayden, 1997. Yue, Kwok-Bun, “Web 2.0, Research and You”. Presentation at UHCL, 2006. 39