Table of Contents
The course Frontend 3 is given at @CMDA in 2017 between 25 September and 20 October.
- Course: Frontend 3
- Course coordinator: Titus Wormer
- Course lecturers: Titus Wormer (@wooorm) and Laurens Aarnoudse (@razpudding)
- Semester: Information Design
- Semester coordinators: Frank Kloos and Maaike van Cruchten
- SIS: Frontend 3 Data
- Credit: 3 ECTS
- Academic year: 2017-2018
- Period: Quarter 1
- Programme: Communication and Multimedia Design (full time bachelor)
- Language: Dutch instructions and English resources
- Entry requirements: N/A
Frontend 3 builds further on the knowledge acquired in Internetstandaarden, Inleiding Programmeren, Frontend 1, Frontend 2, and Backend (the last two are optional but recommended), amongst others.
In this course you’ll learn to use d3 to actually make what you design, to advance your web dev skills, and to adopt frameworks and libraries. In Project 1 (individual) and Project 2 (team) of Information Design you’ll apply your newfound skills.
- GitHub — Main source of information, assignments, important dates, and more
- Website — Examples and assignments
- Slack — General chatter and Q&A
- Moodle — Schedulers
The 3 main goals in this course are:
- Learning how to use a library
- Making a data visualisation from external data
- Learning d3
In practice you’ll learn to:
- Understand SVG and canvas (class 1)
- Load external data (class 1 and class 3)
- Write documentation (class 2)
- Read documentation (class 2)
- Debug code (class 2)
- Refactor code (class 2)
- Use scales (domain, range, and axis) (class 2 and class 5)
- Transform and clean data (class 3)
- Manipulate elements (class 3 and class 4)
- Use data joins (class 3 and class 4)
- Create interactive visualisations (class 4 and class 5)
- Create multiple visualisations on the same page (class 5 and class 6)
|Assessment 1 (remote)||20%|
|Assessment 2 (remote)||30%|
|Assessment 3 (oral)||40%|
Dates are indicative. Check
rooster.hva.nl for info on actual
date, time, and place.
|Class||Date ID 1||Date ID 2||Date ID 3|
|Assessment 3||19-10||20-10||18-10 and 20-10|
※ Assessments 1 and 2 are to be handed in before the start of the next class.
The table below breaks down the general time needed to complete activities.
|Class (6 × 2½hrs)||15|
|Assignments (5 × 5hrs)||25|
Resources used in this course
🆓GitHub account (required) — Sign Up 🆓Text Editor (required) — Atom or Sublime 🆓Installation of Node, Python, or Ruby (required) 🆓King, Ritchie S. Visual Storytelling with D3. Addison-Wesley, 2015 (optional) 🆓Meeks, Elijah. D3.js in Action. O’Reilly Media, 2017 (optional) 🆓Navarro Castillo, Pablo. Mastering D3.js. Packt Publishing, 2014 (optional) 🆓D3.js Essentials on Lynda (optional)
Resources to refresh your memory
Resources used in previous courses
- Duckett, Jon. HTML & CSS. John Wiley & Sons, 2015 (internetstandaarden)
- Howe, Shay. Learn to Code HTML & CSS. New Riders, 2014 (internetstandaarden)
- Simpson, Kyle. YDKJS: Up & Going. O’Reilly Media, 2015 (frontend 2)
- Simpson, Kyle. YDKJS: Scope & Closures. O’Reilly Media, 2015 (frontend 2)
- Simpson, Kyle. YDKJS: this & Object Prototypes. O’Reilly Media, 2015 (frontend 2)
- Simpson, Kyle. YDKJS: Types & Grammar. O’Reilly Media, 2015 (frontend 2)
- Simpson, Kyle. YDKJS: Async & Performance. O’Reilly Media, 2015 (frontend 2)
- Simpson, Kyle. YDKJS: ES6 & Beyond. O’Reilly Media, 2016 (frontend 2)
If you have questions:
- Read the manual
- Browse the gallery
- Follow tutorials
- Search StackOverflow
- Use a search engine (like DuckDuckGo)
- Ask questions on Slack
- Open an issue
- Contact a lecturer
Frontend 3 is given in the Information Design semester (quarter 1 and 2). Information Design is all about data visualisation and infographics. In 6 courses and 3 projects you’ll learn how to visualise data and complex information. In Frontend 3 you’ll learn how to build that.
This semester (including this course) is quite technical. However, we’ll also test your creativity. See the below infographic about Frontend 3’s place in Information Design.
Frontend 3 is given at Communication and Multimedia Design, a design bachelor focused on interactive digital products and services. CMD is part of the Faculty of Digital Media and Creative Industries at the Amsterdam University of Applied Sciences.
This project has a Code of Conduct. Anyone interacting with this repository, organisation, or community is bound by it.