Browser Based Multiplayer Game

Database aanmaken

Maak in PhpMyAmdin een nieuwe database met 1 tabel voor gerbuikers.
Voeg minstens 1 gebruiker toe met gebruikersnaam & wachtwoord.

Login form (PHP)

Maak een formulier met een textfield voor gebruikersnaam en wachtwoord.
Wanneer de gebruiker op de knop druk kijk je of de gebruikernaam in de database zit:

Gameplay

Je kan deze zaken toevoegen aan je game in een volgorde naar keuze, kijk welke leerstof je nog niet helemaal beheers en probeer eerst deze zaken toe te voegen, zo zal je het snelste leren.

Tip

Dit is een voorbeeld van gameplay, maar je mag uiterraard je eigen regels gebruiken.

Resource management (PHP)

  1. Je start het spel met 100 goud/cash/....
  2. Je kan 3 soorten soldaten/spaceships/... kopen:
    • Werkers:
      Verdienen: 3 goud/cash/... per uur
      Attack: 1
      Defence: 1
    • Verdedigers:
      Verdienen: 1 goud/cash/... per uur
      Attack: 1
      Defence: 3
    • Aanvallers:
      Verdienen 1 goud/cash/... per uur
      Attack: 3
      Defence: 1
  3. Goud/cash/... bij verdienen:
  4. Elke keer dat je op de pagina komt haal je uit de database het tijdstip van de vorige keer dat je op de pagina kwam.
  5. Bereken hoeveel tijd ver streken is en hoeveel goud/cash/... je in die tijd verdient hebt, update je database.
  6. Update het tijdstip met de tijd van nu.

Gevechten met randomness (PHP of JS)

Spelers kunnen andere spelers aanvallen. Bij een gevecht is er steeds een stukje randomness zodat de sterkste speler niet altijd automatisch wint.

Voorbeeld:

  1. Elke speler heeft een totale attack en defence score.
  2. Voeg een random bonus toe tussen.
  3. Vergelijk daarna beide scores.

Mogelijke uitbreidingen:

World Map (PHP & CSS)

Geef elke speler (bij het aanmaken van hun account) random coördinaten.
Maak een World Map en plaats de naam of het icoontje van elke speler op de juiste plek op de kaart.

  1. Maak een lege div met de afbeelding als achtergrond.
  2. Plaats de spelers op de map door gebruik te maken van CSS Display & Position.

User Settings in LocalStorage (JS)

Maak een menu met settings die de user kan aanpassen en sla dit op in LocalStorage
Denk hierbij aan:

Sharable Profile Page (JS)

Maak een profile page die elke speler kan customizen en sharen, sla alle settings op in de URL via Url Query Parameters zodat spelers **hun profiel kunnen delen met hun eigen customizations.
Denk hierbij aan customizations zoals:

Sharable Profile Page Shop (PHP)

Voeg een shop toe waarbij spelers zaken kunnen kopen om hun sharable profile page te pimpen.
Denk hierbij aan zaken zoals:

Battle Log met arrays (JS)

Hou tijdens het spelen een battle log bij in een JavaScript array.

Voorbeeld:

let battleLog = [];

battleLog.push("Je viel Player123 aan");
battleLog.push("Critical hit!");
battleLog.push("Je won 50 goud");

Toon daarna alle berichten op het scherm met een loop.

Mogelijke uitbreidingen:

Notifications systeem (JS)

Maak een notificatie systeem met JavaScript array.

Voorbeelden van meldingen:

Mogelijke uitbreidingen:

Selected Troops systeem (JS)

Gebruik een JavaScript array om bij te houden welke troepen geselecteerd zijn voor een aanval.

Voorbeeld:

let selectedTroops = [];

selectedTroops.push("Aanvaller");
selectedTroops.push("Verdediger");

Mogelijke ujitbreidingen:

Mobile Friendly (CSS)

Zorg ervoor dat het spel vlot en overwichtelijk werkt op smartphone of tablet zodat ze het en altijd en overal kunnen spelen.

Denk hierbij aan:

Mogelijke uitbreidingen:

Hosting op Raspberry Pi (Linux)

Om je browser game ook van buiten je thuisnetwerk speelbaar te maken, kan je een Raspberry Pi gebruiken als Linux server.
De Raspberry Pi draait dan je PHP + database + webserver.

Extra ideeën

Last edited: 05/06/2026
Created: 04/06/2026