Table of Contents

1.1 Web history
1.2 IP addresses, domain names, and URLs
1.3 HTTP
1.4 Web trends
1.5 Introduction to HTML
1.6 Introduction to CSS
1.7 Introduction to JavaScript
1.8 Full-stack development
1.9 Front-end tools

2.1 Web design essentials
2.2 Page structure and layout
2.3 Colors
2.4 Typography
2.5 Imagery

3.1 HTML document structure
3.2 HTML sandbox
3.3 Basic HTML elements
3.4 Comments
3.5 Images
3.6 Links
3.7 Lists
3.8 Tables
3.9 Special characters
3.10 Example: Band webpage

4.1 HTML containers
4.2 Forms
4.3 Common form widgets
4.4 Additional form widgets
4.5 Audio and video
4.6 < script > and < style >
4.7 HTML developer guidelines
4.8 Example: Restaurant Reviews

5.1 Using CSS in HTML
5.2 CSS sandbox
5.3 Basic selectors
5.4 Advanced selectors
5.5 Common properties
5.6 Font and text properties
5.7 Box model
5.8 Example: Styled band webpage

6.1 Flexbox
6.2 Grid layout
6.3 Positioning elements
6.4 Special effects
6.5 Animation
6.6 Styling forms
6.7 Sass
6.8 Example: Styled Restaurant Reviews

7.1 Syntax and variables
7.2 JavaScript sandbox
7.3 Arithmetic
6.4 Conditionals
7.5 More conditionals
7.6 Loops
7.7 Functions
7.8 Scope and the global object
7.9 Arrays
7.10 Objects
7.11 Maps
7.12 String object
7.13 Date object
7.14 Math object
7.15 Exception handling

8.1 Using JavaScript with HTML
8.2 JavaScript in the browser sandbox
8.3 Document Object Model (DOM)
8.4 More DOM modification
8.5 Event-driven programming
8.6 Timers
8.7 Modifying CSS with JavaScript
8.8 Form validation
8.9 JavaScript Object Notation (JSON)
8.10 XMLHttpRequest (Ajax)
8.11 Using third-party web APIs (JavaScript)
8.12 Browser differences: JavaScript
8.13 Example: Lights Out game
8.14 Example: Weather Comparison (XMLHttpRequest)

9.1 Regular expressions
9.2 Classes
9.3 Classes (ES6)
9.4 Classes (ES13)
9.5 Inner functions, outer functions, and function scope
9.6 Closures
9.7 Modules
9.8 Strict mode
9.9 Web storage
9.10 Canvas drawing
9.11 Canvas transformations and animation
9.12 WebSockets
9.13 Promises
9.14 async and await
9.15 Fetch API
9.16 Example: Lights Out game with canvas
9.17 Example: Weather Comparison (fetch)

10.1 Mobile websites and browsers
10.2 Mobile development tools
10.3 Viewport
10.4 Media queries
10.5 Responsive images
10.6 Bootstrap
10.7 Example: Responsive band webpage

11.1 Introduction to accessibility
11.2 Accessibility tools
11.3 Page structure
11.4 WAI-ARIA
11.5 Colors
11.6 Images (a11y)
11.7 Links (a11y)
11.8 Text
11.9 Forms (a11y)

12.1 Getting started with Node.js
12.2 Node packages
12.3 Express
12.4 Express request data
12.5 Embedded JavaScript
12.6 Pug

13.1 Relational databases and SQL (Node)
13.2 MySQL
13.3 MySQL2
13.4 MongoDB
13.5 Mongoose
13.6 VS Code
13.7 RESTful web APIs: Part 1 (Node)
13.8 RESTful web APIs: Part 2 (Node)
13.9 Using RESTful web APIs with Fetch
13.10 Third-party web APIs (Node)
13.11 Token-based user authentication (Node)
13.12 Password hashing (Node)

