Full Stack Node.js Semester Plan

About the course

About the course

Mandatories

Mandatory I

Mandatory II

Taught on: Thursday

Semester Plan

Title	Date	Description	Learning Goals	Resources and Activities
01. Introduction	Jan. 29th	Intro to the course. Information about the mandatories / exam expectations. Code conventions / Clean Code Intro to Node.js. Variables, data types. Intro Exercises. Our REST API conventions vs. Richardson Maturity Model	While using a linter is not a requirement, having clean code is. Can work with Git in the terminal. Understand and work with data types in JavaScript. Can explain what Node.js is and how to run files with it. Knows the existing data types in JavaScript and can work with them. Understands type coercion and strategies to avoid it. Can design a REST API. Knows the three REST conventions we follow: Using the right HTTP verb. Ordering. Naming (noun, plural) that maps to collections in your system.	Introduction Exercises REST API Design
02. First Server	Feb. 5th	Code conventions / Clean Code (Strict Mode). Variables and Functions. Callback functions. Build tools and package managers. Package.json. Express. Sending data with GET requests.	Understand scoping in Javascript and know to always use const if you can get away with it otherwise let. Understand advanced things about functions in JavaScript. Can write callback functions with different syntax. Understands the function of NPM and can compare it with other package managers. Understands the different purposes of package.json and can set it up by hand. Understands what node_modules are and why they shouldn’t be pushed. Can create a server with Express from memory. Can explain the client-server model. Understands how to send data with GET requests over HTTP and knows how to do it in Express.	Movies REST API - Part I
03. Loop Methods	Feb. 12th	Nodemon Loops and loop methods in JS. CRUDable REST API - Part I. Anatomy of an URL. All the ways to send data from a client to a server. Serving HTML with Express. XSS.	Understands the use case for Nodemon and its limitation to development. Can use loop methods (+map, +filter, %reduce). Can choose the right one at the appropriate time: We wish to use loop methods and in a functional manner (avoiding side effects). Only use for loops in JavaScript when finger counting. Understands why a functional approach to loops is to be preferred and how to implement it without side effects. Can use the right terminology when it comes to the different parts of an URL. Can make a POST request and parse the body in Express. Understand the dangers of XSS and how to prevent it in frontend (avoiding innnerHTML) and backend (sanitizing).	CSS Games Movies REST API - Part II
04. HTML / Time	Feb. 19th	CRUDable REST API - Part II. Fetch. Time. Deployment.	Can create a full CRUDable REST API that follows conventions. Can write a fetch request without hesitation. Can get the Date in Javascript.	Time to deploy
05. Export / Import	Feb. 26th	Serving static files in Express. Exporting and importing in frontend (type="module" attribute). Commonjs vs. ES Modules in Node.js. Client-side redirection vs. server-side redirection. npm init and meta data in package.json.	Understands the security need to serve static files and can do it in Express. Can work with both types of import/export in HTML. Can import/export in both ways in Node.js (CommonJS and ES Modules). Knows the pros of using ES Modules. Can recount the number of ways and approaches to redirection. Understands the difference between client-side redirection and server-side.	Mandatory I (Given) How to serve static files with Vercel
06. Client vs. Server / Environment Variables	March 5th	Package.json scripts. Environment Variables. Semantic HTML: nav, main, footer.	Can define and run scripts with NPM. Know how to define environment variables natively in Node.js (natively = not using any libraries). Structuring HTML with semantic HTML. Can point out which files are client files and which are server files. Knows at least one way to style a footer so that it appears at the bottom, always. Can argue for a better way to structure the frontend (assets, pages). Can argue for the pros and cons of CDN vs. serving content locally.	Work on the mandatory: Set up pages. Add lots of documentation. Implement styling including how to display code snippets.
07. Server-side Rendering (SSR) / Routers	March 12th	Server-side rendering vs. client-side rendering. Reading files. Nodemon ext. Routers (Express).	Understands how code and its placement affects application memory and efficiency. Understands how synchronous and asynchronous code affects code execution when reading files. Understands the arguments for and against SSR vs. CSR when it comes to: Load time. Ressources spent (duration, when and where). SEO. Dealing with CORS (SSR has no CORS issues). Can argue for better ways to structure the code and how to avoid files that are too long. Can create an Express Router by heart.	Svelte interactive tutorials (introduction / props)
08. Svelte Family	March 19th	Passing data between components. Svelte stores.	Understand the tree structure of web frameworks (parent/child). Fully understand the different ways to pass data in Svelte. Can code it too.	Svelte Family - Component Hierarchy Toast Notifications Login / Signup Svelte interactive tutorials II
10. Middleware / Security	March 26th	Writing custom middleware in Express. Rate-limiter. Express session. Bcrypt.	Understands how middleware works in Express, why order matters and how to use it to your advantage. Can use a rate-limiter. Understands how sessions work on the server. Can argue about the pros and cons of JWT vs. session. Understand the need for encrypting passwords, the security surrounding them and why even encrypted passwords are not safe to publicize.	Send Emails Optional: Register Domain + Emails Mandatory II Given Mandatory II: Make a choice between JWT or sessions. Either way, you should be informed of the pros and cons of each choice. Create the backend and setup the relevant middleware. Until next week, focus on setting up the security to the backend.
11. Fullstack	April 9th	Dotenv. Client Routing Svelte Routing. Readable stores vs. Svelte DotEnv. CORS.	Understands the role of Dotenv and is able to differentiate it from environment variables in Node.js. Understands client routing in SPAs. Can use fetch in Svelte with onMount (to avoid a reactive loop). Understands why CORS exists and the situations that trigger it. Can solve CORS issues in Express. Understand how CSR and SSR deals with CORS and session id (credentials). Knows how to serve Svelte from Express with vite build --watch.	Mandatory II: Setup the fullstack project, create routing in the frontend and setup protected routes. Create fetches between the frontend and backend. Hard code data in the backend for now.