Week 5 (30‐03 tot 03‐04) - nadia2603/stage-maykin GitHub Wiki

30-03

Vandaag ben ik verder gegaan met de FAQ-cards. Ik heb de HTML aangepast en kwam erachter dat nog niet alles erin zat. Daarom heb ik een nieuwe schets gemaakt met de BEM-methode, zodat ik beter wist hoe ik de SCSS moest opzetten. Zo kon ik de SCSS goed schrijven volgens de conventies.

Om het goed volgens het design te maken, heb ik steeds naar het design gekeken en ook hoe bepaalde dingen zijn opgebouwd.

Ik had ook een lijst gemaakt met alles wat ik voor de cards moest doen, zodat ik deze tijdens het werken kon afvinken en niets vergat.

31-03

Vandaag heb ik de laatste dingen gedaan aan de FAQ-cards. Ik heb een animatie toegevoegd met ::details-content, zodat wanneer je een item openklapt, dit vloeiend gaat in plaats van direct.

Toen ik daarmee klaar was, heb ik een pull request gemaakt en deze is gemerged.

Daarna ben ik begonnen met de zoekbalk en filters. Er stond al code en de filters werkten al; ik heb vooral de styling gedaan en de zoekbalk toegevoegd. Ik ben begonnen met een breakdown-schets en daarna een schets gemaakt voor de classes.

Toen ik klaar was, moest alleen de zoekbalk nog werkend worden. Dit bleek lastiger dan verwacht in combinatie met de filters. Uiteindelijk kwam eruit dat de filters, die eerst buttons waren, aangepast moeten worden naar radio inputs. Daarna moet ook de styling opnieuw worden gedaan. Ik heb besloten om dit de volgende dag verder op te pakken.

01-04

Vandaag heb ik de taak opgepakt die ik gisteren had: de filters aanpassen van buttons naar radio inputs.

Ik heb eerst de buttons vervangen door inputs en er labels omheen gezet. Daarna heb ik de filters opnieuw gestyled. De active state was lastiger dan verwacht, omdat dit op een andere manier moest dan ik eerst had toegepast. Ook moesten de filters weer werkend worden gemaakt. Een button voert automatisch een submit uit, maar een input niet. Ik heb uitgezocht hoe ik dit toch automatisch kon laten werken en dit vervolgens toegevoegd. De zoekbalk zelf werkend krijgen is nog niet gelukt.

Verder heb ik op de FAQ pagina de contact-CTA gemaakt. Ik heb eerst een breakdown-schets gemaakt en daarna een schets van de classes volgens BEM. Vervolgens ben ik begonnen met coderen. Ik heb de HTML geschreven met de juiste classes en een nieuw SCSS bestand aangemaakt waarin ik de styling heb uitgewerkt. De contact-CTA is nu zo goed als af.

02-04

Vandaag heb ik vooral gewerkt aan de Django-tutorial, waarin ik stap voor stap een eigen project maak. De tutorial bestaat uit zeven onderdelen; ik heb nu de eerste twee afgerond.

Ik heb de installatie uitgevoerd en een nieuwe pagina aangemaakt die naar de juiste URL verwijst. Daarnaast heb ik een database opgezet waarin je een vraag kunt toevoegen. Hierbij hoort ook een admin-omgeving waarin je deze data kunt beheren.

Alles heb ik in een eigen repo gezet. In deze repo houd ik ook een wiki bij met alle stappen, zodat ik later makkelijk kan terugzien wat ik heb gedaan en het beter kan begrijpen.

03-04

Vandaag ben ik verder gegaan met de Django-tutorial en heb ik deel 3 afgerond. Daarna ben ik verder gegaan met de FAQ-filters. De zoekbalk moest nog werkend worden gemaakt. Sven heeft mij daarbij geholpen en uitgelegd hoe dit werkt.

Ik kwam erachter dat er bij de zoekbalk geen submitknop zit, wat beter is voor de toegankelijkheid en progressive enhancement. Ik heb dit besproken met Sven. Hij gaf aan dat ik wel een button kan toevoegen die visueel verborgen is, maar nog wel toegankelijk is voor screenreaders en zichtbaar wordt wanneer je met de tabtoets navigeert.

Daarnaast heb ik uitleg gekregen over hoe ik pagination kan maken. Er staat al code, maar die moet nog verbeterd worden. Ik heb een stappenplan gemaakt met wat ik moet doen om dit te bouwen. Daar ga ik dinsdag mee beginnen.

Ook heb ik voor de faq-filters en de faq-cta een pull request gemaakt. Hier heb ik feedback op gekregen, inclusief uitleg over hoe ik dit kan verbeteren. Hier ga ik dinsdag verder mee aan de slag.