Skip to content
Sep Duijkersloot edited this page May 30, 2024 · 16 revisions

Verslag per week

Week 3

Wat heb ik deze week gedaan per competentie?

  • Orienteren en begrijpen -> Ik heb deze week op mijzelf onderzoek gedaan naar de OAuth van spotify en de diverse endpoints die hun Web API heeft, meer info is te vinden bij het onderzoek. Daarnaast heb ik verder de volgende tutorials gevolgd om github beter te begrijpen/leren: Github crashcourse

  • Prototpyen en uitwerken -> Ik heb een werkend prototype gemaakt waarin ik kan verbinden met de Spotify Web API met de OAuth. In dit prototype krijg ik ook wat nummers aanbevolen, op basis van artiesten en nummers die ik heb aangegeven. Op dit principe gaat onze app werken. Meer info bij het onderzoek

Welke hulpvragen heb ik?

Deze week nog niks.

Welke feedbackvragen heb ik?

  • (Team) Is het concept wat jullie ook voor ogen hadden?

Week 4

Wat heb ik deze week gedaan per competentie?

  • Verbeelden en conceptualiseren -> Ik heb gewerkt (samen met het team) aan ons concept, wat nu Juke is geworden. Hier heb ik meegeholpen aan een moodboard, logo ideatie. Daarnaast heb ik een persona, empathy map en job stories gemaakt, wat aansluit bij ons persona en hun benodigheden. Resultaten zijn te zien op de ontwerp pagina (Moodboard, logo, stylesheet)

  • Samen ontwerpen -> In groepsverband hebben we gewerkt aan het design en concept van onze web-app, wat nu Juke gaat heten. Tijdens deze werkgroep hebben we actief feedback aan elkaar gevraagd en zijn zo samen tot een mooi en passende oplossing gekomen, resultaat hiervan is te vinden op de ontwerp pagina (Moodboard, logo, stylesheet)

Welke hulpvragen heb ik?

Welke dingen zijn nog niet duidelijk of moeilijk, waarbij kun je hulp gebruiken?

  • (Docent) Vraag over endpoints, hoe gaat het werken met dat :id? Bijvoorbeeld om een genre te discoveren

Welke feedbackvragen heb ik?

Benoem concrete vragen over het werk wat je deze week hebt gedaan, die je aan je teamgenoten en/of docenten wilt stellen

  • (Team) Wat zouden jullie veranderen aan de wireframes?
  • (Team) Denk je dat je als buitenstaander zou kunnen begrijpen wat de app nu doet?
  • (Team) Zijn de huidige job stories in orde, en wat zouden jullie nog toevoegen?

Welke feedback heb ik ontvangen?

Beschrijf de feedback die je hebt ontvangen en hoe je deze gaat gebruiken om je werk verder te verbeteren.

  • De menubalk is niet ideaal voor een web applicatie, daarom gaan we dit veranderen naar een soort humburger menu variant. Verder onderzoek naar mogelijkheden is nog nodig.
  • Job stories, waren in orde. Hebben wel een User Requirement list opgesteld, die we hebben gerangschikt op belangrijk, m.b.v. de MoSCoW techniek, zie ontwerp pagina voor meer info.

Week 5

Wat heb ik deze week gedaan per competentie?

  • Prototypen en uitwerken -> Authorization prototype gemaakt, maar nu zonder PKCE standard. Dus standard "authorization code", hiervoor gekozen omdat het beter past bij server-side JavaScript. Link naar prototype

  • Oriënteren en begrijpen -> Verder onderzoek gedaan naar spotify authorization, ben erachter gekomen dat we de "authorization code" flow moesten gebruiken, aangezien deze beter past bij bij een server-side JS. Meer info te vinden bij het onderzoek over de spotify OAuth

  • Oriënteren en begrijpen -> Ik heb, samen met Vivanne, de User Requirement List opgesteld, zodat we de eindbelangen van de gebruiker goed kunnen neerzetten. Daarna hadden we deze gerangschikt met de MoSCoW methode, dit helpt met onze prioriteiten.

  • Samen ontwerpen -> Zoals ik net had vermeld, had ik samen met Vivanne gewerkt aan de User Requirement List en deze gerangschikt met de MoSCoW methode.

