ist jetzt verfügbar! Lesen Sie über die neuen Funktionen und Fehlerbehebungen vom November.

Django Tutorial in Visual Studio Code

Django ist ein High-Level-Python-Framework, das für schnelle, sichere und skalierbare Webentwicklung entwickelt wurde. Django bietet umfangreiche Unterstützung für URL-Routing, Seiten-Vorlagen und die Arbeit mit Daten.

In diesem Django-Tutorial erstellen Sie eine einfache Django-App mit drei Seiten, die eine gemeinsame Basisvorlage verwenden. Sie erstellen diese App im Kontext von Visual Studio Code, um zu verstehen, wie Sie mit Django im VS Code-Terminal, Editor und Debugger arbeiten. Dieses Tutorial behandelt nicht verschiedene Details zu Django selbst, wie z. B. die Arbeit mit Datenmodellen und die Erstellung einer administrativen Benutzeroberfläche. Anleitungen zu diesen Aspekten finden Sie in den Links zur Django-Dokumentation am Ende dieses Tutorials.

Das abgeschlossene Code-Projekt aus diesem Django-Tutorial finden Sie auf GitHub: python-sample-vscode-django-tutorial.

Wenn Sie Probleme haben, können Sie auf den Diskussionen zur Python-Erweiterung (Fragen & Antworten) nach Antworten suchen oder eine Frage stellen.

Voraussetzungen

Um dieses Django-Tutorial erfolgreich abzuschließen, müssen Sie Folgendes tun (was die gleichen Schritte wie im allgemeinen Python-Tutorial sind)

  1. Installieren Sie die Python-Erweiterung.

  2. Installieren Sie eine Version von Python 3 (für die dieses Tutorial geschrieben wurde). Optionen sind:

    • (Alle Betriebssysteme) Ein Download von python.org; verwenden Sie typischerweise die Schaltfläche "Python 3.9.1 herunterladen", die zuerst auf der Seite erscheint (oder was auch immer die neueste Version ist).
    • (Linux) Die integrierte Python 3-Installation funktioniert gut, aber um andere Python-Pakete zu installieren, müssen Sie sudo apt install python3-pip im Terminal ausführen.
    • (macOS) Eine Installation über Homebrew unter macOS mit brew install python3 (die Systeminstallation von Python unter macOS wird nicht unterstützt).
    • (Alle Betriebssysteme) Ein Download von Anaconda (für Zwecke der Datenwissenschaft).
  3. Stellen Sie unter Windows sicher, dass der Speicherort Ihres Python-Interpreters in Ihrer PATH-Umgebungsvariable enthalten ist. Sie können den Speicherort überprüfen, indem Sie path in der Eingabeaufforderung ausführen. Wenn der Ordner des Python-Interpreters nicht enthalten ist, öffnen Sie die Windows-Einstellungen, suchen Sie nach "Umgebung", wählen Sie Umgebungsvariablen für Ihr Konto bearbeiten, und bearbeiten Sie dann die Variable Path, um diesen Ordner einzuschließen.

Erstellen Sie eine Projektumgebung für das Django-Tutorial

In diesem Abschnitt erstellen Sie eine virtuelle Umgebung, in der Django installiert wird. Die Verwendung einer virtuellen Umgebung vermeidet die Installation von Django in einer globalen Python-Umgebung und gibt Ihnen die genaue Kontrolle über die in einer Anwendung verwendeten Bibliotheken. Eine virtuelle Umgebung erleichtert auch das Erstellen einer requirements.txt-Datei für die Umgebung.

  1. Erstellen Sie auf Ihrem Dateisystem einen Projektordner für dieses Tutorial, z. B. hello_django.

  2. Verwenden Sie in diesem Ordner den folgenden Befehl (je nach Ihrem Computer), um eine virtuelle Umgebung namens .venv basierend auf Ihrem aktuellen Interpreter zu erstellen

    # Linux
    sudo apt-get install python3-venv    # If needed
    python3 -m venv .venv
    source .venv/bin/activate
    
    # macOS
    python3 -m venv .venv
    source .venv/bin/activate
    
    # Windows
    py -3 -m venv .venv
    .venv\scripts\activate
    

    Hinweis: Verwenden Sie eine Standard-Python-Installation, wenn Sie die obigen Befehle ausführen. Wenn Sie python.exe aus einer Anaconda-Installation verwenden, sehen Sie einen Fehler, da das ensurepip-Modul nicht verfügbar ist und die Umgebung in einem unvollständigen Zustand bleibt.

  3. Öffnen Sie den Projektordner in VS Code, indem Sie code . ausführen, oder indem Sie VS Code ausführen und den Befehl Datei > Ordner öffnen verwenden.

  4. Öffnen Sie in VS Code die Befehlspalette (Anzeigen > Befehlspalette oder (⇧⌘P (Windows, Linux Ctrl+Shift+P))). Wählen Sie dann den Befehl Python: Interpreter auswählen

    Django tutorial: opening the Command Palette in VS Code

  5. Der Befehl präsentiert eine Liste der verfügbaren Interpreter, die VS Code automatisch finden kann (Ihre Liste kann variieren; wenn Sie den gewünschten Interpreter nicht sehen, siehe Konfigurieren von Python-Umgebungen). Wählen Sie aus der Liste die virtuelle Umgebung in Ihrem Projektordner aus, die mit ./.venv oder .\.venv beginnt.

    Django tutorial: Selecting the virtual environment for Python

  6. Führen Sie Terminal: Neues Terminal erstellen (⌃⇧` (Windows, Linux Ctrl+Shift+`)) aus der Befehlspalette aus, wodurch ein Terminal erstellt und die virtuelle Umgebung automatisch aktiviert wird, indem ihr Aktivierungsskript ausgeführt wird.

    Hinweis: Unter Windows kann es bei Ihrem Standard-Terminaltyp PowerShell zu einem Fehler kommen, dass activate.ps1 nicht ausgeführt werden kann, da die Ausführung von Skripten im System deaktiviert ist. Der Fehler enthält einen Link mit Informationen, wie Sie Skripte zulassen können. Verwenden Sie andernfalls Terminal: Standardprofil auswählen, um stattdessen "Eingabeaufforderung" oder "Git Bash" als Standard festzulegen.

  7. Die ausgewählte Umgebung wird auf der rechten Seite der VS Code-Statusleiste angezeigt und zeigt den Hinweis ('.venv': venv), der Ihnen mitteilt, dass Sie eine virtuelle Umgebung verwenden.

    Django tutorial: selected environment showing in the VS Code status bar

  8. Aktualisieren Sie pip in der virtuellen Umgebung, indem Sie den folgenden Befehl im VS Code-Terminal ausführen

    python -m pip install --upgrade pip
    
  9. Installieren Sie Django in der virtuellen Umgebung, indem Sie den folgenden Befehl im VS Code-Terminal ausführen

    python -m pip install django
    

Sie haben nun eine in sich geschlossene Umgebung, die für die Erstellung von Django-Code bereit ist. VS Code aktiviert die Umgebung automatisch, wenn Sie Terminal: Neues Terminal erstellen (⌃⇧` (Windows, Linux Ctrl+Shift+`)) verwenden. Wenn Sie eine separate Eingabeaufforderung oder ein separates Terminal öffnen, aktivieren Sie die Umgebung, indem Sie source .venv/bin/activate (Linux/macOS) oder .venv\Scripts\Activate.ps1 (Windows) ausführen. Sie wissen, dass die Umgebung aktiviert ist, wenn die Eingabeaufforderung am Anfang (.venv) anzeigt.

Erstellen und ausführen einer minimalen Django-App

In der Django-Terminologie besteht ein "Django-Projekt" aus mehreren standortweiten Konfigurationsdateien, zusammen mit einer oder mehreren "Apps", die Sie auf einem Webhost bereitstellen, um eine vollständige Webanwendung zu erstellen. Ein Django-Projekt kann mehrere Apps enthalten, von denen jede typischerweise eine unabhängige Funktion im Projekt hat, und dieselbe App kann in mehreren Django-Projekten vorhanden sein. Eine App wiederum ist lediglich ein Python-Paket, das bestimmten Konventionen folgt, die Django erwartet.

Um eine minimale Django-App zu erstellen, ist es daher notwendig, zuerst das Django-Projekt zu erstellen, das als Container für die App dient, und dann die App selbst zu erstellen. Für beide Zwecke verwenden Sie das Django-Verwaltungsdienstprogramm django-admin, das bei der Installation des Django-Pakets installiert wird.

