Packages installieren; in CMD: pip install django
& pip install djangorestframework
VSCode Extension installieren: Django (Siehe Extension Beschreibung, um Django-HTML Highlighting in HTML-Dokumenten einzuschalten. Unter Umständen muss Django-HTML danach noch als Standard-Format für HTML Dateien eingestellt werden.)
- http://127.0.0.1:8000
- http://127.0.0.1:8000/admin ([email protected], adminadmin)
- http://127.0.0.1:8000/login ([email protected], testuser1)
- http://127.0.0.1:8000/register
- http://127.0.0.1:8000/sampleGame
- http://127.0.0.1:8000/api/games
py manage.py runserver [port]
(in noodle_grounds/)
-
HTML Template anlegen: Eine
/games/templates/games/<spielname>.html
Datei anlegen. Siehe sampleGame.html, Gerüst kann einfach kopiert werden. -
Ordner für statische Dateien anlegen: Einen
/games/static/games/<spielname>
Ordner anlegen. Hier sollten alle .js, .css, .png... Dateien gespeichert werden, auf welche die <spielname>.html verweist. -
View anlegen:
def <spielname>:
Funktion in games/views.py anlegen. Siehedef sampleGame:
; Funktionsinhalt kann kopiert werden, nur der Spielname sollte in den Strings angepasst werden. Die View bestimmt, welche Response an den Client geschickt werden soll; in diesem Fall eine gerenderte HTML-Datei. -
URL-Routing einrichten:
- In
/noodle_grounds/urls.py
zunächst view importieren. (from games.views import sampleGame, <spielname>
) - Dann in urlpatterns Liste speichern:
path('<spielname', <spielname>, name="<spielname>")
(urlpattern zeigt nun auf View, und View verarbeitet die Client-Request und schickt über return eine Response) - Das URL-Routing bestimmt, welche View bei welchem URL-Aufruf geladen werden soll. In unserem Fall die View unseres Spiels, da diese die HTML-Seite für das Spiel returned.
- Spiel in Datenbank anlegen. Am einfachsten zu erledigen im Admin-Panel: http://127.0.0.1:8000/admin (email: [email protected], pw: adminadmin).
-
Django HTML-Templating Language: https://docs.djangoproject.com/en/4.1/ref/templates/language/
-
App: Jeder Ordner außer noodle_grounds (also /core/, /games/ und /api/) ist eine "App". Sinn dahinter ist, dass verschiedene Komponenten von einander separat gehalten werden. Jede App hat eigene Views, eigene HTML-Templates, eigene Static-Files, unter Umständen eigenes URL-Routing und eigene Datenbank-Modelle, etc. In unserem Fall besitzt /core/ und /games/ eigene Views, HTML und Static-Files, und /api/ nur eine eigene View. URL-Routing wird in unserem Fall global über eine einzige urls.py in /noodle_grounds/ gehandelt. /noodle_grounds/ beinhaltet projektübergreifende Einstellungsdateien.
-
models.py: Hier wird das Datenbankschema/die Datenbankmodelle definiert. Jede Klasse = Ein Table, jedes Attribut = Eine Spalte. models.py kann in jeder App existieren. Nachdem models.py angepasst wurde (also effektiv Datenbankschma verändert wurde), muss
py manage.py makemigrations
undpy manage.py migrate
ausgeführt werden. https://docs.djangoproject.com/en/4.2/intro/tutorial02/ -
/templates/ Ordner: Für alle HTML-Dateien. Diese werden in views.py in render() geladen. /templates/ Ordner kann in jeder App existieren.*
-
/static/ Ordner: Für alles, was nicht .html ist; daher .js, .css, .png... Wenn zB
static/games/noodleJump/thumb.png
Datei geladen werden soll, würde dies über<img src="{% static 'games/noodleJump/thumb.png' %}">
geschehen. Der Template-Ausdruck wird vom Server dann durch den korrekten Pfad zur statischen Datei ersetzt. (Wichtig, da statische Dateien im Realfall oft auf eigene Server mit eigenen Pfadstrukturen ausgelagert werden) /static/ Ordner kann in jeder App existieren.* Notiz: Wird {% static '' %} Template-Funktion verwendet, muss in der ersten Zeile der .html-Datei {% load static %} aufgerufen werden.
* Django sieht alle /static/ und /template/ Ordner als einen einzelnen Ordner. Gibt es also games/static/game.png
und core/static/core.png
, wird in einer HTML-Datei darauf immer über {% static 'game.png' %} und {% static 'core.png' %} zugegriffen, ohne auf Elternordner zu verweisen. Namespacing möglich über Unterordner: Wenn Pfad nun aussieht wie games/static/games/game.png
und core/static/core/core.png
, dann kann zugegriffen werden über {% static 'games/game.png' %} und {% static 'core/core.png' %}: Keine Kollisionsgefahr.