Offered: Fall 2019, Fall 2021, Spring 2025, Fall 2025

Aims and Objectives

The main objective of this course is to learn latest technologies used in today’s web application development. After successfully completing the course, the student should be able to develop and deploy modern web applications. The course will start with the basics concepts of HTML, CSS, and JavaScript and later on move to advnaced technologies like Node.js, express and react.

Weekly Contents

1. Introduction to internet, WWW, and web development
2. How the web works? Networking layers and protocols; Domain Name System (DNS); Uniform Resource Locator (URL); parts of URL; HTTP protocol;
3. CSS: rules, color values (RGB, hexa, RGBA, HSL, HSLA), measurement values (relative, absolute, pixels, em, rem, percent, in, cm), location (inline, embedded, external), CSS Selectors (element, class, id, attribute, pseudo elements, pseudo classes), contextual selectors (descendent, child, adjacent, general)
4. CSS: Cascading, inheritance, specificity, location, box model, block elements, inline elements, background, gradients, borders
5. CSS: Margins and Padding, Collapsing Margins, box-sizing, content-box, border-box, text overflow, text styling (fonts, paragraphs), CSS Frameworks, CSS Variables
6. CSS: floats; positioning (static, absolute, relative, fixed, sticky)
7. CSS: Layout using flexbox (flex-direction, flex-wrap, justify-content, align-items, flex-basis, flex-grow, flex-shrink, align-self)
8. CSS: Layout using grid (grid-template-columns, grid-template-rows, repeat, auto-fill, auto-fit, grid-column, grid-row, align-self, justify-self, align-items, justify-items, grid-template-areas, grid-area); Responsive design: viewport, media queries (screen, max-width, min-width)
9. Javascript: Introduction to JavaScript: Client-Side Scripting, JavaScript’s History, JavaScript and Web 2.0, JavaScript in Contemporary Software Development; Javascript placing: Inline JavaScript,Embedded JavaScript,External JavaScript,Users without JavaScript
10. Javascript: Variables and Data Types: JavaScript Output, Data Types, Built-In Objects, Concatenation, Conditionals, Truthy and Falsy; Loops: , While and do . . . while Loops, For Loops, Arrays, Iterating an array using for … of, Array Destructuring, Spread Operator, Rest Operator
11. Javascript: Objects: Object Creation Using Object Literal Notation, Object Creation Using Object Constructor, Object Destructuring, JSON; Functions: Function Declarations vs. Function Expressions, Nested Functions, Hoisting in JavaScript, Callback Functions, Objects and Functions Together, Function Constructors, Arrow Syntax; Scope and Closures in JavaScript, Scope in JavaScript, Closures in JavaScript
12. Javascript: The Document Object Model (DOM): Nodes and NodeLists, Document Object, Selection Methods, Element Node Object; Modifying the DOM: Changing an Element’s Style, InnerHTML vs textContent vs DOM Manipulation, DOM Manipulation Methods
13. Javascript: DOM Timing: Events, Implementing an Event Handler, Page Loading and the DOM, Event Object, Event Propagation, Event Delegation, Using the Dataset Property, 9.4 Event Types, Mouse Events, Keyboard Events, Form Events, Media Events, Frame Events; Forms in JavaScript: Responding to Form Movement Events, Responding to Form Changes Events, Validating a Submitted Form, Submitting Forms; Regular Expressions: Regular Expression Syntax, Examples
14. JavaScript: Array Functions: forEach, Find, Filter, Map, and Reduce, Sort; Prototypes, Classes, and Modules: Using Prototypes, Classes, Modules;
15. Javascript: Asynchronous Coding with JavaScript: Fetching Data from a Web API, Promises, Async and Await; Using Browser APIs:, Web Storage API, Web Speech API, GeoLocation, Using External APIs, Open Maps, Charting with Plotly.js
16. Server-Side Development using Node.js: Introducing Node.js, Node Advantages, Node Disadvantages; First Steps with Node: Simple Node Application, Adding Express, Environment Variables; Creating an API in Node: Simple API, Adding Routes, Separating Functionality into Modules; Creating a CRUD API: Passing Data to an API, API Testing Tools; Serverless Approaches: What Is Serverless? Benefits of Serverless Computing, Serverless Technologies
17. Working with Databases: Databases and Web Development, The Role of Databases in Web Development; MongoDB Tools; NoSQL Databases: Why (and Why Not) Choose NoSQL? Types of NoSQL Systems; Working with MongoDB in Node: MongoDB Features, MongoDB Data Model, Working with the MongoDB Shell, Accessing MongoDB Data in Node.js;
18. Managing State: The Problem of State in Web Applications; Passing Information in HTTP, Passing Information via the URL, Passing Information via HTTP Header; Cookies: How Do Cookies Work? Using Cookies in Node and Express, Persistent Cookie Best Practices; Session State: How Does Session State Work? Session Storage and Configuration, Session State in Node, Caching, Page Output Caching, Application Data Caching, Redis as Caching Service
19. Deoployment: DevOps, Domain Name Administration, Web Server Hosting Options, Virtualization, Request and Response management

Textbook(s)

1. Fundamentals of Web Development, 3rd ed., by Randy Connolly and Ricardo Hoar, Pearson, 2022