Erstellen Sie das Django-Projekt

  1. Führen Sie im VS Code-Terminal, in dem Ihre virtuelle Umgebung aktiviert ist, den folgenden Befehl aus

    django-admin startproject web_project .
    

    Dieser Befehl startproject geht davon aus (durch die Verwendung von . am Ende), dass der aktuelle Ordner Ihr Projektordner ist, und erstellt darin Folgendes:

    • manage.py: Das Django-Befehlszeilen-Verwaltungsdienstprogramm für das Projekt. Sie führen Verwaltungsbefehle für das Projekt mit python manage.py <command> [options] aus.

    • Ein Unterordner namens web_project, der die folgenden Dateien enthält:

      • __init__.py: eine leere Datei, die Python mitteilt, dass dieser Ordner ein Python-Paket ist.
      • asgi.py: ein Einstiegspunkt für ASGI-kompatible Webserver, um Ihr Projekt bereitzustellen. Sie belassen diese Datei normalerweise unverändert, da sie die Hooks für Produktions-Webserver bereitstellt.
      • settings.py: enthält Einstellungen für das Django-Projekt, die Sie während der Entwicklung einer Web-App ändern.
      • urls.py: enthält ein Inhaltsverzeichnis für das Django-Projekt, das Sie ebenfalls während der Entwicklung ändern.
      • wsgi.py: ein Einstiegspunkt für WSGI-kompatible Webserver, um Ihr Projekt bereitzustellen. Sie belassen diese Datei normalerweise unverändert, da sie die Hooks für Produktions-Webserver bereitstellt.
  2. Erstellen Sie eine leere Entwicklungsdatenbank, indem Sie den folgenden Befehl ausführen

    python manage.py migrate
    

    Wenn Sie den Server zum ersten Mal ausführen, erstellt er eine Standard-SQLite-Datenbank in der Datei db.sqlite3, die für Entwicklungszwecke gedacht ist, aber für Web-Apps mit geringem Volumen auch in der Produktion verwendet werden kann. Weitere Informationen zu Datenbanken finden Sie im Abschnitt Arten von Datenbanken.

  3. Um das Django-Projekt zu überprüfen, stellen Sie sicher, dass Ihre virtuelle Umgebung aktiviert ist, und starten Sie dann den Django-Entwicklungsserver mit dem Befehl python manage.py runserver. Der Server läuft auf dem Standardport 8000, und Sie sehen eine Ausgabe wie die folgende im Terminalfenster:

    Watching for file changes with StatReloader
    Performing system checks...
    
    System check identified no issues (0 silenced).
    June 13, 2023 - 18:38:07
    Django version 4.2.2, using settings 'web_project.settings'
    Starting development server at http://127.0.0.1:8000/
    Quit the server with CTRL-BREAK.
    

    Der integrierte Webserver von Django ist *nur* für lokale Entwicklungszwecke vorgesehen. Wenn Sie jedoch auf einem Webhost bereitstellen, verwendet Django stattdessen den Webserver des Hosts. Die Module wsgi.py und asgi.py im Django-Projekt kümmern sich um die Anbindung an die Produktionsserver.

    Wenn Sie einen anderen Port als den Standardport 8000 verwenden möchten, geben Sie die Portnummer in der Befehlszeile an, z. B. python manage.py runserver 5000.

  4. Strg+Klick auf die URL http://127.0.0.1:8000/ im Terminal-Ausgabefenster, um Ihren Standardbrowser zu dieser Adresse zu öffnen. Wenn Django korrekt installiert ist und das Projekt gültig ist, sehen Sie die unten gezeigte Standardseite. Das VS Code-Terminal-Ausgabefenster zeigt auch das Serverprotokoll an.

    Django tutorial: default view of empty Django project

  5. Wenn Sie fertig sind, schließen Sie das Browserfenster und stoppen Sie den Server in VS Code mit Strg+C, wie im Terminal-Ausgabefenster angegeben.

Erstellen Sie eine Django-App

  1. Führen Sie im VS Code-Terminal mit aktivierter virtueller Umgebung den Befehl startapp des Verwaltungsdienstprogramms in Ihrem Projektordner (wo sich manage.py befindet) aus

    python manage.py startapp hello
    

    Der Befehl erstellt einen Ordner namens hello, der eine Reihe von Code-Dateien und einen Unterordner enthält. Davon arbeiten Sie häufig mit views.py (das die Funktionen enthält, die Seiten in Ihrer Web-App definieren) und models.py (das Klassen enthält, die Ihre Datenobjekte definieren). Der Ordner migrations wird vom Django-Verwaltungsdienstprogramm verwendet, um Datenbankversionen zu verwalten, wie später in diesem Tutorial erläutert. Außerdem gibt es die Dateien apps.py (App-Konfiguration), admin.py (zum Erstellen einer administrativen Benutzeroberfläche) und tests.py (zum Erstellen von Tests), die hier nicht behandelt werden.

  2. Ändern Sie hello/views.py so, dass es dem folgenden Code entspricht, der eine einzige Ansicht für die Startseite der App erstellt

    from django.http import HttpResponse
    
    def home(request):
        return HttpResponse("Hello, Django!")
    
  3. Erstellen Sie eine Datei, hello/urls.py, mit dem folgenden Inhalt. Die Datei urls.py ist der Ort, an dem Sie Muster angeben, um verschiedene URLs an ihre entsprechenden Ansichten weiterzuleiten. Der folgende Code enthält eine Route, um die Stamm-URL der App ("") der Funktion views.home zuzuordnen, die Sie gerade zu hello/views.py hinzugefügt haben

    from django.urls import path
    from hello import views
    
    urlpatterns = [
        path("", views.home, name="home"),
    ]
    
  4. Der Ordner web_project enthält ebenfalls eine Datei urls.py, in der die URL-Weiterleitung tatsächlich gehandhabt wird. Öffnen Sie web_project/urls.py und ändern Sie sie so, dass sie dem folgenden Code entspricht (Sie können die erläuternden Kommentare beibehalten, wenn Sie möchten). Dieser Code ruft die urls.py der App über django.urls.include ab, wodurch die Routen der App innerhalb der App verbleiben. Diese Trennung ist hilfreich, wenn ein Projekt mehrere Apps enthält.

    from django.contrib import admin
    from django.urls import include, path
    
    urlpatterns = [
        path("", include("hello.urls")),
        path('admin/', admin.site.urls)
    ]
    
  5. Speichern Sie alle geänderten Dateien.

  6. Führen Sie im VS Code-Terminal, in dem Ihre virtuelle Umgebung ebenfalls aktiviert ist, den Entwicklungsserver mit python manage.py runserver aus und öffnen Sie einen Browser unter http://127.0.0.1:8000/, um eine Seite zu sehen, die "Hello, Django" rendert.

    Django tutorial: the basic Django app running in a browser

Erstellen Sie ein Debugger-Startprofil

Sie fragen sich wahrscheinlich bereits, ob es einen einfacheren Weg gibt, den Server auszuführen und die App zu testen, ohne jedes Mal python manage.py runserver eingeben zu müssen. Glücklicherweise gibt es den! Sie können ein benutzerdefiniertes Startprofil in VS Code erstellen, das auch für die unvermeidliche Übung des Debuggens verwendet wird.

  1. Wechseln Sie zur Ansicht Ausführen in VS Code (über die Aktivitätsleiste auf der linken Seite oder F5). Möglicherweise sehen Sie die Meldung "Zum Anpassen von Ausführen und Debuggen erstellen Sie eine launch.json-Datei". Das bedeutet, dass Sie noch keine launch.json-Datei mit Debug-Konfigurationen haben. VS Code kann diese für Sie erstellen, wenn Sie auf den Link launch.json-Datei erstellen klicken.

    Django tutorial: initial view of the debug panel

  2. Wählen Sie den Link und VS Code fordert Sie zur Auswahl einer Debug-Konfiguration auf. Wählen Sie Django aus der Dropdown-Liste und VS Code füllt eine neue launch.json-Datei mit einer Django-Startkonfiguration. Die Datei launch.json enthält eine Reihe von Debug-Konfigurationen, von denen jede ein separates JSON-Objekt innerhalb des Arrays configuration ist.

  3. Scrollen Sie nach unten und untersuchen Sie die Konfiguration mit dem Namen "Python: Django"

    {
      // Use IntelliSense to learn about possible attributes.
      // Hover to view descriptions of existing attributes.
      // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
      "version": "0.2.0",
      "configurations": [
        {
          "name": "Python Debugger: Django",
          "type": "debugpy",
          "request": "launch",
          "program": "${workspaceFolder}\\manage.py",
          "args": ["runserver"],
          "django": true,
          "justMyCode": true
        }
      ]
    }
    

    Diese Konfiguration weist VS Code an, "${workspaceFolder}/manage.py" mit dem ausgewählten Python-Interpreter und den Argumenten in der Liste args auszuführen. Das Starten des VS Code-Debuggers mit dieser Konfiguration ist also dasselbe wie das Ausführen von python manage.py runserver im VS Code-Terminal mit Ihrer aktivierten virtuellen Umgebung. (Sie können eine Portnummer wie "5000" zu args hinzufügen, wenn gewünscht.) Der Eintrag "django": true weist VS Code auch an, das Debuggen von Django-Seiten-Vorlagen zu aktivieren, was Sie später in diesem Tutorial sehen werden.

  4. Testen Sie die Konfiguration, indem Sie den Menübefehl Ausführen > Debug-Modus starten auswählen oder auf den grünen Pfeil Debug-Modus starten neben der Liste klicken (F5)

    Django tutorial: start debugging/continue arrow on the debug toolbar

  5. Strg+Klick auf die URL http://127.0.0.1:8000/ im Terminal-Ausgabefenster, um den Browser zu öffnen und zu sehen, dass die App ordnungsgemäß ausgeführt wird.

  6. Schließen Sie den Browser und beenden Sie den Debugger, wenn Sie fertig sind. Zum Beenden des Debuggers verwenden Sie die Schaltfläche "Beenden" in der Symbolleiste (das rote Quadrat) oder den Befehl Ausführen > Debug-Modus beenden (⇧F5 (Windows, Linux Shift+F5)).

  7. Sie können jetzt Ausführen > Debug-Modus starten jederzeit verwenden, um die App zu testen, was auch den Vorteil hat, alle geänderten Dateien automatisch zu speichern.

