GIP 2024–2025 · Robin Huysmans

Sportslab

Een webplatform waar organisaties sportoefeningen en trainingsschema's kunnen aanmaken en delen. Met fiches, courses, gebruikersbeheer en een beveiligde PHP/MySQL back-end.

Back-end
PHP + MySQL
Server-side via XAMPP
Database
12 tabellen
phpMyAdmin beheer
Beveiliging
Prepared stmts
SQL injection beschermd

Klik hier om de website te bekijken
Het project
Ontwikkelaar
RH
Robin Huysmans
Full-stack webontwikkeling · Industriële ICT
Sportslab werd ontwikkeld als onderdeel van de GIP. Het project startte vanuit een bestaande front-end template — de back-end, database en beveiliging werden volledig zelf uitgewerkt. Begeleiders: Frank Meyers, Christophe Grattesolle, Leen Verwimp.
Inleiding
Wat is Sportslab?

Sportslab is een webplatform bedoeld voor sportorganisaties die hun oefeningen en trainingsschema's willen digitaliseren en delen. Elke oefening wordt beschreven in een fiche met afbeeldingen, stap-voor-stap uitleg en welke spieren getraind worden.

Fiches worden gebundeld in courses — vergelijkbaar met een trainingsschema van meerdere oefeningen. De volgorde van de fiches bepaalt de uitvoeringsvolgorde van de training.

Omdat een volledig uitgewerkte versie te omvangrijk was voor dit project, werd een functionele vereenvoudigde versie gebouwd: fiches uploaden, courses samenstellen, in- en uitloggen, en alles bekijken via een gebruikersdashboard.

📋

Fiches

Oefeningen met afbeeldingen, uitleg en spiergroepen — opgeslagen in MySQL.

🗂️

Courses

Trainingsschema's samengesteld uit max. 5 fiches in een zelfgekozen volgorde.

👤

Gebruikersbeheer

Registreren, inloggen, profiel aanpassen en eigen fiches beheren.

🔒

Beveiligde back-end

Wachtwoorden gehasht, SQL injecties geblokkeerd via prepared statements.

Technologie
Stack & tools
Sportslab combineert een PHP back-end met een MySQL database, gehost via XAMPP op localhost.
🐘

PHP

Server-side scripting voor alle database-communicatie. Verborgen voor de gebruiker — veilig voor wachtwoorden en data.

Back-end
🗄️

MySQL

Relationele database met 12 tabellen. Beheerd via phpMyAdmin. Alle CRUD-operaties via PHP.

Database
🖥️

XAMPP

Lokale server om PHP en MySQL te draaien. De website is niet publiek online — draait op localhost.

Hosting
🌐

HTML / CSS

Front-end gebaseerd op een bestaande template. Styling aangepast en uitgebreid per pagina.

Front-end
⚡

JavaScript

Client-side interactiviteit. Geen gevoelige data in JS verwerkt — dat gaat via PHP.

Front-end
📁

Partials

Navbar en sidebar staan in een aparte partials-map. Eén aanpassing = overal bijgewerkt.

Structuur
Gebruikte technologieën
PHP
MySQL
XAMPP
phpMyAdmin
HTML / CSS
JavaScript
Prepared Statements
password_hash()
Opbouw website
Pagina-overzicht
De website bestaat uit verschillende pagina's, elk met eigen functionaliteit en databasekoppeling.
🏠

Homepage

Landingspagina met stockfoto van atleten, navbar met profielknop, en een overzicht van voorbeeldcourses en labels.

Publiek
🔑

Login & Signup

Gelijkaardig opgebouwde pagina's met AI-gegenereerde afbeeldingen. Signup controleert op unieke naam/e-mail. Wachtwoord wordt gehasht opgeslagen.

Authenticatie
📄

Fiches

Upload pagina met verplichte velden. Tekst in de database, afbeeldingen in een media-map. Pad naar afbeelding opgeslagen in MySQL.

CRUD
📚

Courses

Trainingsschema's samenstellen uit eigen fiches (max. 5). Volgorde bepaalt uitvoeringsvolgorde. Opgeslagen en previewbaar.

Samenstelling
👤

User dashboard

Edit profile: profielfoto en gegevens aanpassen. My fiches: eigen fiches bekijken en verwijderen. Beide pagina's met gedeelde profile-banner via partials.

Dashboard
🧩

Partials

Navbar en profile-banner staan in een centrale partials-map en worden via PHP includes op elke pagina geladen.

Herbruikbaar
Beveiliging
SQL injectie & wachtwoorden

🛡️ Wat is SQL injection?

Een aanvaller voert kwaadaardige SQL-code in via een invoerveld. Zo kan hij je volledige database uitlezen of verwijderen. Het is een van de meest voorkomende beveiligingslekken op het web — maar ook een van de makkelijkst te voorkomen.

🔐

Prepared statements

SQL-code en gebruikersinvoer worden strikt gescheiden. Invoer kan nooit als SQL geïnterpreteerd worden. Toegepast op elke database-call in het project.

🔑

Wachtwoord hashing

Wachtwoorden worden nooit in plaintext opgeslagen. Via password_hash() omgezet naar een hash. Controle bij inloggen via password_verify().

🖥️

Server-side PHP

Alle gevoelige logica draait op de server via PHP — nooit in JavaScript dat de gebruiker kan zien.

// Prepared statement — SQL injection geblokkeerd $stmt = $conn->prepare( "SELECT * FROM users WHERE email = ?" ); $stmt->bind_param("s", $email); $stmt->execute(); // Wachtwoord hashen bij registratie $hash = password_hash($password, PASSWORD_DEFAULT); // Wachtwoord verifiëren bij inloggen $ok = password_verify($input, $hash);
Besluit
Wat heb ik geleerd?
Sportslab gaf me de kans om me volledig te focussen op back-end development — een domein waar ik voor dit project weinig ervaring mee had.

Omdat de front-end grotendeels al aanwezig was, kon ik mij focussen op PHP, MySQL en beveiliging. Ik leerde hoe een webapplicatie van binnen werkt: hoe data stroomt van formulier naar database en terug. De SQL injection en wachtwoord-hashing waren voor mij nieuwe concepten die ik nu goed begrijp en kan toepassen. Hoewel niet alles volledig afgewerkt is — de course-styling ontbreekt nog — ben ik tevreden met het resultaat en heb ik veel praktische ervaring opgedaan die ik in toekomstige projecten kan hergebruiken.