14.1 Getting started with React
14.2 React sandbox
14.3 JSX
14.4 Components
14.5 Event handling
14.6 State
14.7 Conditional rendering
14.8 Lists (React)
14.9 Forms (React)
14.10 Example: Todo List
14.11 Router
14.12 Styling
14.13 React Bootstrap
14.14 Fetching data
14.15 Example: Message Board back-end
14.16 Example: Message Board front-end (Part 1)
14.17 Example: Message Board front-end (Part 2)

15.1 Getting started with PHP
15.2 PHP sandbox
15.3 Arithmetic and comparisons (PHP)
15.4 Conditionals (PHP)
15.5 Loops (PHP)
15.6 Arrays (PHP)
15.7 Functions (PHP)
15.8 Includes (PHP)
15.9 Classes and objects (PHP)
15.10 String, date/time, and math functions (PHP)
15.11 Submitting forms (PHP)
15.12 Form validation and sanitation (PHP)

16.1 Regular expressions (PHP)
16.2 Error handling (PHP)
16.3 File handling (PHP)
16.4 Uploading files (PHP)
16.5 Cookies and sessions (PHP)
16.6 Relational databases and SQL (PHP)
16.7 MySQL (PHP)
16.8 MySQLi (PHP)
16.9 PHP Data Objects (PHP)
16.10 User authentication principles (PHP)
16.11 Implementing user authentication (PHP)
16.12 Using third-party web APIs (PHP)

17.1 Relational databases
17.2 Structured Query Language (SQL)
17.3 SQL sandbox
17.4 Creating, altering, and deleting tables
17.5 Inserting rows
17.6 Selecting rows
17.7 SQL functions
17.8 Joining tables
17.9 Updating and deleting rows

18.1 Getting started with jQuery
18.2 Selectors (jQuery)
18.3 Events (jQuery)
18.4 Styles and animation (jQuery)
18.5 DOM manipulation (jQuery)
18.6 Ajax (jQuery)
18.7 Using third-party web APIs (jQuery)
18.8 Using RESTful web APIs with jQuery
18.9 Plugins (jQuery)
18.10 Example: Weather Comparison (jQuery)
18.11 MySQL module (Node)

Tips for Teaching your Web Programming Course

Web programming is one of my favorite courses to teach. Having taught web programming to computer science (CS) undergraduates for more than 20 years, I have suggestions for instructors who are new to teaching web programming or wondering what to teach in their web courses.

Teach full-stack development with this fully interactive introduction to key web programming concepts

Web Programming introduces full-stack development of web applications using the latest web standards.

  • Covers client-side technologies such as HTML, CSS, JavaScript, React, and server-side technologies, including Node.js, PHP, relational and NoSQL databases
  • Provides interactive HTML, CSS, and JavaScript practice problems with built-in auto-grading that run right in the zyBook, giving students instant feedback and saving instructors time
  • Provides the ability to run Node, React, and PHP code directly within the zyBook
  • Includes a zyLab IDE that simplifies how students write and submit their lab solutions
  • Adopters have access to a test bank with more than 500 multiple-choice questions

Lead author Professor Frank McCown demonstrates the zyLabs interface:

What is a zyBook?


Web Programming is an interactive learning solution that helps students visualize concepts, enabling them to learn more effectively than with a traditional textbook. Check out our research.

zyBooks benefits students and instructors:

  • Instructor benefits
  • Customize your course by reorganizing existing content or adding your own
  • Continuous publication model updates your course with the latest content and technologies
  • Robust reporting gives you insight into students’ progress, reading and participation
  • Save time with auto-graded labs and challenge activities that seamlessly integrate with your LMS gradebook
  • Student benefits
  • Learning questions and other content serve as an interactive form of reading
  • Instant feedback on labs and homework
  • Concepts come to life through extensive animations embedded into the interactive content
  • Save chapters as PDFs to reference the material at any time

See the React tools:

Author

Frank McCown, PhD

Professor of Computer Science, Harding University

Instructors: Interested in evaluating this zyBook for your class?

Check out these related zyBooks