Den Debugger erkunden

Das Debugging bietet Ihnen die Möglichkeit, ein laufendes Programm an einer bestimmten Codezeile anzuhalten. Wenn ein Programm angehalten ist, können Sie Variablen untersuchen, Code im Bedienfeld "Debug-Konsole" ausführen und die auf Debugging beschriebenen Funktionen nutzen. Das Ausführen des Debuggers speichert auch automatisch alle geänderten Dateien, bevor die Debugging-Sitzung beginnt.

Bevor Sie beginnen: Stellen Sie sicher, dass Sie die laufende App am Ende des letzten Abschnitts mit Strg+C im Terminal gestoppt haben. Wenn Sie die App in einem Terminal weiterlaufen lassen, beansprucht sie weiterhin den Port. Wenn Sie die App dann im Debugger mit demselben Port ausführen, verarbeitet die ursprüngliche laufende App alle Anfragen, und Sie sehen keine Aktivität in der zu debuggenden App, und das Programm stoppt nicht an Breakpoints. Mit anderen Worten: Wenn der Debugger nicht zu funktionieren scheint, stellen Sie sicher, dass keine andere Instanz der App noch läuft.

  1. Fügen Sie in hello/urls.py eine Route zur Liste urlpatterns hinzu

    path("hello/<name>", views.hello_there, name="hello_there"),
    

    Das erste Argument von path definiert eine Route "hello/", die einen variablen String namens name akzeptiert. Der String wird an die Funktion views.hello_there übergeben, die im zweiten Argument von path angegeben ist.

    URL-Routen sind case-sensitiv. Zum Beispiel unterscheidet sich die Route /hello/<name> von /Hello/<name>. Wenn Sie möchten, dass dieselbe Ansichtsfunktion beide verarbeitet, definieren Sie Pfade für jede Variante.

  2. Ersetzen Sie den Inhalt von views.py durch den folgenden Code, um die Funktion hello_there zu definieren, durch die Sie im Debugger steppen können

    import re
    from django.utils.timezone import datetime
    from django.http import HttpResponse
    
    def home(request):
        return HttpResponse("Hello, Django!")
    
    def hello_there(request, name):
        now = datetime.now()
        formatted_now = now.strftime("%A, %d %B, %Y at %X")
    
        # Filter the name argument to letters only using regular expressions. URL arguments
        # can contain arbitrary text, so we restrict to safe characters only.
        match_object = re.match("[a-zA-Z]+", name)
    
        if match_object:
            clean_name = match_object.group(0)
        else:
            clean_name = "Friend"
    
        content = "Hello there, " + clean_name + "! It's " + formatted_now
        return HttpResponse(content)
    

    Die in der URL-Route definierte Variable name wird als Argument an die Funktion hello_there übergeben. Wie in den Code-Kommentaren beschrieben, filtern Sie immer beliebige benutzergesteuerte Informationen, um verschiedene Angriffe auf Ihre App zu vermeiden. In diesem Fall filtert der Code das Namensargument so, dass es nur Buchstaben enthält, was die Einschleusung von Steuerzeichen, HTML und Ähnlichem vermeidet. (Wenn Sie im nächsten Abschnitt Vorlagen verwenden, führt Django eine automatische Filterung durch und Sie benötigen diesen Code nicht.)

  3. Setzen Sie einen Breakpoint auf die erste Codezeile in der Funktion hello_there (now = datetime.now()), indem Sie eine der folgenden Optionen ausführen:

    • Drücken Sie die Taste F9, während der Cursor auf dieser Zeile steht, oder,
    • Wählen Sie den Menübefehl Ausführen > Breakpoint umschalten, während der Cursor auf dieser Zeile steht, oder,
    • Klicken Sie direkt in den Rand links von der Zeilennummer (ein blasser roter Punkt erscheint, wenn Sie mit der Maus darüberfahren).

    Der Breakpoint erscheint als roter Punkt im linken Rand.

    Django tutorial: a breakpoint set on the first line of the hello_there function

  4. Starten Sie den Debugger, indem Sie den Menübefehl Ausführen > Debug-Modus starten auswählen oder auf den grünen Pfeil Debug-Modus starten neben der Liste klicken (F5)

    Django tutorial: start debugging/continue arrow on the debug toolbar

    Beachten Sie, dass sich die Statusleiste zur Anzeige des Debuggens verfärbt.

    Django tutorial: appearance of the debugging status bar

    Eine Debugging-Symbolleiste (siehe unten) erscheint ebenfalls in VS Code und enthält Befehle in der folgenden Reihenfolge: Pause (oder Fortsetzen, F5), Schritt über die nächste Zeile (F10), Schritt in die nächste Funktion (F11), Schritt aus der Funktion heraus (⇧F11 (Windows, Linux Shift+F11)), Neustart (⇧⌘F5 (Windows, Linux Ctrl+Shift+F5)) und Stopp (⇧F5 (Windows, Linux Shift+F5)). Sehen Sie sich VS Code Debugging für eine Beschreibung jedes Befehls an.

    Django tutorial: the VS Code debug toolbar

  5. Die Ausgabe erscheint in einem Terminal "Python Debug Console". Öffnen Sie einen Browser und navigieren Sie zu http://127.0.0.1:8000/hello/VSCode. Bevor die Seite gerendert wird, hält VS Code das Programm am von Ihnen gesetzten Breakpoint an. Der kleine gelbe Pfeil am Breakpoint zeigt an, dass dies die nächste auszuführende Codezeile ist.

    Django tutorial: VS Code paused at a breakpoint

  6. Verwenden Sie "Schritt über die nächste Zeile", um die Anweisung now = datetime.now() auszuführen.

  7. Auf der linken Seite des VS Code-Fensters sehen Sie einen Bereich Variablen, der lokale Variablen wie now sowie Argumente wie name anzeigt. Darunter befinden sich Bereiche für Überwachen, Aufrufstack und Breakpoints (siehe VS Code Debugging für Details). Im Abschnitt Lokale Variablen versuchen Sie, verschiedene Werte zu erweitern. Sie können auch Werte per Doppelklick ändern (oder Enter (Windows, Linux F2)). Das Ändern von Variablen wie now kann jedoch das Programm zum Absturz bringen. Entwickler nehmen Änderungen typischerweise nur vor, um Werte zu korrigieren, wenn der Code von Anfang an nicht den richtigen Wert geliefert hat.

    Django tutorial: local variables and arguments in VS Code during debugging

  8. Wenn ein Programm angehalten ist, können Sie im Bedienfeld Debug-Konsole (das sich vom "Python Debug Console" im Terminal-Bedienfeld unterscheidet) Ausdrücke ausprobieren und Codeabschnitte mit dem aktuellen Programmzustand testen. Nachdem Sie beispielsweise die Zeile now = datetime.now() übersprungen haben, können Sie verschiedene Datums-/Zeitformate ausprobieren. Wählen Sie im Editor den Code now.strftime("%A, %d %B, %Y at %X") aus, klicken Sie dann mit der rechten Maustaste und wählen Sie Debug: Auswerten, um diesen Code an die Debug-Konsole zu senden, wo er ausgeführt wird

    now.strftime("%A, %d %B, %Y at %X")
    'Friday, 07 September, 2018 at 07:46:32'
    

    Tipp: Die Debug-Konsole zeigt auch Ausnahmen aus der App an, die im Terminal möglicherweise nicht erscheinen. Wenn Sie beispielsweise im Bereich Aufrufstack der Ansicht Ausführen und Debuggen die Meldung "Anhalt bei Ausnahme" sehen, wechseln Sie zur Debug-Konsole, um die Ausnahmemeldung anzuzeigen.

  9. Kopieren Sie diese Zeile in die Eingabeaufforderung > am unteren Rand der Debug-Konsole und versuchen Sie, die Formatierung zu ändern

    now.strftime("%A, %d %B, %Y at %X")
    'Tuesday, 13 June, 2023 at 18:03:19'
    now.strftime("%a, %d %b, %Y at %X")
    'Tue, 13 Jun, 2023 at 18:03:19'
    now.strftime("%a, %d %b, %y at %X")
    'Tue, 13 Jun, 23 at 18:03:19'
    
  10. Steppen Sie durch ein paar weitere Codezeilen, wenn Sie möchten, und wählen Sie dann Fortsetzen (F5), damit das Programm weiterläuft. Das Browserfenster zeigt das Ergebnis an.

    Django tutorial: result of the modified program

  11. Ändern Sie die Zeile im Code, um ein anderes Datums-/Zeitformat zu verwenden, z. B. now.strftime("%a, %d %b, %y at %X"), und speichern Sie dann die Datei. Der Django-Server wird automatisch neu geladen, was bedeutet, dass die Änderungen angewendet werden, ohne dass der Debugger neu gestartet werden muss. Aktualisieren Sie die Seite im Browser, um die Aktualisierung zu sehen.

  12. Schließen Sie den Browser und beenden Sie den Debugger, wenn Sie fertig sind. Zum Beenden des Debuggers verwenden Sie die Schaltfläche "Beenden" in der Symbolleiste (das rote Quadrat) oder den Befehl Ausführen > Debug-Modus beenden (⇧F5 (Windows, Linux Shift+F5)).

