This course is designed to provide a comprehensive introduction to modern web development, covering both back-end and front-end technologies as well as touching on deployment and testing practices. Students will gain hands-on experience in building full-stack applications using a set of modern frameworks and tools, preparing them for real-world software development scenarios. By the end of the course, students will have built a fully functional web application, gaining a deeper understanding of how different parts of a web application interact and how to test and deploy their applications.
All content, code, and assets in this repository are protected under All Rights Reserved copyright. You may not:
- Fork this repository
- Use any part of the code or content
- Share or redistribute it
- Modify or create derivative works
- Use it in any commercial or non-commercial project
Please respect the license terms. If you are interested in licensing or collaboration, contact:
See the LICENSE.md file for full details.
Students are expected to have successfully finished the WD1 course or have a similar level of understanding of basic web technologies. They have to understand HTML and CSS, know how to program in Python, be able to build a monolithic application using Flask, understand the basics of HTTP protocol and about web APIs.
Lesson 01 - Modern web applications' architecture
Talk about different modern approaches for building web-based applications.
Lesson 02 - Web APIs (and Flask)
Discuss how different parts of the application can communicate. Build and test your first API.
Lesson 03 - Authentication & authorization
Limit the access for different API endpoints and talk about different methods of authentication
Lesson 04 - File upload
Upload a file to the BE and save it on the server
Lesson 05 - Back-end processing and cron
Do scheduled BE processing on the server
Lesson 06 - Recap
Answer questions and clear up fogginess
Lesson 07 - JavaScript basics
Show examples of variables, data types, conditionals loops and functions. Mention type conversion
Lesson 08 - JavaScript inner working
Introduce ES5, ES6 and newer functionalities, modules, functions as first-class citizens (as opposed to Python's objects), show callbacks and their usage, etc.
Lesson 09 - JavaScript and the DOM
Explain what is DOM, when it gets created and how it can be interacted with. Introduce DOM Elements, DOM Navigation and DOM Events.
Lesson 10 - JavaScript pitfalls and gotchas
How can JavaScript trick you and how not to shoot yourself in the foot with JavaScript
Lesson 11 - JavaScript packages and package managers
Using other people's code; install and use some packages, talk about advantages and drawbacks of using external code.
Lesson 12 - TypeScript
Show how to install and use TypeScript and how it can help in avoiding some of the pitfalls from lesson 10.
Lesson 13 - Recap
Give space to clear up the unknowns and additional questions. Start talking about the final project and what kind of ideas would be sensible.
Lesson 14 - React
Implement a Tic-Tac-Toe game with React.
Lesson 15 - Angular
Implement a Hangman game with Angular.
Lesson 16 - Vue
Implement a Mastermind game with Vue.
Lesson 17 - Serverless and Firebase
Lesson 18 - Code quality and static code analysis
Cleanliness is next to godliness
Lesson 19 - Automatic tests and TDD
Make the computer catch your errors
Lesson 20 - CI/CD and environments
Make your deployment save and effortless
Lesson 21 - Recap & final project planning
Clear up the questions, talk about the different ideas for the final project
Lesson 22 - Build BE
Lesson 23 - Build FE
Lesson 24 - Test, deploy and wrap up
Finish up the project and talk about how to keep working on it. Explain open source projects and how collaboration works on these projects.