Schon lange habe ich überlegt eine Tutorial Reihe zu starten in einem solchen Bereich, aber auch überlegt worüber.
Ja es gibt da draußen unzählige Anleitungen dazu, es wird ja auch in der offiziellen Dokumentation erklärt, mein Ziel in dieser Reihe ist jedoch die Umsetzung einer einfachen Web-Anwendung in Form eines Artikel-Systems zu begleiten, inklusive der Umsetzung eines CRUD-Admin Panels.
Vorbereitungen
In dieser Tutorial-Reihe gehe ich davon aus das die Grundlegende Entwicklungsumgebung schon existiert (z.B. mittels Laravel Herd, Laragon oder selbst installiert) und folgendes bietet:
- PHP 8.3
- Ctype Extension
- cURL-Extension
- DOM-Extension
- Fileinfo Extension
- Filter Extension
- Hash Extension
- Mbstring Extension
- OpenSSL Extension
- PCRE-Extension
- PDO-Extension
- Session Extension
- Tokenizer Extension
- XML-Extension
- NGINX
- Redis
- SQL-Server wie MySQL/PostgreSQL (oder SQLite)
- Composer
- NodeJS LTS
Sollte es diesbezüglich aber Fragen geben, wie man das selbst einrichtet, könnte ich das Thema mal aufgreifen.
Projekt anlegen
Ein neues Laravel Projekt anzulegen, geht recht einfach, da die Methode via Composer nicht mehr empfohlen wird behandle ich hier nur wie man es mit dem Laravel Installer durchführt.
Zum Starten installieren wir uns mittels Composer den Laravel Installer: composer global require laravel/installer
Anschließend kann man mit laravel new appname die Erstellung und Anlegung eines Projektes starten, wobei appname der Name des Ordners ist unter dem es angelegt wird.
Hier kommt dann schon die erste Frage, ob wir ein Starter Kit möchten oder nicht.
Ein Starter Kit beinhaltet einige Beispiele wie zB eine Registrierung, Dashboard, TOTP und mehr. Für den Anfang ist Laravel Breeze ein guter Einstieg um sich mit den Grundlagen zu beschäftigen, aber auch nicht bei Null anfangen zu müssen.
Ich wähle in diesem Tutorial "Vue with Inertia", da dies auch mein bevorzugter Tech-Stack ist, der vollständigkeit aber hier eine kurze Erklärung was welcher Tech-Stack beinhaltet und womit es grob arbeitet:
- Blade with Alpine
- Blade als Template-Engine (Standard von Laravel)
- Alpine für Reaktive Komponenten (JavaScript)
- Livewire (Volt Class API) with Alpine
- Blade als Template-Engine
- Livewire mit Laravel Volt (Reaktive Funktionen, JS über PHP)
- Alpine (Für Livewire, aber kann auch selbst genutzt werden)
- Livewire (Volt Functional API) with Alpine
- Ähnlich wie zuvor, aber ein wenig anders vom Aufbau
- React with Inertia
- React fürs Frontend (JavaScript/TypeScript)
- Inertia als Vermittler
- Laravel im Backend
- Vue with Inertia
- Vue fürs Frontend (JavaScript/TypeScript)
- Inertia als Vermittler
- Laravel im Backend
- API only
- Nur API, kein Frontend oder ähnliches
Hier muss ich zugeben, das ich vor dem erscheinen von Laravel Volt auf Inertia umgestiegen bin und daher damit nicht viel Erfahrung habe zum aktuellen Zeitpunkt, weswegen die Erklärung dafür auch etwas arg mager ausgefallen ist.
Im nächsten Schritt können wir zusätzliche Features auswählen, wie Dark Mode, SSR, TypeScript und ESLint. Ausgewählt wird dies jeweils mittels Leertaste und am Ende mit der Enter-Taste bestätigt.
Persönlich wähle ich hier nur Dark Mode und Inertia SSR aus, somit werden alle Templates der Komponenten direkt mit der Möglichkeit für Dark Mode erstellt, Inertia SSR ist die Möglichkeit mittels Inertia Vue/React Teile der App auf dem Server zu rendern (SSR = Server Side Rendering).
Zuletzt bevor die Installation beginnt, wird noch gefragt mit welchem Test-Framework man arbeiten möchte, persönlich wähle ich hier immer Pest, wem PHPUnit in Rohform besser gefällt darf natürlich auch dies verwenden!
Nach der Installation kommt noch eine Abfrage: Welche Datenbank willst du verwenden?
Für MySQL/MariaDB, PostgreSQL und SQL Server brauchts entsprechende zusätzliche Software auf deinem System. Willst du für die lokale Entwicklung es einfach haben, nimm SQLite (das nutze ich derweil des öfteren für kleine Projekte, da es das Anlegen einer Datenbank etc nicht erfordert).
Nach der Auswahl der Datenbank wirst du gefragt ob du die im Umfang des Starter Kits enthaltenen Migrationen durchführen möchtest. Für dieses Tutorial beantworten wir diese Frage kurzum mit: Ja!
Im Anschluss werden die Migrationen durchgeführt, die NodeJS Abhängigkeiten installiert und mittels ViteJS die Assets kompiliert erstmalig.
Anschließend kann man mit cd appname das Projekt betreten und mittels composer run dev auch direkt starten!
Nach dem öffnen der Seite begrüßt euch dann die folgende Ansicht:
Wer es etwas einfacher möchte, kann sich zB auch via NGINX das ganze lokal anlegen und man ist nicht mehr auf den PHP Dev-Server angewiesen.
Für diesen Part des Tutorials war es das aber erst einmal. Im nächsten Teil geht es dann an die Erstellung eines einfachen Artikel-Systems.