Tipp: Um den wiederholten Aufruf einer bestimmten URL wie http://127.0.0.1:8000/hello/VSCode zu vereinfachen, geben Sie diese URL mit einer print-Anweisung irgendwo in einer Datei wie views.py aus. Die URL erscheint im VS Code-Terminal, wo Sie sie mit Strg+Klick zum Öffnen im Browser verwenden können.

Befehle "Gehe zu Definition" und "Definition anzeigen"

Während Ihrer Arbeit mit Django oder einer anderen Bibliothek möchten Sie möglicherweise den Code dieser Bibliotheken selbst untersuchen. VS Code bietet zwei praktische Befehle, die Sie direkt zu den Definitionen von Klassen und anderen Objekten in jedem Code navigieren lassen

  • Gehe zu Definition springt von Ihrem Code in den Code, der ein Objekt definiert. Klicken Sie beispielsweise in views.py mit der rechten Maustaste auf HttpResponse in der Funktion home und wählen Sie Gehe zu Definition (oder verwenden Sie F12), um zur Klassendefinition in der Django-Bibliothek zu navigieren.

  • Definition anzeigen (⌥F12 (Windows Alt+F12, Linux Ctrl+Shift+F10), ebenfalls im Kontextmenü per Rechtsklick verfügbar), ist ähnlich, zeigt aber die Klassendefinition direkt im Editor an (wodurch im Editorfenster Platz geschaffen wird, um keinen Code zu verdecken). Drücken Sie die Taste Escape, um das Peek-Fenster zu schließen, oder verwenden Sie das x in der oberen rechten Ecke.

    Django tutorial: Peek Definition showing the Flask class inline

Verwenden Sie eine Vorlage zum Rendern einer Seite

Die bisher in diesem Tutorial erstellte App generiert nur einfache Text-Webseiten aus Python-Code. Obwohl es möglich ist, HTML direkt im Code zu generieren, vermeiden Entwickler eine solche Praxis, da sie die App für Cross-Site-Scripting (XSS)-Angriffe öffnet. In der Funktion hello_there dieses Tutorials könnte man beispielsweise versuchen, die Ausgabe im Code mit etwas wie content = "<h1>Hello there, " + clean_name + "!</h1>" zu formatieren, wobei das Ergebnis in content direkt an einen Browser übergeben wird. Dies ermöglicht es einem Angreifer, bösartiges HTML, einschließlich JavaScript-Code, in die URL einzuschleusen, die in clean_name landet und somit im Browser ausgeführt wird.

Eine wesentlich bessere Vorgehensweise ist es, HTML komplett aus Ihrem Code herauszuhalten, indem Sie Vorlagen verwenden, sodass Ihr Code nur für Werte und nicht für die Darstellung zuständig ist.

In Django ist eine Vorlage eine HTML-Datei, die Platzhalter für Werte enthält, die der Code zur Laufzeit bereitstellt. Die Django-Vorlagen-Engine kümmert sich dann um die Ersetzung bei der Darstellung der Seite und bietet automatische Escaping, um XSS-Angriffe zu verhindern (d. h., wenn Sie HTML in einem Datenwert verwenden würden, würden Sie das HTML nur als reinen Text dargestellt sehen). Der Code kümmert sich somit nur um Werte, und die Vorlage kümmert sich nur um Markup. Django-Vorlagen bieten flexible Optionen wie Vorlagenvererbung, die es Ihnen ermöglicht, eine Basis-Seite mit gemeinsamem Markup zu definieren und diese Basis dann mit seiten-spezifischen Ergänzungen zu erweitern.

In diesem Abschnitt beginnen Sie mit der Erstellung einer einzelnen Seite unter Verwendung einer Vorlage. In nachfolgenden Abschnitten konfigurieren Sie die App so, dass sie statische Dateien bereitstellt, und erstellen dann mehrere Seiten für die App, die jeweils eine Navigationsleiste aus einer Basisvorlage enthalten. Django-Vorlagen unterstützen auch Kontrollfluss und Iteration, wie Sie später in diesem Tutorial im Kontext des Vorlagen-Debuggings sehen werden.

  1. Suchen Sie in der Datei web_project/settings.py die Liste INSTALLED_APPS und fügen Sie den folgenden Eintrag hinzu, der sicherstellt, dass das Projekt von der App weiß, damit sie die Vorlagenverarbeitung handhaben kann

    'hello',
    
  2. Erstellen Sie im Ordner hello einen Ordner namens templates und dann einen weiteren Unterordner namens hello, der dem App-Namen entspricht (diese zweistufige Ordnerstruktur ist eine typische Django-Konvention).

  3. Erstellen Sie im Ordner templates/hello eine Datei namens hello_there.html mit dem folgenden Inhalt. Diese Vorlage enthält zwei Platzhalter für die Datenwerte "name" und "date", die durch Paarungen von geschweiften Klammern {{ und }} abgegrenzt sind. Alle anderen unveränderlichen Texte sind Teil der Vorlage, zusammen mit Formatierungsmarkup (wie <strong>). Wie Sie sehen können, können Vorlagenplatzhalter auch Formatierungen enthalten, die Ausdrücke nach den Pipe-Symbolen |, in diesem Fall mit den integrierten Datumsfilter und Zeitfilter von Django. Der Code muss dann nur den Datums-/Zeitwert *anstelle* eines vorformatierten Strings übergeben.

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title>Hello, Django</title>
        </head>
        <body>
            <strong>Hello there, {{ name }}!</strong> It's {{ date | date:"l, d F, Y" }} at {{ date | time:"H:i:s" }}
        </body>
    </html>
    
  4. Fügen Sie am Anfang von views.py die folgende Importanweisung hinzu

    from django.shortcuts import render
    
  5. Ändern Sie ebenfalls in views.py die Funktion hello_there, um die Methode django.shortcuts.render zu verwenden, um eine Vorlage zu laden und den Vorlagenkontext bereitzustellen. Der Kontext ist die Menge der Variablen, die innerhalb der Vorlage verwendet werden können. Die Funktion render nimmt das Anforderungsobjekt, gefolgt vom Pfad zur Vorlage, *relativ zum templates-Ordner*, dann das Kontextobjekt. (Entwickler benennen Vorlagen typischerweise genauso wie die Funktionen, die sie verwenden, aber übereinstimmende Namen sind nicht erforderlich, da Sie im Code immer auf den exakten Dateinamen verweisen.)

    def hello_there(request, name):
        print(request.build_absolute_uri()) #optional
        return render(
            request,
            'hello/hello_there.html',
            {
                'name': name,
                'date': datetime.now()
            }
        )
    

    Sie können sehen, dass der Code jetzt viel einfacher ist und sich nur noch auf Datenwerte konzentriert, da das Markup und die Formatierung vollständig in der Vorlage enthalten sind.

  6. Starten Sie das Programm (innerhalb oder außerhalb des Debuggers, mit ⌃F5 (Windows, Linux Ctrl+F5)), navigieren Sie zu einer /hello/name-URL und beobachten Sie die Ergebnisse.

  7. Versuchen Sie auch, zu einer /hello/name-URL mit einem Namen wie <a%20value%20that%20could%20be%20HTML> zu navigieren, um das automatische Escaping von Django in Aktion zu sehen. Der "name"-Wert wird im Browser als reiner Text angezeigt, anstatt ein tatsächliches Element zu rendern.

Statische Dateien bereitstellen

Statische Dateien sind Inhaltsteile, die Ihre Web-App für bestimmte Anfragen unverändert zurückgibt, z. B. CSS-Dateien. Die Bereitstellung statischer Dateien erfordert, dass die Liste INSTALLED_APPS in settings.py django.contrib.staticfiles enthält, was standardmäßig enthalten ist.

Die Bereitstellung statischer Dateien in Django ist eine Kunst für sich, insbesondere bei der Bereitstellung in der Produktion. Was hier gezeigt wird, ist ein einfacher Ansatz, der mit dem Django-Entwicklungsserver und auch mit einem Produktionsserver wie Gunicorn funktioniert. Eine vollständige Behandlung von statischen Dateien geht jedoch über den Rahmen dieses Tutorials hinaus. Weitere Informationen finden Sie daher unter Verwaltung statischer Dateien in der Django-Dokumentation.

