CS437/637 - Database-backed Websites and Web Services, Fall 2020

Welcome to CS437/637 Fall 2020

This class will cover database-backed websites and web services using SQL, PHP, and Javascript as the main programming languages. Our aim is to provide sites that can be accessed by desktop and mobile devices with the same website codebase. For this course, you need good programming skills and CS430/630 for SQL, or an equivalent introductory database course covering SQL, E-R diagrams, and client programming (in C, Java or PL/SQL). It is good to know basic HTML, including forms, but these topics will be covered quckly. There are plenty of tutorials for HTML on the Web.

Class meets MW 4:00-5:15pm online. Details coming by UMB email.

Note that I have sent out the Zoom info. If you haven't received it, please email me at elizabeth.oneil at umb.edu.

Please make sure you have a device with camera and microphone for attending classes, office hours, and exams, preferably the same system you also use for programming for this course.
Professor: Betty O'Neil (elizabeth.oneil at umb.edu)
Office Hours: MW 1:30-3:00, F 2-3pm by Zoom meeting 930 3005 8095, passcode in UMB email.

TA: JohnPaul Kambazza (jkamby at yahoo.com)

Prerequisites: CS310, CS430/630 (these are important), and officially, CS451/651 for CS637 only (less important, can be replaced by programming experience). Note that CS310 is an implicit requirement for all (applied) CS graduate courses. It means you need to know data structures, preferably implemented in Java (C++ is also OK), including use of Collection classes like HashMap. However, if you are solid on intermediate Java, as covered in cs210, that should be sufficient for this class.

Note that I also teach CS436/636 Database Application Development, usually in the spring. You may take both classes if you wish. Both classes use databases for holding persistent data and use HTML5 for web UI, so there is some overlap. But cs436/636 uses Java and Spring Boot. It's best to take cs637 before cs636, since it is easier. Here is a quick comparison of these classes.

Syllabus

Student Information sheet, with list of essential skills needed for this course

Texts:

Murach's PHP and MySQL (2nd or 3rd Edition) by Joel Murach and Ray Harris, Murach & Assoc, 2014, available for example at Amazon (older edition (less expensive), newer edition) or the bookstore. This book cover basic web technology (HTTP), running XAMPP for your own PHP web server, using the MySQL database. Follow the book link for free code.

HTML and CSS: Design and Build Websites by Jon Duckett, under $20 at Amazon. Book Examples

Learning Web App Development, by Semmy Purewal, 2014, O'Reilly, $6-30 at Amazon. Book code. Needed in second half of course.

Getting Ready:
Check out your development PC: A Windows 10 system with at least 4GB of memory works well with these tools. Alternatively, a Linux system or recent MacOSX system will work well. Setup directions are provided for Windows, Linux, and MacOSX, in the Appendixes of Murach's text. Also see "Access to cs.umb.edu systems" linked below under Resources.

First week: Apply for an account for cs637 (even if you are in cs437) as soon as possible, following the instructions listed in FAQ#02 on the departmental website.This will give you access to our Linux host pe07.cs.umb.edu, which has a MySQL installation and an Apache web server enabled for PHP. You can try out the book's examples even before you get an account: see the link below under Resources.

Slides, etc. Final versions are posted after class

Note that most slides (beyond the first week) are protected: username cs637, password supplied in class or by email

Wed., Sept. 9 slides (6pp) Intro: what is a web app, etc.
Mon., Sept. 14 slides (6pp) HTML, part 1: Duckett to Chap 7, Forms.
Wed., Sept. 16 slides (6pp) HTML part 2, CSS: Duckett to Chap. 13, CSS Boxes
Mon., Sep. 21 slides (6pp) HTML/CSS rest of Duckett, plus media queries
Wed., Sep. 23 slides (6pp) M&H Chapter 2: Intro to PHP
Mon., Sep. 28 finish Ch. 2, slides (6pp) Chapter 3: Intro to MySQL
Wed., Sep. 30 slides (6pp) Intro to Pizza Project slides (6pp) Chapter 4: Simple PHP/mysql apps
Mon., Oct. 5 Finish Chap. 4, slides(6pp) Chapter 5: MVC PHP apps
Wed., Oct. 7 Finish Chap. 5
Wed., Oct. 14 slides (6pp) Chap. 6: Debugging PHP. slides (6pp) Chap. 7 Forms
Mon., Oct. 19 Finish Chap. 7 numberguess.zip, slides (6pp) Chap. 8 Control Statements and type coercion
Wed., Oct. 21 slides (6pp) Chap. 9 PHP Strings, numbers, slides (6pp) Chap. 11 PHP Arrays (skip Ch. 10)  
Mon., Oct. 26 slides (6pp) Chap. 12 Session variables slides (6pp) Chap. 15 Functions
Wed., Oct. 28 slides (6pp) Chap. 14 Objects
Mon., Nov. 2 slides (6pp) Intro to Web Services
Wed., Nov. 4 slides (6pp) Midterm Review
Mon., Nov. 9 Midterm Exam  
Wed., Nov. 11 Holiday
Mon., Nov. 16 slides (6pp) Web Services using PHP's Slim component, testing with curl
Wed., Nov. 18 slides (6pp) Intro to Javascript
Mon., Nov. 23 slides (6pp) Purewal Chapter 4: JS for Interactivity
Wed., Nov. 25 no class (Thanksgiving eve).
Mon., Nov. 30 slides (6pp) Chap. 4 Amazeriffic example, slides (6pp) Running and debugging pizza2_jsclient
Wed., Dec. 2 slides (6pp) Chap. 5 Objects, using Web Services with JS slides (6pp) More On HTTP
Mon., Dec. 7 slides (6pp) More On JS slides (6pp) Advanced Web Services 
Wed., Dec. 9 slides (6pp) Secure websites and REST services (M&H Ch. 21) slides (6pp) Regex in PHP and JS (Ch. 15)
Mon., Dec. 14  slides (6pp) Final Review, Teacher Evaluations (see email to your umb.edu mailbox)

