Wie man schnell eine flexible Visitenkarten-Website für 0$ ohne Web-Erfahrung startet: Ein Kompromiss zwischen Flexibilität und Einfachheit

Die Entstehung der Idee und die ursprünglichen Anforderungen

Ich bin Entwickler für mobile Apps. Über die Web-Entwicklung habe ich nur oberflächliches Wissen und keinerlei praktische Erfahrung. Als ich die feste Absicht fasste, meine mobilen Apps endlich im Google Play Store zu veröffentlichen, dachte ich sofort darüber nach, wie ich eine Visitenkarten-Website erstellen könnte, die Informationen über alle meine Projekte bündelt. Dabei wollte ich weder zu Beginn noch in Zukunft viel Zeit für die Erstellung oder Wartung aufwenden, obwohl die Anforderungen an die Website nicht ganz trivial waren. Von Anfang an wusste ich genau, was ich von der Seite erwartete. Ich suchte nicht nach etwas Schwerfälligem: Gedanklich war ich bereit, verschiedene Abstraktionen manuell zu schreiben, um das Veröffentlichen von Artikeln zu erleichtern, wollte mich aber nicht mit der Einrichtung von etwas so Unhandlichem wie klassischen CMS mit Modulen und ähnlichen Lösungen herumschlagen.

Hier sind die Kriterien, die ich formuliert habe, und warum:

• Minimaler Aufwand für Entwicklung und Wartung bei gleichzeitig flexibler Anpassung: Ursprünglich wollte ich Vorlagen, in die ich bei Bedarf „hineinschauen“ und das implementieren kann, was ich brauche, und nicht nur das, was das System zulässt.
• SEO-freundliche Einrichtung: Die Website soll auch als Traffic-Quelle für meine mobilen Anwendungen dienen.
• Markdown-Unterstützung: Ich wollte eine Vorlage erstellen können, mit der ich meine Gedanken einfach in Form bringen kann, ohne jede Seite mühsam von Grund auf neu zu gestalten (selbst mit Copy-Paste).
• Einfache Unterstützung für Mehrsprachigkeit: Hier geht es wieder um den Traffic-Gedanken. Warum nicht Anfragen in anderen Sprachen abdecken, die theoretisch weniger wettbewerbsintensiv sein könnten?
• Je geringer die Kosten, desto besser: Das war kein hartes Kriterium, aber immer ein willkommener Bonus, besonders für Indie-Entwickler.

Untersuchung der Optionen und die Wahl von Astro und Cloudflare Pages

Ich mache es kurz: Ich habe verschiedene Website-Baukästen und Vorlagengeneratoren ausprobiert. Die kostenlosen Tarife waren oft stark eingeschränkt: Mal fehlte die SEO-Verwaltung, mal merkte man sofort, dass es ohne ein Upgrade nicht geht. Der Hauptgrund gegen Vorlagengeneratoren war jedoch die Mechanik der Erstellung. Bei einigen Optionen war es nicht einmal offensichtlich, wie man eine einfache Basisseite erstellt. Vielleicht fehlte mir auch die Motivation, mich tief einzuarbeiten, und im Hinterkopf saß der Gedanke: „Ich bin zwar kein Web-Entwickler, aber was wäre, wenn ich mich mit einem KI-Assistenten bewaffne und versuche, praktische Abstraktionen für eine Vorlagenstruktur zu erstellen, die genau auf meine Aufgaben zugeschnitten ist?“ Ich hatte die Befürchtung, mich in der technischen Seite zu verlieren und die Motivation zu verlieren, falls Probleme zu lange ungelöst blieben.

An einem Abend, an dem ich Optionen mit einer KI diskutierte, wurde mir die Kombination aus Astro und Cloudflare Pages vorgeschlagen.

Testlauf der Kombination Astro und Cloudflare Pages

Durch den Austausch mit der KI wurde mir klar, dass diese Kombination meine Kriterien voll erfüllt und sogar übertrifft. Die wichtigsten Vorteile, die als Bonus dazukamen:

1. Kein Ärger mit Docker, Builds oder Deployment: Man gibt Cloudflare Pages Zugriff auf das Git-Repository, macht einen Push in den Master-Branch, und Cloudflare Pages übernimmt den Build und das Deployment. Nach dem Push muss man buchstäblich nichts mehr tun.
2. Lokale Überprüfung: Man kann das Ergebnis lokal mit nur einem Befehl prüfen. Testen, anpassen, wieder pushen.

Mein Fazit nach dem Testlauf: Meine Anforderungen und Ziele wurden erreicht. Der Entwurf meiner Website mit einer ersten Struktur stand innerhalb eines einzigen Abends.

Astro und meine Kriterien

Ich werde hier nicht die üblichen Lobeshymnen wiederholen, die man bei Google findet, sondern beschreiben, wie Astro meine persönlichen Probleme gelöst hat:

• Minimaler Aufwand und flexible Anpassung: Ein erster Entwurf der Seite wurde an einem Abend erstellt.
• SEO-Einstellung: In Astro ist jede Seite standardmäßig reiner HTML-Code, was bedeutet, dass ich die volle Kontrolle über das SEO habe.
• Markdown-Unterstützung: Diese ist in Astro hervorragend implementiert. Man kann eine Struktur erstellen, bei der eine Web-Seiten-Vorlage den Inhalt aus md- oder mdx-Dateien zieht. Für eine neue Seite muss später nur noch die md-Datei erstellt werden. Kein HTML-Copy-Paste mehr.
• Mehrsprachigkeit: Astro bietet einen i18n-Mechanismus. Es reicht aus, die Ordnerstruktur im Projekt richtig anzulegen. Ich speichere die Strings für jede Seite in einem Array im JSON-Format. Auch die Übersetzung von Markdown-Dateien wird unterstützt.
• Kosten: Cloudflare Pages bietet großzügige Limits im kostenlosen Tarif (bis zu 500 Builds pro Monat). Am Ende habe ich nur für die Domain bezahlt.

Astro und Cloudflare Pages sind sicher nicht die einzigen Lösungen dieser Art, aber für mich war es ein perfekter „Match“. Wenn Sie ähnliche Ziele haben, kann ich diese Kombination definitiv empfehlen.

Ratschläge

Hier sind einige Dinge, die ich gerne früher gewusst hätte (Gedanken für Web-Neulinge):

1. Struktur vorher planen: Bevor Sie mit dem Code beginnen, skizzieren Sie die Seite in einem Editor, um die Hierarchie der Seiten zu verstehen.
2. Komponenten vereinheitlichen: Überlegen Sie sich frühzeitig, welche Elemente (Header, Footer, Buttons) sich wiederholen. Denken Sie im Format eines Design-Systems, um später mühsames Refactoring der Styles zu vermeiden.
3. Mehrsprachigkeit: Verstehen Sie, was kanonische Seiten (canonical tags) sind, damit Suchmaschinen nicht durch die übersetzten Versionen verwirrt werden.

Fazit

Meiner Meinung nach lassen sich mit der Kombination aus Astro und Cloudflare Pages auch ohne Web-Erfahrung flexible und leistungsstarke Websites erstellen. Mit KI-Tools sind die meisten Probleme heute absolut lösbar. Und was für viele wichtig ist: Das Ganze ist kostenlos (abgesehen von der Domain-Gebühr, die ich für eine sinnvolle Investition halte).