**Flask & Web Apps Introductie

Welkom bij je eerste stap in de wereld van web ontwikkeling! In deze les leer je de basis van Flask, een populaire Python framework voor web applicaties, en hoe je je eerste eenvoudige webpagina maakt. Je zult begrijpen hoe webapplicaties werken en hoe je een basis structuur in Python kunt bouwen.

Learning Objectives

  • Je kunt Flask installeren en een basis Flask applicatie starten.
  • Je kunt een route definiëren en een tekst weergeven in de browser.
  • Je begrijpt het concept van request en response in web development.
  • Je kunt een statische HTML-pagina in je Flask applicatie integreren.

Text-to-Speech

Listen to the lesson content

Lesson Content

Wat is Flask en waarom gebruiken we het?

Flask is een micro-framework voor Python, perfect voor het bouwen van web applicaties. Het is 'micro' omdat het een minimale basis heeft, wat betekent dat je flexibel bent en alleen de componenten toevoegt die je nodig hebt. Flask is populair vanwege zijn eenvoud, flexibiliteit en gebruiksgemak. Het is ideaal voor kleine tot middelgrote projecten, en het kan ook worden uitgebreid voor complexere applicaties.

Denk aan Flask als een 'gereedschapskist' voor web applicaties. Je kiest zelf welke gereedschappen (libraries en packages) je erin stopt om je project te bouwen. Dit in tegenstelling tot 'full-stack' frameworks, die vaak alles aan boord hebben.

Flask Installeren

Voordat we beginnen, moeten we Flask installeren. Open je terminal of command prompt en typ:

pip install flask

Dit installeert Flask en alle benodigde dependencies. pip is de package installer voor Python. Zorg ervoor dat je Python en pip correct geïnstalleerd hebt. Je kunt dit controleren door python --version en pip --version in de terminal te typen.

Als je een virtual environment gebruikt (aanbevolen!), activeer die dan voordat je pip install flask uitvoert.

Je Eerste Flask Applicatie

Laten we nu onze eerste Flask applicatie maken. Maak een nieuw bestand genaamd app.py (of iets dergelijks) en voeg de volgende code toe:

from flask import Flask

app = Flask(__name__)

@app.route("/")
def hello_world():
    return "Hallo, Wereld!"

if __name__ == "__main__":
    app.run(debug=True)

Laten we de code uitleggen:

  • from flask import Flask: Dit importeert de Flask klasse.
  • app = Flask(__name__): Dit maakt een Flask applicatie instantie. __name__ verwijst naar de naam van het huidige Python module.
  • @app.route("/"): Dit is een decorator. Het definieert een route ('/') voor je applicatie. De route is de URL die gebruikers in hun browser typen (bijvoorbeeld http://127.0.0.1:5000/).
  • def hello_world():: Dit is een functie die wordt uitgevoerd wanneer iemand naar de '/' route gaat.
  • return "Hallo, Wereld!": Deze regel retourneert de tekst die in de browser wordt weergegeven.
  • app.run(debug=True): Dit start de applicatie. debug=True is handig tijdens ontwikkeling omdat het automatische herstarten en gedetailleerde foutmeldingen toestaat.

De Applicatie Runnen en Bekijken

Sla app.py op. Open je terminal, navigeer naar de map waar je app.py hebt opgeslagen, en typ:

python app.py

Je zult een bericht zien dat zegt dat de applicatie draait (meestal op http://127.0.0.1:5000/). Open je webbrowser en ga naar dit adres. Gefeliciteerd! Je hebt je eerste Flask web applicatie gemaakt en 'Hallo, Wereld!' wordt weergegeven.

Routes en HTML Weergeven

Laten we nu een route toevoegen die een HTML-pagina weergeeft. Maak een map genaamd templates in dezelfde map als app.py. Maak binnen de templates map een bestand genaamd index.html met de volgende inhoud:

<!DOCTYPE html>
<html>
<head>
    <title>Mijn Eerste Webpagina</title>
</head>
<body>
    <h1>Welkom!</h1>
    <p>Dit is mijn eerste webpagina gebouwd met Flask.</p>
</body>
</html>

Verander vervolgens je app.py als volgt:

from flask import Flask, render_template

app = Flask(__name__)

@app.route("/")
def index():
    return render_template('index.html')

if __name__ == "__main__":
    app.run(debug=True)
  • from flask import Flask, render_template: We importeren nu render_template.
  • return render_template('index.html'): We gebruiken render_template om de index.html pagina weer te geven.
Voortgang
0%