Wed., Dec. 16 3:00-6:00pm Final Exam (will be available here, to be submitted to Gradescope) 
Practice Final Exam  (Solution)


Assignments:

Homework 1 SQL Review, HTTP, HTML5 part 1, mysl, php, due Monday, Sept 21 on Gradescope Solution
Homework 2 HTML5, CSS, PHP Netbeans project, Smartphones, due Monday, Oct 5 on Gradescope Solution
Homework 3
Pizza Project, Page Flows, Comm Diagrams, more SQL, due Wed., Oct. 21 on Gradescope Solution

Project 1: doc assignment  pizza1_setup.zip (README) Pizza UI images 
Project 1 Solution: pizza1.zip deployed on pe07 (needs tunnel 8000->80 on pe07) 

Web Services Guitar Shop example: ch05_gs_client.zip (README) ch05_gs_server.zip (README)
Homework 4 pizza1, Session variables, Objects, intro Web Services (last homework) Solution

Project 2: assignment pizza2_phpclient.zip  pizza2_server_setup.zip pizza2_jsclient_setup.zip proj2_tests (zip)
Project 2 first delivery solution: pizza2_server.zip

Also see doc and zips for Purewal examples below
Project 2 First Delivery (10 points, like a homework) Due Monday midnight, Dec. 7, in your /var/www/html/cs637/username directory on pe07, in subdirectories pizza2_server, pizza2_phpclient, and pizza1. (everything except pizza2_jsclient).
Final Delivery (25 points)
Due Sunday midnight, Dec. 13, in your /var/www/html/cs637/username directory on pe07, in subdirectories pizza2_server, pizza2_phpclient, pizza2_jsclient, and pizza1.
Late Days: Remaining late days can be used, up to two days. Partners can combine remaining late days up to the max of two.

Resources

Gradescope info How to submit homework, etc.

Our Piazza Site for questions and answers. Please use a private question if you include a code snippet.  

Access to cs.umb.edu systems from offsite Logging in and transferring files, and setting up the needed tunnel to pe07's web server.

Development Setup Installing needed software.

The PHP book's webapps are deployed on pe07.cs.umb.edu and using the MySQL database on pe07.cs.umb.edu. Set up the tunnel to pe07's web server and see them at http://localhost:8000/book_apps.   

HTML5: Intro at www.w3schools.com latest spec forms tutorial tag reference, with HTML 4/5 info  HTML5 validator

CSS3: Intro at www.w3schools.com CSS2.2 property index. More on CSS: mozilla.org  css-tricks.com

HTTP : tutorial

Javascript is very important today, especially for apps that need to run on smartphones. We will cover Javascript starting in November. Buy the Purewal book (for as low as $6) as soon as possible.

MySQL We are using MariaDB (compatible with mysql 5.5, 5.6) bundled with XAMPP, and also version 5.6 on topcat.cs.umb.edu. docs (SQL)

PHP The version of PHP is important to note because PHP is still evolving, although not significantly between versions 5.5 and 5.6, and version 7 handles version 5.5 code properly in almost all cases. We are using version 7 bundled with XAMPP, and version 7 on our Linux host pe07.cs.umb.edu. Our second edition text uses version 5.5, and the third edition uses version 7.1 (see pg. 12 in either edition), but the actual code in the texts is almost all identical, i.e., following PHP 5.5. docs evolving spec

PHP parse/syntax errors; and how to solve them (useful page at StackOverflow)

PHP Internals: How Variables and References Work 

PHP Debugging Setup and Use Note that the directions on setting up XDebug in the Appendices of  the second edition of M&H apply only for older versions of XAMPP.

PHP Debugging Session: video 

REST Web Services Tutorial