Welke hulpvragen heb ik?

Welke dingen zijn nog niet duidelijk of moeilijk, waarbij kun je hulp gebruiken?

  • Welke Authorization flow moet ik gaan gebruiken?

Welke feedbackvragen heb ik?

Benoem concrete vragen over het werk wat je deze week hebt gedaan, die je aan je teamgenoten en/of docenten wilt stellen

  • Geen vraag, maar ik ga het hebben over code standards met het team.
  • Navragen over login page design.

Welke feedback heb ik ontvangen?

Beschrijf de feedback die je hebt ontvangen en hoe je deze gaat gebruiken om je werk verder te verbeteren.

Week 6

Wat heb ik deze week gedaan per competentie?

Beschrijf wat je deze week hebt gedaan in termen van de competenties waaraan we in dit project werken. Je zult niet elke week aan elke competentie werken, maar in het hele project komen ze als het goed is wel allemaal aan de orde. De voorbeeldvragen die zijn genoemd bij de uitleg over de wiki op DLO kunnen je hierbij helpen.

  • Samen ontwerpen -> Ik had met Vivanne (back-ender) gewerkt aan een ToDo list voor onze back-end taken, zodat we deze konden verdelen, om zo een goede balans te behouden tussen ons werk.

Welke hulpvragen heb ik?

  • Vraag over database structuur, had aan wat AI tools gevraagd om te helpen met database structuren te bedenken. Samen met docent kijken welke we kunnen toepassen of wat we moeten aanpassen.
  • Vraag over hoe we vanuit front-end, back-end functies moeten aanroepen? Bv. Song liken: event triggered, en hoe dan naar database en in spotify playlist?

Welke feedbackvragen heb ik?

Benoem concrete vragen over het werk wat je deze week hebt gedaan, die je aan je teamgenoten en/of docenten wilt stellen

  • Info verzamelen data dat we verzamelen: Even op een lijstje zetten, wat voor data willen we allemaal verzamelen en opslaan. Loop de app samen door en denk erover na
  • Wanneer willen we front-end en back-end gaan samenvoegen?

Welke feedback heb ik ontvangen?

Beschrijf de feedback die je hebt ontvangen en hoe je deze gaat gebruiken om je werk verder te verbeteren.

Week 7

Wat heb ik deze week gedaan per competentie?

Beschrijf wat je deze week hebt gedaan in termen van de competenties waaraan we in dit project werken. Je zult niet elke week aan elke competentie werken, maar in het hele project komen ze als het goed is wel allemaal aan de orde. De voorbeeldvragen die zijn genoemd bij de uitleg over de wiki op DLO kunnen je hierbij helpen.

Welke hulpvragen heb ik?

Welke dingen zijn nog niet duidelijk of moeilijk, waarbij kun je hulp gebruiken?

Welke feedbackvragen heb ik?

Benoem concrete vragen over het werk wat je deze week hebt gedaan, die je aan je teamgenoten en/of docenten wilt stellen

Welke feedback heb ik ontvangen?

Beschrijf de feedback die je hebt ontvangen en hoe je deze gaat gebruiken om je werk verder te verbeteren.

Week 8

Wat heb ik deze week gedaan per competentie?

Beschrijf wat je deze week hebt gedaan in termen van de competenties waaraan we in dit project werken. Je zult niet elke week aan elke competentie werken, maar in het hele project komen ze als het goed is wel allemaal aan de orde. De voorbeeldvragen die zijn genoemd bij de uitleg over de wiki op DLO kunnen je hierbij helpen.

Welke hulpvragen heb ik?

Welke dingen zijn nog niet duidelijk of moeilijk, waarbij kun je hulp gebruiken?

Welke feedbackvragen heb ik?

Benoem concrete vragen over het werk wat je deze week hebt gedaan, die je aan je teamgenoten en/of docenten wilt stellen

