Fall 2016
Lectures
Example Codes from the Text Book
Fundamentals of Web Development, by Randy Connolly
and Ricardo Hoar, Publisher: Pearson
Student Resources - Companion Web
Site of the Text Book Fundamentals of Web Development,
http://wps.pearsoned.com/ecs_connollyhoar_cwwebdev_1/
Week No |
Topics/Activities
|
|
1 |
8/23 * Overview of the course, course syllabus *Lecture Note # 1 - Overview of the course, Discussion of Systms, Web systems, and other related topics ** Lecture Note 1 Web Systems Infrastructure and Protocols ** 4th IEEE Workshop on the Hot Topics in Web Systems and Technologies, HotWeb 2016 Oct. 24-25 8/25 ** Lecture Note 1 Web Systems Infrastructure and Protocols (continue) ** Ch 1. How the Web Works, PPT slide |
|
2 |
8/30 Technology Forum: Internet & Web ** In-Flight Internet and WiFi Services ** Web Site Magazine, http://www.websitemagazine.com/content/ *** 11 Rules to Deliver Product Content that Sells *** Winning a Distributed Commerce: A Guide for Brands ** Web Architecture, http://www.w3.org/standards/webarch/ ** Internet Engineering Task Force (IETF), https://www.ietf.org/ ** Ch 1. How the Web Works, PPT slide (continue) 9/1 ** Ch 1. How the Web Works, PPT slide (TCP/IP continue) 1) TCP (Transmission Control Protocol) vs UDP (User Datagram Protocol): Multicasting *** Streaming Video and Live video, http://stackoverflow.com/questions/6187456/tcp-vs-udp-on-video-stream *** Why odes NetFlix use TCP and not UDP for Its Streaming Video, https://www.quora.com/Why-does-Netflix-use-TCP-and-not-UDP-for-its-streaming-video *** Reliable UDP (RUDP), 1999, https://tools.ietf.org/html/draft-ietf-sigtran-reliable-udp-00 2) Client-Server Model, Server, Server Racks, Server Farms, Data Centers 3) Commercial Web Hosting 4) Cloud and Cloud Services: Public cloud, private cloud, hybrid cloud 5) From the computer to the Local ISP, Regional and National Network, Internet Exchange Points, Over Seas: Routers, Routing Tables, Fiber Optics Cables *** Policy Brief : Internet Exchange, Internet Society, Oct. 30, 2015, http://www.internetsociety.org/policybriefs/ixps?gclid=CPPY3bPb7s4CFUUcaQod6HYEFQ *** Internet Exchange Map, TeleGeography, http://www.internetexchangemap.com/ *** Internet Exchange Points (within Data Center), http://www.datacentermap.com/ixps.html 6) Domain Name Services: Address Resolution, Levels, Top-Level Domains, Name Registration and Process 7) Unoform Resource Locator (URL), Uniform Resource Identifier (URI), and Unified Resource Name (URN), Query String *** RFC 1738 Uniform Resource Locator, 1994, https://www.ietf.org/rfc/rfc1738.txt *** RFC2141 - URN Syntax, 1997, https://www.ietf.org/rfc/rfc2141.txt *** RFC 3986 - URI General Syntax, https://www.ietf.org/rfc/rfc3986.txt 8) HTTP & HTTPS Protocls: HTTP Request Methods (Get vs. Post), Browser Tools 9) Web servers and Web stack: OS, Web server software, Database, Scripting languages: LAMP (Linix, Apache, MySQL, PHP/Perl), WISA (Window OS, SQL Server database, ASP.NET server-side development techniques) |
| 3 | 9/6 *** Lecture note 2 on HTML and XHTML, Web Browsers and Web Servers, 2016/9/6 *** Ch .3 Hypertext Markup Language Basics, of the e-book Building Web Applications with HTML, by Paul Lin, Feb. 7, 2012 9/8 *** Ch. 2 Introduction to HTML, Code Examples *** Lecture on Networking, Cloud, Web Hosting Services, Lecture note: PDF file, HTML file *** Website Magazine, Sept. 16, 2016 **** Holiday Email Metrics to Track Now, Mobile's Role in Tomorrow'a Customer Journey, Theories of Pursuasive Product Pages, Association Management Software in Focus, News Feed Optimization Strategies, Quality vs. Quantity in Website Testing |
| 4 |
9/13 ** Ch. 2 Intro to HTML, ppt slide 9/15 ** Web Master Knowledge and Skill, note ** Apache Web Server Configuration and Trouble Shooting, note ** Ch 3. Casecading Style Sheet, ppt slide References: *** What is CSS, http://www.w3.org/Style/CSS/Overview.en.html *** HTML & CSS, http://www.w3.org/standards/webdesign/htmlcss *** CSS Validation Service, http://www.css-validator.org/ |
| 5 |
9/20 ** Ch 3. Casecading Style Sheet, ppt slide (continue) Listing3.1.html Listing3.2.html Listing3.3.html Listing3.4.css Listing3.5.html Listing3.6.html Listing3.7.html Listing3.8.html ** Ch. 4. HTML Tables and Forms ** Prof. Lin's Lecture Note *** Creating a Slide Show using <meta> element, Example 4-1, http://www.etcs.ipfw.edu/~lin/CECourses/2_HTML/Lectures/4_HTML_IntM.html 9/22 ** Ch. 4. HTML Tables and Forms *** Creating Forms, http://www.etcs.ipfw.edu/~lin/CECourses/2_HTML/Lectures/5_HTMLForm.html **** User Feedback Form Example, http://www.etcs.ipfw.edu/~lin/CECourses/2_HTML/05FormsEx/form1.html Listing4.1.html - pag 175 Listing4.2.html - page 177 Table Examples: Lab04-ex01; Lab04-ex02; Lab04-ex03; Lab04-ex04; Lab04-ex05; Lab04-ex06 Form Examples: Lab04-ex07; Lab04-ex08; Lab04-ex-09; Lab04-ex10; Lab04-ex11; Lab04-ex12; Lab04-ex13 ** HTML 5 Audio & Video, Lecture note |
| 6 |
9/27 HTML Forms Standards: ** HTML 5 - 4.10 Forms, http://www.w3.org/TR/html5/forms.html ** HTTP/1.1 RFC 7230- Message Syntax and Routing; June 2014, http://tools.ietf.org/html/ ** HTTP/1.1 RFC 7237 Method Registration; June 2014, http://tools.ietf.org/html/ PHP Serverside Script Example (plus demos captured through Echo360): web page hit counter JavaScript: Client-Side Scripting ** Introduction, Syntax, Keywords, Variables ** Operators: (arithmetic, equality and relational: comparison, logical, conditional); ** Decision Making statement: if, else; conditional operator; ** Multiple Decision Making Statement: switch, case, break, continue ** Loops or repitition statement: while, for, do while ** Functions and program modules: built-in, programmer/user defined ** Objects (constructors, Properties, methods): *** Array object: one-dimensional and multidimentisoanl arrays- push(), concat(), slice(), join(), reverse(), shift(), sor() ** Error handling using "Try" and "Catch" ** Events An Javascript Application: Color Coded Resistor Calculator Page 9/29 JavaScript Objects: *** new, Array(), Math, String() *** Window object: browser itself, page's URL, history, status bar, opening new browser windows, **** Methods: alert(), document.write() The Document Obect Model (DOM): *** Document root,; Nodes: <html>, <head>, <body>; ***** Element Node <p>, Text node ***** Element Node <a>: Attribute node (URL) and Text node *** Methods: CreateAttribute(), CreateElement(), CreateTextNode(), getElementById(id), getElementByTagName(name) *** DOM Event Objects: **** Mouse Eevnts: onclick, ondblclick, onmousedown, onmouseover, onmouseout, onmousemove **** Keyboard Events: onkeydown, onkeypress, onkeyup **** Form Events: onblur, onchange, onfocus, onreset, onselect, onsubmit **** Frame Events: onabort, onerror, onload, onresize, onscroll, onunload Figure 6.16: push() example *** Math object- Properties: Math.PI, Math.E, Math.LN2, Math.LN10, Math.LOG2E, Math.LOG10E, Math.SQRT2, Math.SQRT1_2 ******* Math methods: abs(x), ceil(x), floor(x), log(x), max(x,y), min(x,y), pow(x,y), sqrt(x), exp(x), round(x), sqrt(),random(); t=Trigonometric functions: sin(x), cos(x), tan(x), acttan(x) **** Listing 6.7: some Math constants: PI, sqrt(4), random() *** String object: chartAt(index), charCodeAt(index), concat(string), fromChardCode(), lastIndexOf(), replace(), slice(), split(), substr(), substring(), toLowerCase(), toUpperCase() ** Chapter 6 Code Examples, http://www.etcs.ipfw.edu/~lin/CPET499-ITC250/Book-FundamentalWebDev/book-exs-fundawebdep-F2015.html ** Developing Advanced Web Applications using JavaScript, an E-Book, by Paul Lin, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/JavaScriptBookIndex.html *** Ch 1. JavaScript Basics, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/01_JavaScriptBasics.html *** Ch 3. JavaScript Keywords, Variables, and Operators, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/03_KeywordsVars.html *** Ch 4. JavaScript User Defined Functions, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/04_JsUserFunctions.html *** Ch 5. The Document and Window Objects, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/05_JsDocsWindows.html *** Ch 6. JavaScript Forms and Events, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/06_JsFormsEvents.html *** Ch 7. Dynamic Pages with Date and Time, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/07_JsDateTimeObjs.html *** Ch 9. Using JavaScript Arrays, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/09_JsArrays.html References: ** JavaScript Web APIs, http://www.w3.org/standards/webdesign/script.html ** Standard ECMA-262, ECMAScript 2016 Language Specification, 7th edition 2016, http://www.ecma-international.org/publications/standards/Ecma-262.htm ** JavaScript Language Reference, https://msdn.microsoft.com/library/d1et7k7c(v=vs.94).aspx ** jQuery, https://jquery.com/ |
| 7 |
10/4 ** Chapter 6 Code Examples, http://www.etcs.ipfw.edu/~lin/CPET499-ITC250/Book-FundamentalWebDev/book-exs-fundawebdep-F2015.html *** Lab06-project01.html, Lab06-project02.html, Lab06-project03.html Developing Advanced Web Applications using JavaScript, an E-Book, by Paul Lin, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/JavaScriptBookIndex.html *** Ch 4. JavaScript User Defined Functions, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/04_JsUserFunctions.html *** Ch 5. The Document and Window Objects, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/05_JsDocsWindows.html 10/6 Developing Advanced Web Applications using JavaScript, an E-Book, by Paul Lin, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/JavaScriptBookIndex.html *** Ch 6. JavaScript Forms and Events, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/06_JsFormsEvents.html *** Ch 7. Dynamic Pages with Date and Time, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/07_JsDateTimeObjs.html *** Ch 9. Using JavaScript Arrays, http://www.etcs.ipfw.edu/~lin/Presentation/JavaScript/09_JsArrays.html **** An Color Array App: http://www.etcs.ipfw.edu/~lin/Web499/JsExamples/resistor/resistor.htm |
| 8 |
10/11 (Fall Break) 10/13 * Chapter 8 Introduction to Server-Side Development with PHP, pages 322-342; PPT slide * Ch. 8 PHP Code Listing, http://www.etcs.ipfw.edu/~lin/CPET499-ITC250/Book-FundamentalWebDev/book-exs-fundawebdep-F2015.html * Introduction to PHP (1 of 3), Lecture Note |
| 9 |
10/18 * Introduction to PHP (1 of 3), Lecture Note (continue) * PHP Examples: mathoperators.php, mathoperators.txt; if-else.php, if-else.txt; PHPbrowser-IP-Info.php, PHPbrowser-IP-Info.txt; funct_arguments.php, funct_arguments.txt. 10/20 * Topics on Web Server and Application Server Integration, Lecture Note *** Web server and Application Server Integration: Web server (HTTP/HTTPs), Proxy servers, Network servers, Application Servers, Database server, Content management server, Ecommerce server, Mail servers, File servers, Print servers, etc *** Web services, enterprise data and application integration, *** CGI (Common Gateway Interface) **** * CGI Environmental Variables *****CGI scripts (C/C++, Per, PHP, Python,..) :query database, porform calculations, solicit and interpret user supplied data, retrieve requested info, produce customized content, etc * Introduction to PHP (2 of 3), Lecture Note * Introduction to PHP (3 of 3), Lecture Note |
| 10 |
10/25 ** Exam 2 is scheduled: 5 PM, Thursday 10/27 to 5 PM, Friday, Friday 10/28 ** NotepadC++ editor: FYI, https://notepad-plus-plus.org/ * Ch 8 Intro to Server-Site Dev with PHP, Examples: Listing8.8.php to Listing8.19.php * Ch 9 PHP Arrays and Supergobals, Examples: Listing9.01.php to Listing9.11.php 10/27 ** Quick Review of Exam 2 - Ch 6. JavaScript ** Final Project Proposal, due Nov. 8 (individual or 2 person team) * Ch 9 PHP Arrays and Supergobals: *** Handling the File Upload, pp. 386-391 * $FILE array in PHP script: HTML <input type="file">; <form enctype='multipart/form-data' method='post', action='processFile.php'> ***** Example listing9.12.php *** Examples: Listing9.12.php to Listing9.20.php *** Moving the File, pp. 391-392 *** Reading/Writing Files, pp. 392-395 |
| 11 |
Nov. 1 * Ch 11. Working with Databases, Lecture: part 1 of 3, PPT slide * Managing MySQL Database, Lecture part 2 of 3: SQL statement syntax, Examples, phpMyAdmin password, MySQL root password Nov. 3. * Ch 11. Working with Databases, Lecture: part 1 of 3, PPT slide (continue) * Managing MySQL Database, Lecture part 3 of 3: More Coomand-Line Interface, phpMyAdmin: Importing & Exporting Databases, Accessing MySQL using PHP Scripts ** More Commenad-Line * Hw 7 Assignment: Working with Database, Lab procedure |
| 12 |
Nov. 8 (Lecture 22) * Ch 11, Managing MySQL Database, Lecture Note ** PHP Coding Examples (Porcedural vs. Object-Oriented) *** Connecting to a MySQL DB *** Handling Connection Errors/Exceptions *** Executing Query: Returning Result Set, No Result Set, Prepare Statement *** Integrating User Form Data, Sanitizing User Data *** Processing the Query Results: Looping through the Result Set, Fetching into an Object *** Freeing Resources and Closing Connection *** Using database Transactions Nov. 10 - Review & Discussion: Final Project Proposals * IT Consulting - Service Sales, by Trenton Lemon and Santos Covarrubias (Team 1) * Mobile Mann Tech, by Brendan Mann and Keegan Nodine (Team 2) * A SmartHome, by Cole Buzzard and Brett Carusillo (Team 3) * Sirean Store Site, by Allyson Barton * A Commercial Website, Jacob Lee * Smarty Pints, by Derek Hamilton * Web Design Help Blog, by Andy Kaufman * Oh So Flye Games, by Colby Flye * Technology Job Search Website, by Taz Silvia * FWDetailGararge.com, by Evan Tempel and Chris Leinhos Nov. 10 Advanced Topics, Lecture Note Enterprise Information System Modeling & Design * Enterprise Information Service – Operation Environment * Enterprise Integration: Web Server System * Web-based Databases * Mobile Sales Automation System * Data Conversion Workflow Data Analysis, Modeling and Design (Web-based System) * Data Input, Process, Store & Display: Forms, Reports, Screen of data * Data Modeling Workflow * Logical Data Structure: Graphical Data Model * Schemas * Physical Data Storage * Business Data Processing * Users * Documentation Database Design, Development, Administration and Migration |
| 13 |
Nov. 15 ** Reminder: Exam 3: from 5 pm, Nov. 17 to 5 pm Nov. 18, covering Ch. 8 Intro to Server-Side Development with PHP, and Ch 9 PHP Arrays and Superglobals. ** Hw 7 due date extended to Nov. 29 (A) Hw 8 Final Project: Progress Report (B) Final Project Guidelines and Due Date * Dec. 13 - Final Project Report and PPT Slide * Dec. 15 - All Project Codes in one zipped file * Dec. 15 (Thursday), 10:30 am to 12:30 pm, final project presentations and demos, room ET 346 (C) Discussion: Hw 7 Hands-On Lab with MySQL and PHP Under XAMPP Server (D) Ch 12. Error Handling and Validation (No lecture note; use textbook and document projecter) ** Errors and Exceptions, PHP Error Reporting, PHP Error and Exception Handling ** Regular Expressions, Validating User Input, Where to Perfom Validation Nov. 17 -- No Class due to ECHO 360 computer is unreachable, IP address changed) Exam 3: changed from 9 pm, Nov. 17 to 9 pm Nov. 18, (Time changed due to ITS plans to make major upgrade duing 6 PM to 9 PM, Nov. 17, Thursday) overing Ch. 8 Intro to Server-Side Development with PHP, and Ch 9 PHP Arrays and Superglobals. |
| 14 |
Nov. 22 ** Ch. 13. Managing States, PPT slide ** Read Ch 14 Web Application Design Nov. 24 - Thanksgiving Holiday |
| 15 |
Nov. 29 ** Ch. 13. Managing States, PPT slide (continue) ** Ch. 14 Web Application Design, PPT slide Dec. 1 ** Final Project Presentation & Demo Schedule (10 minutes per team/project, starting on Thursday, Dec. 15, from 10:30 AM to 12:30 PM): (A) PPT slide Presentation (B) plus your Labtop for making demo ** Suggested Format of your PPT presentation ** Final Project Report Guidelines ** Ch. 14 Web Application Design, PPT slide (continue) ** Ch. 16 Security, PPT slide |
| 16 |
Dec. 6 Ch. 15 Advanced JavaScript and jQuery Ch 17. XML Processing and Web Services Dec. 8 ** Final Project Prepartion Time (NO Class) |
| 17 |
Dec. 13 & Dec. 15 * Dec. 13 - Final Project Report and PPT Slide * Dec. 15 - All Project Codes in one zipped file * Dec. 15 (Thursday), 10:30 am to 12:30 pm, final project presentations and demos, room ET 346 |