Wenn Sie zur Produktion wechseln, navigieren Sie zu settings.py, setzen Sie DEBUG=False und ändern Sie ALLOWED_HOSTS = ['*'], um bestimmte Hosts zuzulassen. Dies kann zu zusätzlichem Aufwand bei der Verwendung von Containern führen. Details dazu finden Sie unter Issue 13.

Bereiten Sie die App für statische Dateien vor

  1. Fügen Sie in der Datei web_project/urls.py des Projekts die folgende import-Anweisung hinzu

    from django.contrib.staticfiles.urls import staticfiles_urlpatterns
    
  2. Fügen Sie in derselben Datei am Ende die folgende Zeile hinzu, die Standard-URLs für statische Dateien in die Liste aufnimmt, die das Projekt erkennt

    urlpatterns += staticfiles_urlpatterns()
    

Verweisen Sie auf statische Dateien in einer Vorlage

  1. Erstellen Sie im Ordner hello einen Ordner namens static.

  2. Erstellen Sie innerhalb des Ordners static einen Unterordner namens hello, der dem App-Namen entspricht.

    Der Grund für diesen zusätzlichen Unterordner ist, dass beim Bereitstellen des Django-Projekts auf einem Produktionsserver alle statischen Dateien in einem einzigen Ordner gesammelt werden, der dann von einem dedizierten statischen Dateiserver bereitgestellt wird. Der Unterordner static/hello stellt sicher, dass die statischen Dateien der App beim Sammeln in einem App-spezifischen Unterordner liegen und nicht mit Dateien aus anderen Apps im selben Projekt kollidieren.

  3. Erstellen Sie im Ordner static/hello eine Datei namens site.css mit dem folgenden Inhalt. Beachten Sie nach der Eingabe dieses Codes auch die Syntaxhervorhebung, die VS Code für CSS-Dateien bietet, einschließlich einer Farbvorschau.

    .message {
        font-weight: 600;
        color: blue;
    }
    
  4. Fügen Sie in templates/hello/hello_there.html die folgenden Zeilen nach dem <title>-Element hinzu. Das Tag {% load static %} ist eine benutzerdefinierte Django-Vorlagentag-Sammlung, die es Ihnen ermöglicht, {% static %} zu verwenden, um auf eine Datei wie die Stylesheet zu verweisen.

    {% load static %}
    <link rel="stylesheet" type="text/css" href="{% static 'hello/site.css' %}" />
    
  5. Ersetzen Sie in templates/hello/hello_there.html ebenfalls den Inhalt des <body>-Elements durch das folgende Markup, das die message-Klasse anstelle eines <strong>-Tags verwendet

    <span class="message">Hello, there {{ name }}!</span> It's {{ date | date:'l, d F, Y' }} at {{ date | time:'H:i:s' }}.
    
  6. Starten Sie die App, navigieren Sie zu einer /hello/name-URL und beobachten Sie, dass die Nachricht in Blau gerendert wird. Stoppen Sie die App, wenn Sie fertig sind.

Verwenden Sie den Befehl collectstatic

Für Produktionsbereitstellungen sammeln Sie typischerweise alle statischen Dateien Ihrer Apps mit dem Befehl python manage.py collectstatic in einem einzigen Ordner. Sie können dann einen dedizierten statischen Dateiserver verwenden, um diese Dateien bereitzustellen, was typischerweise zu einer besseren Gesamtleistung führt. Die folgenden Schritte zeigen, wie diese Sammlung erfolgt, obwohl Sie die Sammlung bei der Ausführung mit dem Django-Entwicklungsserver nicht verwenden.

  1. Fügen Sie in web_project/settings.py die folgende Zeile hinzu, die einen Speicherort definiert, an dem statische Dateien gesammelt werden, wenn Sie den Befehl collectstatic verwenden

    STATIC_ROOT = BASE_DIR / 'static_collected'
    
  2. Führen Sie im Terminal den Befehl python manage.py collectstatic aus und beobachten Sie, dass hello/site.css in den Ordner static_collected der obersten Ebene neben manage.py kopiert wird.

  3. In der Praxis führen Sie collectstatic jedes Mal aus, wenn Sie statische Dateien ändern, und vor der Bereitstellung in der Produktion.

Erstellen Sie mehrere Vorlagen, die eine Basisvorlage erweitern

Da die meisten Web-Apps mehr als eine Seite haben und diese Seiten typischerweise viele gemeinsame Elemente teilen, trennen Entwickler diese gemeinsamen Elemente in eine Basis-Seiten-Vorlage, die andere Seiten-Vorlagen dann erweitern. (Dies wird auch als Vorlagenvererbung bezeichnet, d. h., die erweiterten Seiten erben Elemente von der Basis-Seite.)

Da Sie wahrscheinlich viele Seiten erstellen werden, die dieselbe Vorlage erweitern, ist es hilfreich, einen Code-Schnipsel in VS Code zu erstellen, mit dem Sie neue Seiten-Vorlagen schnell initialisieren können. Ein Schnipsel hilft Ihnen, mühsame und fehleranfällige Kopier-Einfüge-Vorgänge zu vermeiden.

Die folgenden Abschnitte führen Sie durch verschiedene Teile dieses Prozesses.

Erstellen Sie eine Basis-Seiten-Vorlage und Stile

Eine Basis-Seiten-Vorlage in Django enthält alle gemeinsamen Teile einer Reihe von Seiten, einschließlich Verweisen auf CSS-Dateien, Skriptdateien und so weiter. Basisvorlagen definieren auch ein oder mehrere Block-Tags mit Inhalten, die erweiterte Vorlagen voraussichtlich überschreiben werden. Ein Block-Tag wird in der Basisvorlage und in erweiterten Vorlagen durch {% block <name> %} und {% endblock %} abgegrenzt.

Die folgenden Schritte demonstrieren die Erstellung einer Basisvorlage.

  1. Erstellen Sie im Ordner templates/hello eine Datei namens layout.html mit den folgenden Inhalten, die Blöcke namens "title" und "content" enthält. Wie Sie sehen, definiert das Markup eine einfache Navigationsleistenstruktur mit Links zu den Seiten Home, About und Contact, die Sie in einem späteren Abschnitt erstellen. Beachten Sie die Verwendung des Django-Tags {% url %}, um auf andere Seiten über die Namen der entsprechenden URL-Muster statt über relative Pfade zu verweisen.

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8"/>
        <title>{% block title %}{% endblock %}</title>
        {% load static %}
        <link rel="stylesheet" type="text/css" href="{% static 'hello/site.css' %}"/>
    </head>
    
    <body>
    <div class="navbar">
        <a href="{% url 'home' %}" class="navbar-brand">Home</a>
        <a href="{% url 'about' %}" class="navbar-item">About</a>
        <a href="{% url 'contact' %}" class="navbar-item">Contact</a>
    </div>
    
    <div class="body-content">
        {% block content %}
        {% endblock %}
        <hr/>
        <footer>
            <p>&copy; 2018</p>
        </footer>
    </div>
    </body>
    </html>
    
  2. Fügen Sie die folgenden Stile zu static/hello/site.css unterhalb des vorhandenen "message"-Stils hinzu und speichern Sie die Datei. (Dieses Tutorial versucht nicht, responsives Design zu demonstrieren; diese Stile erzeugen einfach ein einigermaßen interessantes Ergebnis.)

    .navbar {
        background-color: lightslategray;
        font-size: 1em;
        font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
        color: white;
        padding: 8px 5px 8px 5px;
    }
    
    .navbar a {
        text-decoration: none;
        color: inherit;
    }
    
    .navbar-brand {
        font-size: 1.2em;
        font-weight: 600;
    }
    
    .navbar-item {
        font-variant: small-caps;
        margin-left: 30px;
    }
    
    .body-content {
        padding: 5px;
        font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }
    

Sie können die App an diesem Punkt ausführen, aber da Sie die Basistemplates nirgendwo verwendet und keine Code-Dateien geändert haben, ist das Ergebnis dasselbe wie im vorherigen Schritt. Schließen Sie die restlichen Abschnitte ab, um die endgültige Wirkung zu erzielen.

Code-Snippet erstellen