Welke feedback heb ik ontvangen?

Beschrijf de feedback die je hebt ontvangen en hoe je deze gaat gebruiken om je werk verder te verbeteren.

Technisch onderzoek

Spotify API OAuth (& Endpoints)

  • Ik heb mijzelf verdiept in de Spotify Web API, met name hoe de autorisatie werkt end ook een eerste duik in de verschillende endpoints.
  • Voor dit onderzoek heb ik de Spotify developer documentatie gebruikt: https://developer.spotify.com/documentation/web-api
  • Uit mijn onderzoek is gebleken dat spotify een zeer uitgebreide documentatie heeft, wat erg fijn was en mij enorm heeft geholpen met het uitvinden van hoe alles werkt. Daarnaast heb ik een werkend protoype kunnen maken waar de gebruiker zich verifiërd en vervolgens een lijst van aanbevolen nummers krijgen (voor nu in de console), die gebaseert is op de top 5 nummers van de gebruiker. Dit idee lijkt erg op ons concept voor de app, dus dit heeft veel waarde voor ons team, zodat we weten dat we verder kunnen gaan met dit concept. Link naar de demo GitHub repo: https://github.com/SF-Duijkersloot/spotify-api-test

Verdiepend OAuth flow onderzoek

Beschrijf het volgende:

  • Voor dit onderzoek heb ik gekeken naar welke OAuth flow we moeten/het beste kunnen gebruiken. Aangezien ik hier een fout in had gemaakt bij mijn vorige onderzoek.
  • Voor dit onderzoek heb ik de Spotify developer documentatie gebruikt: https://developer.spotify.com/documentation/web-api
    • Bij mijn eerste onderzoek had ik de "Authorization code with PKCE" flow gebruikt. Maar die flow was blijkbaar bedoelt voor client-side code. Tijdens mijn onderzoek ben ik erachter gekomen dat we de "Authoruization flow" kunnen gebruiken en daar een server-side secret key te gebruiken. Daarnaast had ik een probleem met het laten zien van de scopes zodat gebruiker hierop kan agree-en. Dit kon ik oplossen door paramater: "show_dialog: true" mee te geven aan "https://accounts.spotify.com/authorize?"
  • Ik kreeg een tijd de authorization niet werkend met de "Authorization flow" en had daarom de "Authorization flow PKCE" geprobeerd. deze werkte wel met voorbereide code van spotify, maar dit bleek toch niet de juiste en gepaste flow te zijn voor onze app.
  • Wij gaan dus verder met de authorization flow aangezien we deze veilig werkend kunnen krijgen op onze server-side code en dit maakt de code voor het inloggen ook een stukje eenvoudiger dan met PKCE

Naam onderwerp

Beschrijf het volgende:

  • Welk technisch onderwerp heb je onderzocht?
  • Welke bronnen heb je geraadpleegd?
  • Wat heb je geleerd over het onderwerp, welke conclusies heb je getrokken?
  • Welke alternatieve oplossingen heb je onderzocht? Denk bv aan verschillende libraries of modules, frontend of backend oplossingen, verschillende manieren om je data te organiseren etc.
  • Welke oplossing heb je gekozen en waarom?

Naam onderwerp

Beschrijf het volgende:

  • Welk technisch onderwerp heb je onderzocht?
  • Welke bronnen heb je geraadpleegd?
  • Wat heb je geleerd over het onderwerp, welke conclusies heb je getrokken?
  • Welke alternatieve oplossingen heb je onderzocht? Denk bv aan verschillende libraries of modules, frontend of backend oplossingen, verschillende manieren om je data te organiseren etc.
  • Welke oplossing heb je gekozen en waarom?

Evaluatie

Beschrijf het volgende:

  • Op welke manieren heb je je prototype geevalueerd? Benoem gebruikte CMD methods
  • Beschrijf de aanpak van je test / evaluatie
  • Beschrijf de resultaten van je test / evaluatie
  • Hoe ga je deze resultaten gebruiken om je prototype verder te verbeteren?
Clone this wiki locally