Networked Applications with JavaScript

Summary

This course covers server-side development from first principles. We build on your knowledge of HTTP and the request/response cycle to create a dynamic web application from scratch, before moving on to build more complex applications using a lightweight development framework.

In this course, we'll continue to use Node.js as our programming environment. However, here we'll introduce you to the popular web programming framework, Express.js, together with the Pug templating language, and a variety of additional tools that help make designing a web application easier.

Phase

Programming and Back-end Development

Detailed Syllabus

Introduction

  • What is a Networked Application?
  • Static Content vs Dynamic Content
  • A Brief History of Networked Applications
  • HTML Recap

Application Logic

  • Server-side Processing
  • A Simple Echo Server
  • Adding Logic
  • Sending Data to the Server
  • Loan Calculator: Basic Text Response
  • Loan Calculator: Adding Markup
  • Loan Calculator: Persisting State in the URL

Templates

  • What is Templating?
  • Limitations of Template Literals
  • Template Engines
  • Refactoring Loan Calculator

Routes

  • The Abstract Path
  • Refactoring Loan Calculator: Multiple Resources
  • Refactoring Loan Calculator: Static Assets
  • Refactoring Loan Calculator: HTTP Methods
  • Refactoring Loan Calculator: Request Handlers
  • Refactoring Loan Calculator: Using a Routing Engine

Frameworks and Libraries

  • HTML and CSS
  • Learning Express and Pug
  • Hello World
  • Static Assets
  • Multiple Pages
  • Logging
  • Pug Layouts
  • View Variables and Helpers
  • Loops
  • Parameterized Routes
  • Forms
  • Middleware
  • Basic Validation
  • Express-Validator
  • Sessions and Persistence
  • Flash Messages

Todo App

  • The Home Page
  • Display All Todo Lists
  • Sort the Todo Lists
  • Add a New Todo List
  • Validating New Todo Lists
  • Adding Flash Messaging
  • Validation and Sanitization
  • Display a Single Todo List
  • Editing Todos
  • Creating New Todos
  • Editing a Todo List
  • Session Persistence
  • Confirmation Dialogs