In den letzten Wochen haben wir unsere Webseite von 2020 komplett modernisiert. Dabei haben wir nicht nur Bootstrap durch Tailwind CSS ersetzt, sondern auch die statische Laravel-Seite durch eine dynamischere Version ausgetauscht. Als Entwickler oder Freelancer ist es wichtig, seine Online-Präsenz immer aktuell zu halten, besonders wenn es um die eigene Portfolio-Webseite geht.
Unsere vorherige Webseite war statisch, was eine Erweiterung erschwerte. Alle Daten waren in Laravel Übersetzungsdateien oder Konfigurationen gespeichert. Mit unserem neuen System haben wir alle Daten in einer MySQL-Datenbank abgelegt und können sie nun dank Laravel Nova einfach erweitern und verwalten.
Wir haben uns für Tailwind CSS entschieden, um das Frontend so dynamisch zu gestalten wie das Backend. Außerdem können wir mit Tailwind CSS ansprechendere und benutzerfreundlichere Layouts erstellen.
Unsere neue Webseite setzt auf einer Kombination aus Laravel, Inertia und Tailwind CSS.
- Laravel ist ein PHP-Framework, das uns eine schnelle und robuste Portfolio-Webseite ermöglicht.
- Inertia ermöglicht uns die Vorteile von Single-Page-Anwendungen zu nutzen, ohne eine separate API erstellen zu müssen. Inertia gibt die Daten an Vue.js weiter.
- Tailwind CSS ist ein CSS-Framework, das uns schnelle und ansprechende Layouts ermöglicht.
Laravel Packages
Neben diesen Kern-Technologien haben wir auch einige Laravel-Packages eingesetzt, darunter von vielen von Spatie. Hier sind einige Empfehlungen, um eine Webseite schnell und effektiv aufzubauen:
1. Schema-org: github.com/spatie/schema-org
Schema-org ermöglicht es, Daten im JSON+LD-Format darzustellen und an das Theme weiterzugeben. So können wir Projekte, Personen und Partner strukturiert an die Suchmaschinen übergeben.
2. Sitemap: github.com/spatie/laravel-sitemap
Eine Sitemap ist eine der wichtigsten Seiten, um sicherzustellen, dass Suchmaschinen alle relevanten Seiten schnell finden. Das Package von Spatie
3. Sortable: github.com/spatie/eloquent-sortable
Um Projekte oder Merkmale auf unserer Seite anzuzeigen, nutzen wir das Sortable-Package von Spatie, das es uns ermöglicht, Projekte ganz einfach per Drag & Drop in Laravel Nova zu sortieren.
4. Media Library: https://spatie.be/docs/image/v1/introduction
Ein Portfolio ist ohne Bilder unvollständig und langweilig. Das Media Library-Package von Spatie macht die Verwaltung, Optimierung und Generierung von Bildern jedoch so einfach, dass Sie sich darum keine Sorgen machen müssen.
5. LaravelMetaTags: github.com/butschster/LaravelMetaTags
Zu guter Letzt empfehlen wir das Laravel MetaTags-Package von Github-Benutzer butschster. Es ist ein sehr gut durchdachtes Package, das es ermöglicht, Meta-Daten einfach zu pflegen und an das Template (Blade oder VueJS) weiterzugeben.