· 6 min read

Astro - Meine Meinung

Astro ist ein neues JavaScript Framework für statische Webseiten. Es gehört zu den statischen Website Generatoren. Als Entwickler von Angular Applikationen habe ich mich für dieses Framework entschieden, um meine Webseiten zu migrieren, die bisher mit Ghost als CMS betrieben wurden.

In diesem Blog Eintrag soll es um meine Meinung gehen und wie ich das Framework einteile, bzw. abgrenze von anderen Technologien. Im Artikel Astro - Eine Einführung erfährt man, wie Astro aufgebaut ist und wie man damit Webseiten generiert.

Was ist Astro?

Astro ist ein JavaScript Framework, mit dem man statische Webseiten erstellt, d.h. es wird auf der Serverseite zur Laufzeit nichts generiert. Astro ist es dabei wichtig, dass die Seiten sehr schnell laden. Client-side JavaScript soll dabei nur minimal eingesetzt werden. Trotzdem verwenden wir zum Definieren der Website JavaScript bzw. TypeScript. Beim Deployen der Website gibt es einen Zwischenschritt und zwar werden in einem Build Prozess HTML, CSS, JavaScript usw. generiert und diese Dateien können dann auf einem WebServer gehostet werden.

Astro gehört also nicht zu den client-side JavaScript Frameworks, wie Angular, React usw. sondern zu den statischen Website Generatoren, wie Hugo, SvelteKit. (Es gibt davon Unmengen: https://jamstack.org/generators/).

Astro im Gegensatz zu einem CMS

Bei einem Content Management System (CMS), wie WordPress oder Ghost wird der Content meist in einer Datenbank verwaltet. Ein CMS unterstützt einem beim Schreiben von Inhalten und wenn eine Anfrage vom Browser kommt, werden die Seiten zusammengebaut und ausgeliefert.

Astro vs. Angular

Noch eine wichtige Einteilung: Astro ist keine Single Page Applikation (SPA), wie es z.B. Angular Applikationen sind. Jede URL die man aufruft, geht zum Server und holt die entsprechende Seite. Das Routing passiert also nicht auf der Clientseite sondern Astro generiert für jede URL eine Seite.

Also eigentlich ist es genau das Gegenteil, das ich bisher so gerne verwendet habe, nämlich Angular. Doch es löst auch nicht diese Applikationen ab. Meine einfachen Webseiten, die ich bisher mit Ghost erstellt habe, die möchte ich damit ersetzen.

Mir hat an diesen Angular Applikationen so gut gefallen, dass das Hosting sehr einfach ist, denn auch dort hat man statischen Webcontent (Dateien, vom Typ HTML, JavaScript und CSS). Angular Applikationen haben allerdings viel JavaScript auf der Clientseite und das braucht man auch für diese Applikationen, bei dem typischerweise ein angemeldete Benutzer seine spezifischen Daten angezeigt bekommt und er diese auch verändern kann.

Ich werde also weiterhin diese komplexeren Applikationen mit Angular schreiben.

Astro vs. Ghost

Aber die einfachen Webseiten, die vor allem Content nach außen liefern sollen, also Blogs oder Landing Pages, die will ich mit Astro umsetzen.

Warum Ghost ersetzen?

Mir gefällt der Ansatz, dass ich keine Datenbank hosten muss, sondern einfach statischen Webcontent habe. Ghost bietet ein schönes Admin Portal an, dort erstellt man die Artikel und konfiguriert die Website. Die Artikel erstellt man dazu mit Markdown. Nun ist aber die Unterstützung für Markdown auch in Astro ein zentrales Thema und daher ist die Migration sehr einfach. Das Admin Portal und die vielen Themes, das werde ich allerdings vermissen, aber dazu gibt es zumindest Ansätze und vielleicht entwickelt sich das noch. Astro ist noch sehr jung.

Gewohnte Rahmenbedingungen

Das Hosting ist somit ident mit den Angular Applikationen, wobei dort natürlich meist WebServices dazukommen, denn irgendwo müssen ja auch die Daten für die Applikation verwaltet werden. Allerdings kann das ja auch bei Astro passieren, i.a. werden es aber eher öffentliche WebServices sein und es werden keine benutzerspezifischen Daten verarbeitet.

Ein weiterer Vorteil ist, dass ich neue Blog-Artikel somit weiterhin mit Markdown schreiben kann.

Auch die Entwicklungstools sind dieselben, bzw. ähnlich aufgebaut. Obwohl man doch umdenken muss, weil jetzt alles am Server gemacht wird. Trotzdem ist überraschenderweise die Entwicklung der Applikation doch sehr ähnlich. Wir verwenden TypeScript, Node.js, usw.

Astro unterstützt den Entwicklungsprozess mit einem Webserver. Es integriert sich schön in die Node.js Infrastruktur und liefert alles mit, was man benötigt, z.B. einen lokalen Webserver der während der Entwicklung die Seiten hostet und bei Änderungen im Sourcecode, wird der Build angestoßen und man sieht sofort das Ergebnis im Browser. So wie es inzwischen auch bei den anderen JavaScript Frameworks üblich ist.

Anmerkung: Ghost ist ebenfalls in JavaScript geschrieben, deshalb habe ich es gegenüber WordPress bevorzugt, aber es wird das Framework Ember.js verwendet, das mir fremd geblieben ist. Ich musste aber auch nicht so tief einsteigen. Ich habe kaum was verändert. - Ein passendes Theme ausgesucht und nur wenig angepasst.

Man kann mit Astro sogar einzelne Komponenten mit Frameworks wie React, Vue oder Svelte generieren. Angular wird zur Zeit nicht unterstützt, da ist ja auch aktuell noch das “Problem”, dass das nicht so modular ist, dass man nur einzelne Komponenten verwenden kann, die Entwicklung von Angular geht aber auch in diese Richtung.

Es ist zu empfehlen, dass man die Grundlagen von Astro versteht, wie man eine Komponente baut und wie das mit dem Layout funktioniert. Auch wenn man wohl meist mit einem fertigen Theme starten wird und dann dort ein paar Anpassungen durchführen wird und sich ansonsten auf den Content konzentrieren wird, den man damit veröffentlichen will.

Negatives

Was mich an Astro stört:

  • Themes

    Es gibt nur wenige Themes. Es gibt auch keine Trennung von einem Theme und der eigenen Anpassung. Bei einem Update des Themes muss man die Dateien wohl vergleichen und eigene Änderungen nachziehen. Hier fehlt mir noch die Erfahrung.

  • Content erstellen im Sourcecode

    Für mich mischt sich das doch ein wenig stark, wenn man vorher ein CMS gewohnt war. Es gibt allerdings spezielle Web Applikationen dafür die so etwas anbieten (sogar für unterschiedliche Statische Website Generatoren). Man kann dort die Seiten erstellen und dann nach GitHub deployen. Das habe ich mir jedoch noch nicht angesehen. Es wäre aber wichtig, wenn jemand anderer die Inhalte publizieren möchte, der wäre irritiert durch den Sourcecode im selben Repository, wie seine Markdown Weblogseiten.

  • GDPR

    Code für cookie consent usw. fehlt. Da kann man natürlich einfach irgendwelche JavaScript Code Libraries verwenden, aber mir fehlt hier eine schöne integrierte Lösung, so wie es für WordPress diverse PlugIns gibt. Vielleicht muss ich mir aber auch erst mal alle Astro Integrations ansehen und ich habe nur noch nicht das passende gefunden. Wichtig in dem Zusammenhang ist natürlich auch, dass man keine Google Fonts oder andere fremde Ressourcen einbindet. Das sollte von den Themes berücksichtigt werden.

Fazit

Mir war es wichtig in diesem Artikel das JavaScript Framework Astro, ein statischer Website Generator, im Vergleich zu Angular und auch im Vergleich zu einem Content Management System darzustellen. Ein ideales Framework für Leute die Erfahrung mit aktuellen JavaScript Frameworks haben, denen TypeScript, Markdown und Node.js geläufig sind. Man kann es allerdings auch als Einstieg in diese Technologien verwenden, denn die Einstiegshürde ist viel kleiner, als wenn man mit Angular beginnt.

HLC-astro-opinion-twitter


Artikel in diesem Blog


Weitere Astro Artikel.

Back to Blog