Jaaropdracht Angular 3APP 2018-2019
Algemeen
Voor het vak Angular programmeer je individueel, of in groepjes van twee, een Angular6-PWA website. De inhoud mag je zelf bepalen.
Gebruik je fantasie en kies een onderwerp waarmee je creatief aan de slag kan. Kies bij voorkeur een project waar je
zelf wat aan hebt. Bijvoorbeeld een website voor de jeugdbeweging, de sportclub, je hobby,…
Je project moet bovendien voldoen aan een aantal minimumvereisten.
Minimumvereisten indien je alleen werkt
Algular versie
Ontwerp de site in Angular 6.
User Interface
Ontwerp een SPA-website met minstens vier routes.
- De volledige website is geoptimaliseerd (responsive) voor zowel een smartphone, een tablet als een PC/laptop.
- Eén van die routes is een info-scherm. In dit scherm komen je persoonlijke gegevens (naam, e-mail, GSM, …) en wat extra informatie over de site.
- Uiteraard heeft je website een aangepast favicon voor de verschillende platformen.
- Maak ook een aantrekkelijke user interface. De CSS of SCSS hiervoor kan je volledig zelf schrijven, maar je mag natuurlijk ook vertrekken van een bestaand framework.
Networking (AJAX)
Voorzie minstens één route waarbij je informatie/data ophaalt met een online service die we niet in de les besproken hebben. Data ophalen en visualiseren (lijst, tabel, grafiek, map, …) volstaat om de minimum vereisten te halen.
Lokale Data
Naast de gegevens ophalen, moet je website ook gegevens lokaal bewaren. Hiervoor gebruik je best Local Storage omdat deze op alle platformen wordt ondersteund.
Database
- Maak minstens twee tabellen (MySQL) of collections (MongoDB, Firestore).
Hiervoor heb je natuurlijk ook een PHP (MySQL) of Node backend (MongoDB) nodig. (Voor Firestore heb je geen backend nodig.)- Voer op minstens één van deze tabellen/collections een CRUD-operatie uit.
- Voorzie een (social) login.
Applicatie hosten
Voor een PWA moet je je website hosten via https (Heroku, Firebase,…).
Extra vereisten indien je met twee werkt
- Voorzie minstens 2 extra tabellen/collecties.
- Werk met GIT als versiebeheer en samenwerkingstool.
- Gebruik uitsluitend SASS.
- Voorzie een (social) login waarbij elke gebruiker zijn persoonlijke gegevens kan aanpassen.
- Bouw verschillende access levels in de toepassing (user, admin, ...).
- Gebruik minstens één reactive form.
- Verwerk nog minstens één onderdeel uit Angular dat niet in de les besproken werd.
Beoordeling en deadlines
Bij de beoordeling van je website wordt gelet op de originaliteit van je onderwerp, de complexiteit van je programma, de grootte van je project, de leesbaarheid/onderhoudbaarheid van je programmacode, de stabiliteit van je programma, de gebruiksvriendelijkheid, het ontwerp van je UI, het al dan niet voldoen aan de minimumvereisten, …
Daarnaast zijn er ook een aantal deadlines waarop je informatie i.v.m. je website tijdens de les aan je docent moet doorgeven. Een deel van de punten zal staan op het correct naleven van die deadlines. Zorg dus dat je in orde bent!
Korte omschrijving van het project (9/10 oktober)
- Beschrijf kort de website die je gaat uitwerken.
- Breng een uitgeprinte versie mee naar de les van 9/10 oktober.
Schermafbeeldingen (13/14 november)
- Maak van elke route in je website een schermafdruk.
- Pas de korte omschrijving eventueel verder aan.
- Breng een uitgeprinte versie mee naar de les van 13/14 november.
- Toon tijdens de les de voorlopige, online versie van de website.
Schriftelijke documentatie inleveren (
18-21 december8-11 januari)Elk team (individueel of met twee) geeft tijdens de laatste lesweek een geprint document af waarin je verduidelijkt waarom bepaalde keuzes gemaakt werden, waar elke bijdrage van ieder teamlid terug te vinden is in het project en wat de belangrijkste conclusies zijn.
In P307 zal tijdens deze week een doos staan waarin je je rapport kunt deponeren. Is je documentatie al vroeger klaar, dan mag je die ook tijdens de les afgeven (en dit is de veiligste optie!).
De thema’s waarover je moet rapporteren:
- Titelpagina met naam van de teamleden. De naam van de site en de URL.
- Indien je met twee personen werkt:
- Hoe verliep de samenwerking?
- Hoe verliep het versiebeheer via GIT? Illustreer met screenshots!
- Hoeveel tijd heeft elk van jullie gespendeerd aan het project?
- Welke onderdelen uit Angular, die we niet in de les behandeld hebben, heb je extra gebruikt?
- Welke bronnen heb je geraadpleegd?
- Heb je voor alle competenties uit het OPO niveau 3 behaald? (Wat, waar, waarom.)
- Realiseren
- Projectmatig werken
- Schrijf uit wat je vooral onthouden hebt uit dit project.
- Schrijf uit wat je de volgende keer anders zou aanpakken.
- Besluit: blik terug op het vak Angular en formuleer aanbevelingen voor toekomstige studenten.
Project digitaal opleveren (
21 decemberzo 6 januari 23h59)Elk team levert uiterlijk op
21 decemberzo 6 januari voor 23h59 een zip- of rarbestand in via Toledo met daarin heel het Angular-project maar ZONDER de map node_modules. Elk team stuurt bovendien ook de url in waar je Angular-project op internet gevonden kan worden.