Da die drei Seiten, die Sie im nächsten Abschnitt erstellen, layout.html erweitern, spart es Zeit, ein Code-Snippet zu erstellen, um eine neue Template-Datei mit dem entsprechenden Verweis auf die Basistemplate zu initialisieren. Ein Code-Snippet liefert ein konsistentes Stück Code aus einer einzigen Quelle, was Fehler vermeidet, die beim Kopieren und Einfügen aus vorhandenem Code entstehen können.

  1. Wählen Sie in VS Code im Menü Datei (Windows/Linux) oder Code (macOS) die Option Einstellungen > Benutzer-Snippets.

  2. Wählen Sie in der erscheinenden Liste html. (Die Option kann als "html.json" im Abschnitt Vorhandene Snippets der Liste erscheinen, wenn Sie zuvor Snippets erstellt haben.)

  3. Nachdem VS Code html.json geöffnet hat, fügen Sie den folgenden Code innerhalb der vorhandenen geschweiften Klammern hinzu. (Die hier nicht gezeigten erläuternden Kommentare beschreiben Details wie z. B., wie die Zeile $0 angibt, wo VS Code den Cursor nach dem Einfügen eines Snippets platziert.)

    "Django Tutorial: template extending layout.html": {
        "prefix": "djextlayout",
        "body": [
            "{% extends \"hello/layout.html\" %}",
            "{% block title %}",
            "$0",
            "{% endblock %}",
            "{% block content %}",
            "{% endblock %}"
        ],
    
        "description": "Boilerplate template that extends layout.html"
    },
    
  4. Speichern Sie die Datei html.json (⌘S (Windows, Linux Ctrl+S)).

  5. Nun, wann immer Sie beginnen, das Präfix des Snippets zu tippen, z. B. djext, bietet VS Code das Snippet als Autovervollständigungsoption an, wie im nächsten Abschnitt gezeigt. Sie können auch den Befehl Snippet einfügen verwenden, um ein Snippet aus einem Menü auszuwählen.

Weitere Informationen zu Code-Snippets im Allgemeinen finden Sie unter Erstellen von Snippets.

Verwenden Sie das Code-Snippet, um Seiten hinzuzufügen

Mit dem Code-Snippet können Sie schnell Templates für die Seiten Home, About und Contact erstellen.

  1. Erstellen Sie im Ordner templates/hello eine neue Datei namens home.html. Geben Sie dann djext ein, um zu sehen, wie das Snippet als Vervollständigung erscheint.

    Django tutorial: autocompletion for the djextlayout code snippet

    Wenn Sie die Vervollständigung auswählen, wird der Code des Snippets mit dem Cursor an der Einfügeposition des Snippets angezeigt.

    Django tutorial: insertion of the djextlayout code snippet

  2. Schreiben Sie am Einfügepunkt im Block "title" Home und im Block "content" <p>Home page for the Visual Studio Code Django tutorial.</p>, und speichern Sie dann die Datei. Diese Zeilen sind die einzigen eindeutigen Teile des erweiterten Seiten-Templates.

  3. Erstellen Sie im Ordner templates/hello about.html, verwenden Sie das Snippet, um das Boilerplate-Markup einzufügen, fügen Sie About us und <p>About page for the Visual Studio Code Django tutorial.</p> in die Blöcke "title" und "content" ein, und speichern Sie dann die Datei.

  4. Wiederholen Sie den vorherigen Schritt, um templates/hello/contact.html mit Contact us und <p>Contact page for the Visual Studio Code Django tutorial.</p> zu erstellen.

  5. Fügen Sie in der urls.py der App Routen für die Seiten /about und /contact hinzu. Beachten Sie, dass das Argument name der Funktion path den Namen definiert, mit dem Sie auf die Seite in den Tags {% url %} in den Templates verweisen.

    path("about/", views.about, name="about"),
    path("contact/", views.contact, name="contact"),
    
  6. Fügen Sie in views.py Funktionen für die Routen /about und /contact hinzu, die auf ihre jeweiligen Seiten-Templates verweisen. Ändern Sie auch die Funktion home, um das Template home.html zu verwenden.

    # Replace the existing home function with the one below
    def home(request):
        return render(request, "hello/home.html")
    
    def about(request):
        return render(request, "hello/about.html")
    
    def contact(request):
        return render(request, "hello/contact.html")
    

App ausführen

Mit allen Seiten-Templates an Ort und Stelle speichern Sie views.py, führen Sie die App aus und öffnen Sie einen Browser zur Startseite, um die Ergebnisse zu sehen. Navigieren Sie zwischen den Seiten, um zu überprüfen, ob die Seiten-Templates das Basistemplate korrekt erweitern.

Django tutorial: app rendering a common nav bar from the base template

Arbeiten mit Daten, Datenmodellen und Migrationen

Viele Webanwendungen arbeiten mit Daten, die in einer Datenbank gespeichert sind, und Django erleichtert die Darstellung dieser Datenbankobjekte mithilfe von Modellen. In Django ist ein Modell eine Python-Klasse, die von django.db.models.Model abgeleitet ist und ein bestimmtes Datenbankobjekt darstellt, typischerweise eine Tabelle. Sie platzieren diese Klassen in der Datei models.py einer App.

Mit Django arbeiten Sie fast ausschließlich über die in Code definierten Modelle mit Ihrer Datenbank. Djangos "Migrationen" kümmern sich dann automatisch um alle Details der zugrundeliegenden Datenbank, während Sie die Modelle im Laufe der Zeit weiterentwickeln. Der allgemeine Workflow sieht wie folgt aus:

  1. Änderungen an den Modellen in Ihrer Datei models.py vornehmen.
  2. Führen Sie python manage.py makemigrations aus, um Skripte im Ordner migrations zu generieren, die die Datenbank vom aktuellen Zustand in den neuen Zustand überführen.
  3. Führen Sie python manage.py migrate aus, um die Skripte auf die tatsächliche Datenbank anzuwenden.

Die Migrationsskripte erfassen effektiv alle inkrementellen Änderungen, die Sie im Laufe der Zeit an Ihren Datenmodellen vornehmen. Durch die Anwendung der Migrationen aktualisiert Django die Datenbank, um mit Ihren Modellen übereinzustimmen. Da jede inkrementelle Änderung ihr eigenes Skript hat, kann Django jede frühere Version einer Datenbank (einschließlich einer neuen Datenbank) automatisch auf die aktuelle Version migrieren. Daher müssen Sie sich nur um Ihre Modelle in models.py kümmern, nie um das zugrundeliegende Datenbankschema oder die Migrationsskripte. Diesen Teil erledigt Django!

Auch im Code arbeiten Sie ausschließlich mit Ihren Modellklassen, um Daten zu speichern und abzurufen. Django kümmert sich um die zugrunde liegenden Details. Die einzige Ausnahme ist, dass Sie Daten mithilfe des Django-Administrationswerkzeugs loaddata-Befehl in Ihre Datenbank schreiben können. Dieses Werkzeug wird oft verwendet, um einen Datensatz zu initialisieren, nachdem der Befehl migrate das Schema initialisiert hat.

Wenn Sie die Datei db.sqlite3 verwenden, können Sie auch direkt mit der Datenbank über ein Werkzeug wie den SQLite-Browser arbeiten. Es ist in Ordnung, Datensätze in Tabellen mit einem solchen Werkzeug hinzuzufügen oder zu löschen, aber vermeiden Sie Änderungen am Datenbankschema, da die Datenbank dann nicht mehr mit den Modellen Ihrer App synchron ist. Ändern Sie stattdessen die Modelle, führen Sie makemigrations aus, und dann migrate.

Datenbanktypen

Standardmäßig enthält Django eine Datei db.sqlite3 für die Datenbank einer App, die sich für die Entwicklungsarbeit eignet. Wie auf Wann SQLite verwenden (sqlite.org) beschrieben, funktioniert SQLite gut für Websites mit geringem bis mittlerem Traffic mit weniger als 100.000 Hits/Tag, wird aber bei höheren Volumina nicht empfohlen. Es ist auch auf einen einzelnen Computer beschränkt, sodass es nicht in Multi-Server-Szenarien wie Lastverteilung und Geo-Replikation verwendet werden kann.

Aus diesen Gründen sollten Sie Produktionsdatenbanken wie PostgreSQL, MySQL und SQL Server in Betracht ziehen. Informationen zur Unterstützung anderer Datenbanken durch Django finden Sie unter Datenbankeinrichtung. Sie können auch das Azure SDK für Python verwenden, um mit Azure-Speicherdiensten wie Tabellen und Blobs zu arbeiten.

Modelle definieren

Ein Django-Modell ist wiederum eine Python-Klasse, die von django.db.model.Models abgeleitet ist und die Sie in der Datei models.py der App platzieren. In der Datenbank erhält jedes Modell automatisch ein eindeutiges ID-Feld namens id. Alle anderen Felder werden als Eigenschaften der Klasse mithilfe von Typen aus django.db.models definiert, wie z. B. CharField (begrenzter Text), TextField (unbegrenzter Text), EmailField, URLField, IntegerField, DecimalField, BooleanField. DateTimeField, ForeignKey und ManyToMany, unter anderem. (Details finden Sie in der Referenz zu Model-Feldern in der Django-Dokumentation.)

Jedes Feld hat einige Attribute wie max_length. Das Attribut blank=True bedeutet, dass das Feld optional ist; null=true bedeutet, dass ein Wert optional ist. Es gibt auch ein Attribut choices, das Werte auf Werte in einem Array von Datenwert-/Anzeigewert-Tupeln beschränkt.

Fügen Sie beispielsweise die folgende Klasse in models.py hinzu, um ein Datenmodell zu definieren, das datierte Einträge in einem einfachen Nachrichtenprotokoll darstellt.

from django.db import models
from django.utils import timezone

