Kickoff Opdracht Minor Web Design & Development

Team up!

In de minor gaan we werken in kleine teams. Drie teams samen vormen een Squad (fka klas) en de twee Squads samen vormen de Tribe, iedereen dus. Om elkaar beter te leren kennen, maakt iedereen een eigen digitaal visitekaartje. Per team maken jullie een teampagina waarin jullie je presenteren aan de Tribe.

Opdracht 0.1: Teambuilding

  • Je kan in de Tribe API vinden in welk team je zit
  • Meld je aan bij je team channel in de Minor Web Discord
  • Bedenk samen met je team een teamnaam & ontwerp een teamlogo (optioneel)
  • Maak kennis met elkaar en wijs een teamleader aan

Opdracht 0.2: Maak een digitaal visitekaartje

Maak deze opdracht aan de hand van de Dev Life Cycle: Analyseren, Ontwerpen, Bouwen, Integreren & Testen

1. Analyseren

Verdiep je in de Tribe API en de documentatie van de API. Heb je nog geen ervaring met API's? Bekijk dan de bronnen onderaan deze opdracht.

2. Ontwerpen

Schets eerst je visitekaartje in je schetsboekje en maak vervolgens een breakdownschets van de HTML, CSS en JavaScript.

Bekijk het voorbeeld van hoe je je visitekaartje kan schetsen.

3. Bouwen

Fork deze repo en open het project in je favoriete code editor.

Werk je breakdownschets uit in HTML, CSS en JavaScript. Jou data haal je op uit de API, maar maak zonnodig eerst een statische versie van je visitekaartje.

4. Integreren

Haal met JavaScript jouw naam op uit de Tribe API (dit is een GET request). Tip: check het voorbeeld in app.js van deze webpagina.

Render de data in HTML.

Update onderstaande lege velden van jezelf in de API (dit is een PUT request). En render deze data ook in de HTML.

  • mugshot
  • githubHandle
  • other (optioneel)

5. Testen

Bekijk je visitekaartje in een browser en tweak waar nodig met de DevTools. Als het kaartje er goed uit ziet, kan je de code committen en pushen naar GitHub

Documenteer je project in de README.md van deze repo (tip: lees de hints in de comments!)

Opdracht 0.3: Ontwerp en maak samen met je team een teampagina

Werk hier ook weer volgens de stappen van de Dev Life Cycle

  • Maak één repo aan voor het team (werk samen aan de code van deze repo)
  • Haal data van alle members van het team op uit de Tribe API
  • Render data in HTML en geef het vorm met CSS (bedenk samen een huisstijl)
  • Ontwerp naar eigen inzicht extra (statische) informatie over jullie team en voeg het toe aan de pagina!
  • Update de code op GitHub en GitHub Pages