Vielleicht habt ihr's gemerkt: Nach dem ersten kleinen Lebenszeichen hier war erstmal wieder Sendepause. Und nein, ich bin nicht einfach abgetaucht, um Däumchen zu drehen. Ganz im Gegenteil! Hinter den Kulissen wurde gewerkelt, geschraubt und ja, auch manchmal geflucht. Aber fangen wir mal von vorne an.
Warum die Stille? Der Abschied von alten Pfaden
Die letzten Wochen (und Monate, wenn ich ehrlich bin) standen ganz im Zeichen eines großen Umbruchs. Einige meiner alten Angular-Websites, die so über die Jahre entstanden sind, wurden eingestampft, andere sollten in einer neuen, zentralen Anlaufstelle zusammenfließen. Klingt erstmal nach 'nem Plan, oder? War's auch, aber wie das mit Plänen so ist... sie fressen Zeit. Und Nerven.
Nach kurzer Zeit war auch schnell klar, Angular ist hierfür nicht das richtige Framework: Der neue Tech-Stack sollte also Astro + Sanity sein, garniert mit (dem bisherigen) Firebase Auth für die Benutzerverwaltung und Firebase Functions für serverseitige Logik. Klingt fancy, ist es auch, aber dazu gleich mehr.
Dieser Umbau hat derart viele Kapazitäten in Anspruch genommen, dass für andere Inhalte einfach kein Kopf mehr frei war. Gerade für so Herzensprojekte wie die "Date Story" brauch ich eine wirklich "stabile" positive Phase. Das klingt vielleicht komisch, is aber so 😄. Ich muss da quasi in meiner Vergangenheit wühlen können, das Erlebte in Worte packen, ohne dass mich die negativen Dinge aus dieser Zeit wieder einholen. Und dafür war der Kopf bisher einfach nicht frei, jedoch ist nun auch dafür das Fundament gelegt.
Von Angular zu Astro: Eine Achterbahnfahrt der Gefühle! 🎢
Die Reise von meinem alten Setup zu dem, was hier jetzt entsteht, war... nun ja, nennen wir es eine Achterbahnfahrt. Und ein bisschen was davon möchte ich euch erzählen.
Der Abschied von Angular – Ein bisschen Wehmut war dabei
Als ich vor ein paar Jahren mit einem größeren Webprojekt gestartet bin, war Angular (Version 8 oder 9 🤔) mein Framework der Wahl. Ich war total begeistert von der strukturierten Art und Weise, wie schnell man damit Anwendungen aufbauen konnte. Es war wie ein Schweizer Taschenmesser für Webentwicklung! 🧰 Ich konnte damit komplexe Features bauen und hatte alles schön im Griff. Angular ist ein Webframework von Google, das es Entwicklern ermöglicht, dynamische Single-Page-Applications (SPAs) zu erstellen. (Wer's genauer wissen will, findet im Netz tonnenweise Infos dazu! Oder lasst es mich in den Threads Kommentaren wissen, wenn ihr hier noch mehr Details von mir wollt)
Aber wie das so ist, ändern sich die Zeiten und die Anforderungen. Für einen Blog oder eine Webseite mit vielen statischen Inhalten, wie diese hier größtenteils werden soll, fühlte sich Angular plötzlich ein bisschen... schwerfällig an. Klar, es gibt auch für Angular Möglichkeiten, das SEO-freundlich und performant für einen Blog zu gestalten, aber es fühlte sich nicht mehr nach der optimalen Lösung an. Die Build-Zeiten wurden länger, und die initiale Ladezeit war nicht gerade berauschend. Ich wollte etwas Leichtgewichtigeres, etwas Schnelleres. Und so begann ich, nach Alternativen zu suchen.
Astro & Sanity – Die erste Begegnung mit der Sternenpracht ✨
Und dann kam Astro in mein Leben! ✨ Ich war sofort von dem Konzept der "Islands Architecture" begeistert. Die Idee, nur das an 'reaktiven' Code was auch wirklich interaktiv sein muss, und den Rest quasi fertig an den Browser zu senden, klang einfach genial. Außerdem versprach Astro super schnelle Ladezeiten und eine exzellente SEO-Performance durch serverseitiges Rendering oder Static Site Generation. Perfekt für das, was mir vorschwebte!
Als Content-Backend dazu gesellte sich Sanity.io, ein headless CMS, das mir die Flexibilität gibt, meine Blog Inhalte so zu strukturieren, wie ich es brauche, einen simplen aber dennoch guten Editor um die Beiträge bereits in dieser Umgebung von der Idee bis zum fertigen Post zu entwickeln und sie dann via API in der Website einzubinden.
Außerdem ploppen gerade ständig neue KIs auf, die komplette Webseiten mit fancy Frameworks bauen. Da kam mir der Gedanke: Wenn dafür nun die KI da ist, können wir Programmierer uns wieder dem wirklichen "Handwerk" widmen und nicht mehr nur schnell und möglichst effizient etwas entwickeln, das wir für alle zukünftigen Projekte mitnutzen können, um Kosten und Aufwand zu sparen. Nun ist quasi endlich wieder Zeit und hoffentlich auch die Kundschaft da, Webseiten für den Kunden zu bauen oder wie in meinem Fall eine Website, die auch wirklich mich widerspiegelt. Nennen wir es Handwerk oder vielleicht sogar Kunst!
Der erste Schritt war natürlich, mich in diese neue Welt einzulesen. Die Dokumentation von Astro war super hilfreich, und ich war erstaunt, wie einfach es war, meine ersten Komponenten zu erstellen. Die Syntax war angenehm und intuitiv. Ich war richtig motiviert!
Die ersten Schritte – Holpriger Start, aber die Euphorie überwog
Der Umstieg war aber natürlich kein Spaziergang. Ich musste mich von einigen "alten Angular-Gewohnheiten" verabschieden. Statt des kompletten Single-Page-Application-Gedankens war jetzt oft jede Seite ein kleines eigenes Universum, oder zumindest Teile davon. Das Routing musste neu gedacht werden. Das war am Anfang schon etwas holprig.
Auch das Thema State Management war plötzlich anders. Aber hey, Herausforderungen sind ja da, um gemeistert zu werden! 💪
Die Höhen – Astro zeigt seine Stärken!
Und dann kamen die Momente, in denen ich wusste, dass ich die richtige Entscheidung getroffen hatte. Die Build-Zeiten wurden rasant schneller. Die Ladezeiten meiner Seite waren plötzlich im grünen Bereich! Die SEO-Optimierungen durch das statische Rendern machten sich sofort bemerkbar.
Besonders cool fand ich auch, wie gut sich Astro mit anderen Tools und Libraries integrieren lässt. Das Einbinden von Sanity-Daten oder Firebase-Funktionen fühlte sich richtig gut an.
Die Tiefen – Es war nicht immer einfach! 🤯
Natürlich lief nicht alles glatt. Es gab auch Momente, in denen ich am liebsten alles hingeschmissen hätte. Manchmal fand ich mich in den Docs verirrt, oder ein Problem war einfach nicht so leicht zu lösen, wie erhofft. Es brauchte Zeit und Geduld, sich an die neue Denkweise zu gewöhnen. Es gab ein paar Nächte, in denen ich frustriert vor dem Rechner saß und mich fragte, ob das alles wirklich die richtige Entscheidung war.
Das Zwischenergebnis – Es hat sich gelohnt! 🎉
Aktuell kann ich sagen: Es hat sich gelohnt! 🎉 Die Webseite ist jetzt viel schneller, schlanker und performanter. Ich bin total zufrieden mit dem Ergebnis, und ich habe auf dem Weg noch eine Menge gelernt. Der Umstieg war eine echte Achterbahnfahrt, aber ich bin froh, dass ich mich auf dieses Abenteuer eingelassen habe.
Was habe ich bisher gelernt bzw was habe ich mir dadurch wieder in Erinnerung gerufen?
- Veränderung ist gut! Manchmal muss man alte Zöpfe abschneiden, um sich weiterzuentwickeln.
- Neues lernen ist anstrengend, aber lohnenswert. Es hat sich gelohnt, sich mit Astro und Sanity auseinanderzusetzen.
- Community ist wichtig! Ohne die großartigen Communities und Ressourcen online hätte ich bestimmt nicht alles geschafft.
- Geduld! Es braucht Zeit, um sich umzugewöhnen und neue Konzepte zu verinnerlichen.
Der Grundstein ist gelegt – Was die Zukunft bringt 🚀
Mit diesem neuen technischen Fundament ist jetzt der Grundstein für viel mehr gelegt, als nur einen "einfachen" Blog. Ich hab da schon so einige Ideen, was hier in Zukunft noch alles passieren soll und welche Möglichkeiten sich damit eröffnen:
- Roadmap mit Feature Voting: Ihr sollt mitentscheiden können, welche Features als Nächstes umgesetzt werden. Transparenz und Community-Input sind mir wichtig und ich möchte euch damit schließlich auch einen Mehrwert bieten!
- Shop: Es wird wieder einen kleinen Shop geben, in dem ihr vielleicht das eine oder andere neue coole Ding und möglicherweise auch alte Designs wieder-finden werdet.
- Subscription-Modell: Wer mich und meine Projekte ganz unabhängig unterstützen möchte, bekommt bald die Möglichkeit dazu. Dafür werden Patreon, Twitch Subscriptions und andere Möglichkeiten abgeschafft um hierfür sowohl für mich, als auch für euch eine Zentrale stelle dafür zu bieten.
- Projekte: Eine eigene Sektion, in der ich meine verschiedenen Projekte detaillierter vorstellen kann.
- Details: Was ist das Ziel? Welches Problem soll damit gelöst werden? Wie ist der aktuelle Stand? …
- Kosten: Transparente Aufschlüsselung, wo finanzielle Mittel hinfließen oder benötigt werden, mit der Möglichkeit, sich direkt zu beteiligen. Ich möchte allen, die mich finanziell unterstützen auch zeigen, was mit Ihrem Geld passiert!
- Nutzen: Wie können sich Beteiligungen "auszahlen"? Das kann von exklusiven Inhalten bis hin zu Anteilen an möglichen Erträgen reichen, aber das erfahrt ihr dann in den Details der einzelnen Projekten!
- und so vieles mehr, dass ich euch hier aber noch nicht verraten kann (oder möchte 🤪)
Ihr seht, da ist einiges in Planung! Der Umbau war also nicht nur Selbstzweck, sondern die Basis für all das, was noch kommen soll. Ich bin gespannt auf die Reise und hoffe, ihr seid dabei!
Ich hoffe ich konnte mit diesem Artikel auch diejenigen abholen, welche sonst mit der technik hinter Webseiten nicht viel zu tun haben. Wenn etwas unklar ist, oder ihr noch mehr Details wissen wollt, lasst es mich unbedingt wissen!