class LogMessage(models.Model):
    message = models.CharField(max_length=300)
    log_date = models.DateTimeField("date logged")

    def __str__(self):
        """Returns a string representation of a message."""
        date = timezone.localtime(self.log_date)
        return f"'{self.message}' logged on {date.strftime('%A, %d %B, %Y at %X')}"

Eine Modellklasse kann Methoden enthalten, die Werte zurückgeben, die aus anderen Klasseneigenschaften berechnet werden. Modelle enthalten typischerweise eine Methode __str__, die eine String-Darstellung der Instanz zurückgibt.

Datenbank migrieren

Da Sie Ihre Datenmodelle durch Bearbeiten von models.py geändert haben, müssen Sie die Datenbank selbst aktualisieren. Öffnen Sie in VS Code ein Terminal mit aktiviertem virtuellen Umgebungsmodus (verwenden Sie den Befehl Terminal: Neues Terminal erstellen, ⌃⇧` (Windows, Linux Ctrl+Shift+`))), navigieren Sie zum Projektordner und führen Sie die folgenden Befehle aus:

python manage.py makemigrations
python manage.py migrate

Schauen Sie in den Ordner migrations, um die Skripte zu sehen, die makemigrations generiert. Sie können auch die Datenbank selbst ansehen, um zu sehen, dass das Schema aktualisiert wurde.

Wenn Sie beim Ausführen der Befehle Fehler sehen, stellen Sie sicher, dass Sie kein Debugging-Terminal verwenden, das von vorherigen Schritten übrig geblieben ist, da diese möglicherweise nicht die virtuelle Umgebung aktiviert haben.

Datenbank über die Modelle verwenden

Mit Ihren Modellen an Ort und Stelle und der migrierten Datenbank können Sie Daten mithilfe Ihrer Modelle speichern und abrufen. In diesem Abschnitt fügen Sie der App eine Formularseite hinzu, über die Sie eine Nachricht protokollieren können. Anschließend ändern Sie die Startseite, um diese Nachrichten anzuzeigen. Da Sie hier viele Code-Dateien ändern, achten Sie auf die Details.

  1. Erstellen Sie im Ordner hello (wo sich views.py befindet) eine neue Datei namens forms.py mit dem folgenden Code, der ein Django-Formular definiert, das ein Feld aus dem Datenmodell LogMessage enthält.

    from django import forms
    from hello.models import LogMessage
    
    class LogMessageForm(forms.ModelForm):
        class Meta:
            model = LogMessage
            fields = ("message",)   # NOTE: the trailing comma is required
    
  2. Erstellen Sie im Ordner templates/hello ein neues Template namens log_message.html mit den folgenden Inhalten, das davon ausgeht, dass dem Template eine Variable namens form übergeben wird, um den Inhalt des Formulars zu definieren. Es fügt dann eine Submit-Schaltfläche mit der Beschriftung "Log" hinzu.

    {% extends "hello/layout.html" %}
    {% block title %}
        Log a message
    {% endblock %}
    {% block content %}
        <form method="POST" class="log-form">
            {% csrf_token %}
            {{ form.as_p }}
            <button type="submit" class="save btn btn-default">Log</button>
        </form>
    {% endblock %}
    

    Hinweis: Das Tag {% csrf_token %} von Django bietet Schutz vor Cross-Site-Request-Forging. Einzelheiten finden Sie unter Schutz vor Cross-Site-Request-Forging in der Django-Dokumentation.

  3. Fügen Sie in der Datei static/hello/site.css der App eine Regel hinzu, um das Eingabeformular breiter zu machen.

    input[name=message] {
        width: 80%;
    }
    
  4. Fügen Sie in der urls.py der App eine Route für die neue Seite hinzu.

    path("log/", views.log_message, name="log"),
    
  5. Definieren Sie in views.py die View namens log_message (wie von der URL-Route referenziert). Diese View behandelt sowohl HTTP-GET- als auch POST-Fälle. Im GET-Fall (Abschnitt else:) zeigt sie einfach das Formular an, das Sie in den vorherigen Schritten definiert haben. Im POST-Fall ruft sie die Daten aus dem Formular in ein Datenobjekt (message) ab, setzt den Zeitstempel und speichert dann dieses Objekt, woraufhin es in die Datenbank geschrieben wird.

    # Add these to existing imports at the top of the file:
    from django.shortcuts import redirect
    from hello.forms import LogMessageForm
    from hello.models import LogMessage
    
    # Add this code elsewhere in the file:
    def log_message(request):
        form = LogMessageForm(request.POST or None)
    
        if request.method == "POST":
            if form.is_valid():
                message = form.save(commit=False)
                message.log_date = datetime.now()
                message.save()
                return redirect("home")
        else:
            return render(request, "hello/log_message.html", {"form": form})
    
  6. Ein letzter Schritt, bevor Sie alles ausprobieren können! Fügen Sie in templates/hello/layout.html im Div "navbar" einen Link für die Nachrichtenprotokollseite hinzu.

    <!-- Insert below the link to Home -->
    <a href="{% url 'log' %}" class="navbar-item">Log Message</a>
    
  7. Führen Sie die App aus und öffnen Sie einen Browser zur Startseite. Wählen Sie den Link Log Message in der Navigationsleiste aus, der die Nachrichtenprotokollseite anzeigen sollte.

    Django tutorial: the message logging page added to the app

  8. Geben Sie eine Nachricht ein, wählen Sie Log, und Sie sollten zur Startseite zurückgeleitet werden. Die Startseite zeigt noch keine der protokollierten Nachrichten an (was Sie gleich beheben werden). Protokollieren Sie ruhig noch ein paar weitere Nachrichten. Wenn Sie möchten, schauen Sie in der Datenbank mit einem Werkzeug wie dem SQLite-Browser nach, um zu sehen, dass Datensätze erstellt wurden. Öffnen Sie die Datenbank im schreibgeschützten Modus, oder schließen Sie die Datenbank auf jeden Fall, bevor Sie die App verwenden, da die App sonst fehlschlägt, weil die Datenbank gesperrt ist.

  9. Stoppen Sie die App, wenn Sie fertig sind.

  10. Ändern Sie nun die Startseite, um die protokollierten Nachrichten anzuzeigen. Beginnen Sie damit, den Inhalt der Datei templates/hello/home.html der App durch das folgende Markup zu ersetzen. Dieses Template erwartet eine Kontextvariable namens message_list. Wenn es eine erhält (geprüft mit dem Tag {% if message_list %}), iteriert es über diese Liste (Tag {% for message in message_list %}), um Tabellenzeilen für jede Nachricht zu generieren. Andernfalls zeigt die Seite an, dass noch keine Nachrichten protokolliert wurden.

    {% extends "hello/layout.html" %}
    {% block title %}
        Home
    {% endblock %}
    {% block content %}
        <h2>Logged messages</h2>
    
        {% if message_list %}
            <table class="message_list">
                <thead>
                <tr>
                    <th>Date</th>
                    <th>Time</th>
                    <th>Message</th>
                </tr>
                </thead>
                <tbody>
                {% for message in message_list %}
                    <tr>
                        <td>{{ message.log_date | date:'d M Y' }}</td>
                        <td>{{ message.log_date | time:'H:i:s' }}</td>
                        <td>
                            {{ message.message }}
                        </td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        {% else %}
            <p>No messages have been logged. Use the <a href="{% url 'log' %}">Log Message form</a>.</p>
        {% endif %}
    {% endblock %}
    
  11. Fügen Sie in static/hello/site.css eine Regel hinzu, um die Tabelle etwas zu formatieren.

    .message_list th,td {
        text-align: left;
        padding-right: 15px;
    }
    
  12. Importieren Sie in views.py die generische ListView-Klasse von Django, die wir zur Implementierung der Startseite verwenden werden.

    from django.views.generic import ListView
    
  13. Importieren Sie auch in views.py die Funktion home durch eine Klasse namens HomeListView, die von ListView abgeleitet ist, sich an das Modell LogMessage bindet und eine Funktion get_context_data implementiert, um den Kontext für das Template zu generieren.

    # Remove the old home function if you want; it's no longer used
    
    class HomeListView(ListView):
        """Renders the home page, with a list of all messages."""
        model = LogMessage
    
        def get_context_data(self, **kwargs):
            context = super(HomeListView, self).get_context_data(**kwargs)
            return context
    
  14. Importieren Sie in der urls.py der App das Datenmodell.

    from hello.models import LogMessage
    
  15. Importieren Sie auch in urls.py eine Variable für die neue View, die die fünf neuesten LogMessage-Objekte in absteigender Reihenfolge abruft (d. h. sie fragt die Datenbank ab) und dann einen Namen für die Daten im Template-Kontext (message_list) bereitstellt und das zu verwendende Template identifiziert.

    home_list_view = views.HomeListView.as_view(
        queryset=LogMessage.objects.order_by("-log_date")[:5],  # :5 limits the results to the five most recent
        context_object_name="message_list",
        template_name="hello/home.html",
    )
    
  16. Ändern Sie in urls.py den Pfad zur Startseite, um die Variable home_list_view zu verwenden.

        # Replace the existing path for ""
        path("", home_list_view, name="home"),
    
  17. Starten Sie die App und öffnen Sie einen Browser zur Startseite, die nun Nachrichten anzeigen sollte.

    Django tutorial: app home page displaying message from the database

  18. Stoppen Sie die App, wenn Sie fertig sind.

