Skip to content

React Native - Examenopdracht

Richting: Graduaat Digitale Vormgeving

Opleidingsonderdeel: Web Expert 2

Overzicht

In deze opdracht ontwikkel je een volledig functionele React Native-applicatie waarin je laat zien dat je de concepten en de best practices voor mobiele ontwikkeling kan implementeren. Je mag je eigen onderwerp kiezen voor de applicatie, maar je moet wel voldoen aan de technische vereisten die hieronder worden genoemd.

Vereisten voor het project

1. Architectuur van de applicatie

  • Implementeer een werkende navigatie met React Navigation
    • Zorg voor minstens 3 hoofdschermen
    • Voorzie zowel stack- als tabbladnavigatie
    • Gebruik een drawer navigator met relevante opties
  • Volg een duidelijke en georganiseerde projectstructuur

EXTRA

  • Gebruik Redux of de Context API voor statusbeheer

2. UI/UX vereisten

  • Zorg voor een responsief design dat werkt op zowel iOS als Android
  • Gebruik minstens 2 verschillende types animaties
  • Implementeer duidelijke formuliervalidatie
  • Implementeer foutafhandeling met feedback aan de gebruiker
  • Voorzie waar nodig laadstatussen en juiste foutmeldingen

EXTRA

  • Hou rekening platformspecifieke ontwerprichtlijnen
  • Implementeer minimum 3 custom componenten

3. Data

  • Implementeer Local Storage door gebruik te maken van AsyncStorage
  • Implementeer caching van gegevens
  • Zorg voor een offline functionaliteit om basisfuncties af te handelen
  • Maak gebruik van een REST API om data te tonen

EXTRA

  • Schrijf je eigen REST API met PHP (Laravel) of Node.js (Express) om data te tonen

4. Functies voor native apparaten

Implementeer minstens één van de volgende:

  • Cameratoegang
  • Toegang tot de locatie services
  • Push notificaties mogelijk maken
  • Gebruik maken van sensoren van het toestel
  • Operaties mogelijk maken met het bestandssysteem van het toestel
  • Biometrische authenticatie mogelijk maken
  • Share functionaliteit voorzien

5. Authenticatie

  • Implementeer gebruikersauthenticatie
  • Zorg voor een veilige manier om credentials op te slaan
  • Voorzie een logout functionaliteit

EXTRA

  • Handel sessiebeheer correct af

6. Performantie

  • Waar nodig lazy loading implementeren
  • Optimaliseer het laden en cachen van afbeeldingen
  • Een pull-to-refresh-functie opnemen

EXTRA

  • Aandacht hebben voor geheugenbeheer implementeren
  • Veranderingen in de status op de achtergrond/voorgrond afhandelen

EXTRA

7. Testing

EXTRA

  • Unittests schrijven voor de basisfunctionaliteit
  • Integratietests opnemen
  • Implementeer UI-tests voor belangrijke gebruikers flows
  • Bereik minimaal 70% test coverage

Deliverables

  1. Aanleveren van de code via een Git repository
  2. Documentatie voorzien inclusief:
    • Installatie-instructies
    • API-documentatie
    • Overzicht van de architectuur
    • Lijst van geïmplementeerde functies
    • Bekende problemen/beperkingen
    • Toekomstige verbeteringen
    • Teststrategie
  3. Voorzie een video waarin je een demo voorziet van de applicatie (5-10 minuten)
  4. Technische presentatie op het examen

Evaluatie Criteria

  • Code kwaliteit en organisatie
  • Implementatie van vereiste functies
  • UI/UX-ontwerp en responsiviteit
  • Prestaties en optimalisatie
  • Testen en documentatie
  • Presentatie en demonstratie

Belangrijke Data

  • Tussentijdse check-in: 28/04/2025
  • Definitieve inzending: 1/06/2025
  • Presentaties: Examenperiode

Opmerkingen

  • De opdracht wordt in principe alleen gemaakt, maar kan uitzonderlijk ook met 2 gemaakt worden:
    • Met 2 zal er voor de score rekening gehouden worden met het aandeel geschreven code én is punt 7 Testing **niet ** optioneel.
  • Vraag regelmatig feedback
  • Code plagiaat wordt afgeraden en zal een 0 tot gevolg hebben