04-A: Opdracht 2.1: Ontwerp structuur aanbrengen in de code en routering toevoegen

[JeroenHeemskerk]

• We gaan in deze opdracht de code herschikken zodat:
  
  • alle client requests worden door hetzelfde script afgehandeld. Dit heet "single door routing".
  • Met een parameter in het GET/POST request wordt aangegeven welke pagina getoond moet worden.
    • Bijvoorbeeld in het menu komt. "<a href="index.php?page=about> ABOUT </a>".
    • bij POST requests dien je GEEN urlparameter te gebruiken (dus <form action="index.php?page=contact" method="post">).
      
      
• Maak een PSD waarbij je ervan uitgaat dat er twee stappen nodig zijn voor de applicatie 
  

  1. Alle aanvragen van de client (browser) worden verstuurd naar het bestand index.php op de server, en er kunnen 2 soorten aanvragen worden gedaan:

     • Een GET request als gevolg van het klikken op een <a>-tag in het menu.In dit geval wordt in de URL meegegeven welke pagina wordt gevraagd.
     • Een POST request als gevolg van het klikken op een submit-button in een <form>. In dit geval wordt in de POST meegegeven welke pagina er wordt gepost.
  2. De betreffende pagina moet worden getoond, hierbij moeten zaken die gemeenschappelijk zijn zoals Header, Menu en Footer maar op 1 plek voorkomen.
     
     
• In een PSD zou het top-level er dus alsvolgt uit kunnen zien:
  PSD: Top-level
  

  getRequestedPage

  showResponsePage

• Werk ieder van deze blokken uit, en als je weer op een complexe stap stuit, werk die stap dan ook weer in een eigen PSD uit, bijv.
  PSD: getResponsePage
  

  showDocumentStart

  showHeadSection

  showBodySection

  showDocumentEnd

  
  en dan
  
  PSD: showBodySection
  

  showBodyStart

  showHeader

  showMenu

  showContent

  showFooter

  showBodyEnd

• Plaats de PSD in de /Diagrams folder in je repository
  • Indien je de PSD op papier hebt gemaakt, maak dan een foto en plaats deze in de /Diagrams folder
  • Indien je de PSD met draw.io hebt gemaakt, maak hier dan een PNG van en plaats deze in de /Diagrams folder
  • Indien je de PSD met een lokale tool hebt gemaakt, maak hier dan een PNG van en plaats deze in de /Diagrams folder
• Commit de PSD naar je lokale repository (o.v.v. het issue nummer).
• Push de commit naar GitHub