Verwenden Sie den Debugger mit Seiten-Vorlagen

Wie im vorherigen Abschnitt gezeigt, können Seiten-Templates neben passiven, deklarativen Elementen wie {% url %} und {% block %} auch prozedurale Anweisungen wie {% for message in message_list %} und {% if message_list %} enthalten. Infolgedessen können Sie wie bei jedem anderen prozeduralen Code auch Programmierfehler innerhalb von Templates haben.

Glücklicherweise bietet die Python-Erweiterung für VS Code Template-Debugging, wenn "django": true in der Debugging-Konfiguration vorhanden ist (wie Sie es bereits haben). Die folgenden Schritte demonstrieren diese Funktion.

  1. Setzen Sie in templates/hello/home.html Breakpoints sowohl für die Zeile {% if message_list %} als auch für die Zeile {% for message in message_list %}, wie durch die gelben Pfeile im folgenden Bild angezeigt.

    Django tutorial: breakpoints set in a Django page template

  2. Führen Sie die App im Debugger aus und öffnen Sie einen Browser zur Startseite. (Wenn Sie den Debugger bereits ausführen, müssen Sie die App nach dem Setzen von Breakpoints nicht neu starten; aktualisieren Sie einfach die Seite.) Beobachten Sie, dass VS Code im Debugger im Template bei der Anweisung {% if %} unterbrochen wird und alle Kontextvariablen im Bereich Variablen anzeigt.

    Django tutorial: debugger stopped at breakpoints in the page template

  3. Verwenden Sie den Befehl Schritt über (F10), um durch den Template-Code zu navigieren. Beobachten Sie, dass der Debugger alle deklarativen Anweisungen überspringt und bei prozeduralem Code anhält. Beispielsweise können Sie beim Durchlaufen der Schleifen {% for message in message_list %} jeden Wert in message untersuchen und zu Zeilen wie <td>{{ message.log_date | date:'d M Y' }}</td> springen.

  4. Sie können auch mit Variablen im Bereich Debug-Konsole arbeiten. (Django-Filter wie date sind jedoch derzeit nicht in der Konsole verfügbar.)

  5. Wenn Sie bereit sind, wählen Sie Fortfahren (F5), um die Ausführung der App fortzusetzen und die gerenderte Seite im Browser anzuzeigen. Stoppen Sie den Debugger, wenn Sie fertig sind.

Optionale Aktivitäten

Die folgenden Abschnitte beschreiben zusätzliche Schritte, die für Ihre Arbeit mit Python und Visual Studio Code hilfreich sein könnten.

Erstellen Sie eine requirements.txt-Datei für die Umgebung

Wenn Sie Ihren App-Code über die Quellcodeverwaltung oder auf andere Weise teilen, macht es keinen Sinn, alle Dateien in einer virtuellen Umgebung zu kopieren, da Empfänger diese Umgebung jederzeit selbst wiederherstellen können.

Daher lassen Entwickler normalerweise den Ordner der virtuellen Umgebung aus der Quellcodeverwaltung weg und beschreiben stattdessen die Abhängigkeiten der App mithilfe einer requirements.txt-Datei.

Obwohl Sie die Datei manuell erstellen können, können Sie auch den Befehl pip freeze verwenden, um die Datei basierend auf den exakten Bibliotheken zu generieren, die in der aktivierten Umgebung installiert sind.

  1. Wählen Sie Ihre bevorzugte Umgebung mit dem Befehl Python: Interpreter auswählen aus und führen Sie dann den Befehl Terminal: Neues Terminal erstellen (⌃⇧` (Windows, Linux Ctrl+Shift+`))) aus, um ein Terminal mit dieser aktivierten Umgebung zu öffnen.

  2. Führen Sie im Terminal pip freeze > requirements.txt aus, um die Datei requirements.txt in Ihrem Projektordner zu erstellen.

Jeder (oder jeder Build-Server), der eine Kopie des Projekts erhält, muss nur den Befehl pip install -r requirements.txt ausführen, um die Pakete, von denen die App abhängt, innerhalb der aktiven Umgebung neu zu installieren.

Hinweis: pip freeze listet alle Python-Pakete auf, die Sie in der aktuellen Umgebung installiert haben, einschließlich Pakete, die Sie derzeit nicht verwenden. Der Befehl listet auch Pakete mit exakten Versionsnummern auf, die Sie möglicherweise für mehr Flexibilität in Zukunft in Bereiche umwandeln möchten. Weitere Informationen finden Sie unter Requirements Files in der Dokumentation des pip-Befehls.

Einen Superuser erstellen und die administrative Oberfläche aktivieren

Standardmäßig bietet Django eine administrative Oberfläche für eine Web-App, die durch Authentifizierung geschützt ist. Die Schnittstelle wird über die integrierte App django.contrib.admin implementiert, die standardmäßig in der Liste INSTALLED_APPS des Projekts (settings.py) enthalten ist, und die Authentifizierung wird mit der integrierten App django.contrib.auth gehandhabt, die ebenfalls standardmäßig in INSTALLED_APPS enthalten ist.

Führen Sie die folgenden Schritte aus, um die administrative Oberfläche zu aktivieren:

  1. Erstellen Sie ein Superuser-Konto in der App, indem Sie ein Terminal in VS Code für Ihre virtuelle Umgebung öffnen und dann den Befehl python manage.py createsuperuser --username=<username> --email=<email> ausführen, wobei Sie <username> und <email> natürlich durch Ihre persönlichen Informationen ersetzen. Wenn Sie den Befehl ausführen, fordert Django Sie auf, Ihr Passwort einzugeben und zu bestätigen.

    Merken Sie sich unbedingt Ihre Benutzername-Passwort-Kombination. Dies sind die Anmeldedaten, die Sie für die Authentifizierung bei der App verwenden.

  2. Fügen Sie die folgende URL-Route in der urls.py auf Projektebene (im Tutorial web_project/urls.py) hinzu, um auf die integrierte administrative Schnittstelle zu verweisen.

    # This path is included by default when creating the app
     path("admin/", admin.site.urls),
    
  3. Führen Sie den Server aus und öffnen Sie dann einen Browser zur /admin-Seite der App (z. B. http://127.0.0.1:8000/admin bei Verwendung des Entwicklungsservers).

  4. Eine Anmeldeseite wird angezeigt, bereitgestellt von django.contrib.auth. Geben Sie Ihre Superuser-Zugangsdaten ein.

    Django tutorial: default Django login prompt

  5. Sobald Sie authentifiziert sind, sehen Sie die Standardadministrationsseite, über die Sie Benutzer und Gruppen verwalten können.

    Django tutorial: the default Django administrative interface

Sie können die administrative Schnittstelle beliebig anpassen. Sie könnten zum Beispiel Funktionen zum Bearbeiten und Löschen von Einträgen in der Datenbank bereitstellen. Weitere Informationen zur Durchführung von Anpassungen finden Sie in der Django-Admin-Site-Dokumentation.

Erstellen Sie einen Container für eine Django-App mit der Container Tools-Erweiterung

Die Container Tools-Erweiterung erleichtert das Erstellen, Verwalten und Bereitstellen von containerisierten Anwendungen aus Visual Studio Code. Wenn Sie daran interessiert sind, wie Sie einen Python-Container für die in diesem Tutorial entwickelte Django-App erstellen können, lesen Sie das Tutorial Python in einem Container, das Sie durch Folgendes führt:

  • Erstellen einer Dockerfile-Datei, die einen einfachen Python-Container beschreibt.
  • Erstellen, Ausführen und Überprüfen der Funktionalität einer Django-App.
  • Debuggen der App, die in einem Container ausgeführt wird.

Nächste Schritte

Herzlichen Glückwunsch zum Abschluss dieses Tutorials zur Arbeit mit Django in Visual Studio Code!

Das fertige Code-Projekt aus diesem Tutorial finden Sie auf GitHub: python-sample-vscode-django-tutorial.

In diesem Tutorial haben wir nur an der Oberfläche dessen gekratzt, was Django alles kann. Besuchen Sie unbedingt die Django-Dokumentation und das offizielle Django-Tutorial für viele weitere Details zu Views, Templates, Datenmodellen, URL-Routing, der administrativen Oberfläche, der Verwendung anderer Datenbanktypen, der Bereitstellung in der Produktion und mehr.

Um Ihre App auf einer Produktionswebsite auszuprobieren, lesen Sie das Tutorial Python-Apps mit Docker-Containern in Azure App Service bereitstellen. Azure bietet auch einen Standardcontainer, App Service unter Linux, in den Sie Web-Apps direkt aus VS Code bereitstellen.

Möglicherweise möchten Sie auch die folgenden Artikel in den VS Code-Dokumenten lesen, die für Python relevant sind.

© . This site is unofficial and not affiliated with Microsoft.