In this course you will learn to build a web application without frameworks or unnecessary libraries, but with vanilla HTML, CSS & JavaScript as much as possible. The end result is a modular, single page web app (SPA). Data will be retrieved from an external API, manipulated and finally shown in the UI of the App. You will learn to apply interface principles when building and testing the interface. With the gained knowledge you will be able to build interactive prototypes, based on a user story and real data. Also you will gain a better understanding of how API's, frameworks and libraries work.
- Visitekaartje: Ontwerp en maak met HTML, CSS en JS een visitekaartje.
- Squadpagina: Ontwerp en maak met je team een squadpagina waarin je de verschillende visitekaartjes toont.
- Single Page App: Design and build a single page web app based on a User Story.
| Planning | Maandag | Dinsdag | Vrijdag |
|---|---|---|---|
| Week 1 - Hellooo 🤸 | Introduction + visitekaartje | Squadpagina | Teambespreking |
| Week 2 - Hello API 🐒 | College + briefing opdracht | College + Work | Feedbackgesprekken |
| Week 3 - Refactor 🛠 | College + work | College + work | Feedbackgesprekken |
| Voorjaarsvakantie | |||
| Week 4 - Wrapping up 🎁 | College + work | Review + work | Beoordelingsgesprekken |
All work during this course will be tested against our Best Practices for JavaScript.
Your efforts will be graded using a single point rubric (see below). You will have to pass the criterion (centre column) to pass the course. During the test you will be consulted and will be given feedback on things we think deficient and things we think are an improvement on the criterion.
| Deficiency | Criterion | Improvement |
|---|---|---|
| User Interface - you design, build and test the user interface by applying interface design principles | ||
| Code structure - you write modular, consistent and efficient HTML, CSS and JavaScript code by applying structure and best practices. You manage state for the application and the UI | ||
| Data management - you understand how you can work with an external API using asynchronous code. You can retrieve data, manipulate and dynamically convert it to structured html | ||
Project - your app is working and published on GitHub Pages. Your project is thoroughly documented in the README.md file in your repository. |