Web technology course information
CSE1500 is the Web and Database Technology course, that first-year students of the Bachelor Computer Science and Engineering take at TU Delft.
The responsible instructor of the web technology part is Associate Prof. Claudia Hauff. Inquiries about the course content, exams and so on should be emailed to
cse1500-ewi["at"]tudelft.nl; this email reaches all responsible course instructors.
This website contains all materials of the course’s web technology part. With a modern browser, you can use highlighting and note-taking in the browser. All data is stored in your browser’s localStorage: this means that no data (highlights/notes) leaves your machine. Be aware though that all this data is deleted when you clear your browser’s storage.
In the five weeks of the web technology lectures we can only cover the web programming fundamentals and thus chose a small application stack. If you want to get a comprehensive overview of the set of languages, technologies and frameworks a frontend or backend web engineer should be familiar with, take a look at the web developer roadmap - 2020.
Table of contents
- Web technology topics
- Web technology assignments
- Web development resources
- Lecture material types
- University courses with a web focus elsewhere
- Courses elsewhere
The book we recommend is Web Development with Node and Express, 2nd Edition.
It is not required though—we do not come close to covering the majority of the book’s content. To give you an idea, the book contains 22 content chapters and we include nine of them in our recommended readings list.
The book shows where and how Node.js/Express (two key frameworks we introduce in this course) can be employed in production settings. It goes well beyond what you need to know for this class and includes chapters on code maintenance, quality assurance and how to deploy an application in production. The book already assumes familiarity with basic web programming.
Visual Studio Code (VSC) is our recommended development environment for the assignments. It is a free and open-source Integrated Development Environment (IDE). It is also the most popular IDE for developers today.
- Bracket Pair Colorizer does what the name suggests.
- Material Icon Theme to make finding the file you are after in your app directory a bit easier.
- If you like to add TODOs to your code, try Todo Tree, it makes sure you do not overlook any of your TODOs!
- Finally, install a good theme for your IDE to make coding more enjoyable. Dracula is a popular one. Cobalt2 is also nice. If you want to pick based on visuals, head to https://vscodethemes.com/.
If you are new to team programming, and want to use VSC’s features efficiently, read our VSC guide.
Browser developer tools are integrated in all modern browsers; familiarize yourself with the developer tools of your favorite browser. In our transcripts, we showcase Firefox’s and from time to Chrome’s developer tools.
The latest stable version of Node.js.
Two modern web browsers such as Chrome, Firefox, Edge, etc. to test your project code across browser implementations.
Telnet (for your first web technology assignment).
OpenSSL (for your first web technology assignment).
Web technology topics
The web technology topics we cover are the following:
- HTML and web design
- Node.js (advanced)
- Cookies and sessions
- Web security
Web technology assignments
There are three web technology assignments, each one covering the contents of two to three lectures:
- The first web technology assignment covers HTTP and web design.
The three assignments build on each other—over the course of them you are tasked with implementing a multi-player board game. FYI, in previous years, roughly 90% of teams passed the first web assignment, 60% passed the first two and 30% of teams passed all three web assignments.
In order to help you get started, we have created a demo game application. If you get stuck, take a look at the demo application, it may help you.
Web development resources
If you want to hear the latest and greatest about the web stack, Twitter is a good source of information. Here is a list of useful Twitter accounts to follow:
- Franziska Hinkelmann works on Node.js at Google.
- Lea Verou tweets about all things CSS and the wider web UI world.
- Lin Clark makes (among others) technical challenges accessible to the wider public.
- Wes Bos is the author of popular web stack tutorials.
- Mozilla Hacks is Mozilla’s account for web developers.
- Visual Studio Code.
- Chrome DevTools offers tips and tricks of the dev tool trade for Chrome.
- Firefox DevTools offers the same as Chrome DevTools but this time for Firefox.
- Syntax offers podcasts for web developers, hosted by Wes Bos and Scott Tolinski.
Lecture material types
For each lecture we provide the following:
- Required readings: to be read before the respective lecture. These are typically introductions to the different languages we cover. The lecture materials go beyond the contents of the required readings.
- Recommended activities: activities that we think may help you get a better grasp of the different web technologies. Activities are either programming exercises or podcasts.
- Recommended readings: these may be tweets, blog posts or book chapters that may help you understand some of the introduced concepts better.
- Relevant scientific publications: to showcase how web technologies are researched, we offer examples of scientific publications that contribute to our understanding and use of web technologies.
University courses with a web focus elsewhere
Naturally, what we present here is only one way of introducing the fundamentals of the web to undergraduate students. A number of other universities also offer publicly accessible teaching materials:
- Deep Dive Into Modern Web Development /U Helsinki
- Design and Implementation of Software for the Web /GMU
- Web Applications /Stanford
- Web Security /Stanford
- Creating Modern Web Applications /Brown
- Web Security /NUS
- Programming Languages for Web Applications /Virginia
- Web Development /MIT
- Cutting-edge Web Technologies /Berkeley (2015)
- Web Programming /U Washington
- Web and Mobile Systems /U Virginia