This repository contains all the material used in the PG6301 course on Web Development and API Design, taught at the university college Høyskolen Kristiania, Oslo, Norway.
The goal of this course is to teach the principles of Single-Page-Applications (SPA), the basics of web services (e.g., REST APIs) and web-sockets.
The programming language used in this course is JavaScript, with NodeJS as runtime. Some of the used technologies are: YARN, WebPack, Babel, React, React-Router, Jest, Express, and Passport.
This course puts particular emphasis on testing and security, but not on frontend design (i.e., UI/UX).
This course focuses on the frontend side of web development, albeit we will build full-stack applications (but no databases). To learn more about backend development (e.g., using Java/Kotlin), you can see this other repository: Testing, Security and Development of Enterprise Systems.
The course is divided in 12 lessons, each one lasting between 2 and 4 hours. Each lesson contains slides and full working code examples. Slides just give high level overviews: most of the explanations will be directly in the code as comments.
-
Lesson 01: Intro to JavaScript and basic HTML/CSS
Code in the les01 folder. Slides here: PDF
Exercise: quiz-game-part-01
-
Lesson 02: Build Tools and Unit Testing
Code in the les02 folder. Slides here: PDF
Exercises: quiz-game-part-02
-
Lesson 03: SPA Components
Code in the les03 folder. Slides here: PDF
Exercises: quiz-game-part-03
-
Lesson 04: SPA State Handling
Code in the les04 folder. Slides here: PDF
Exercises: quiz-game-part-04
-
Lesson 05: SPA Routing
Code in the les05 folder. Slides here: PDF
Exercises: quiz-game-part-05
-
Lesson 06: Async Calls to Web Services
Code in the les06 folder. Slides here: PDF
Exercises: quiz-game-part-06
-
Lesson 07: RESTful APIs Theory
No code. Slides here: PDF
Exercises: quiz-game-part-07
-
Lesson 08: RESTful APIs Practice
Code in the les08 folder. Slides here: PDF
Exercises: quiz-game-part-08
-
Lesson 09: Authentication and Authorization
Code in the les09 folder. Slides here: PDF
Exercises: quiz-game-part-09
-
Lesson 10: CORS, CSRF and XSS
Code in the les10 folder. Slides here: PDF
Exercises: quiz-game-part-10
-
Lesson 11: WebSockets
Code in the les11 folder. Slides here: PDF
Exercises: quiz-game-part-11
-
Lesson 12: Online Multi-Player Game
Code in the les12 folder. Slides here: PDF
Exercises: quiz-game-part-12
-
Extra: GraphQL APIs
Code in the extra-graphql folder. Slides here: PDF
Exercises: none
- You Don't Know JavaScript
- JavaScript Koans
- What the f*ck JavaScript?
- NodeJS
- YARN
- WebPack
- Babel
- Lodash
- React
- React-Router
- Jest
- Enzyme
- SuperTest
- CSS Selectors
- Express
- Passport
- ProgrammableWeb
A PDF of a mock exam for this course can be found here.
The materials herein are all Copyright (c) of Andrea Arcuri and contributors. The material was/is produced while working at Westerdals Oslo ACT and Høyskolen Kristiania.
All the source code in this repository is released under LGPL version 3 license.
The documentation is licensed under a Creative Commons Attribution-NonCommercial-NoDerivs 4.0 Unported License.