Zum Inhalt springen
DasPeTe Tutorials

Serie

Dein Portfolio mit Manablox

Bau eine Portfolio-Website mit dem CMS Manablox: zuerst ohne Code, dann mit deinem eigenen Astro-Frontend, und zuletzt online mit deiner eigenen Domain.

Sieben Teile, vom leeren Ordner bis zum Portfolio im Internet. Du installierst Manablox, gestaltest im Admin eine Website ohne Code, füllst sie mit deiner Arbeit, baust für dieselben Inhalte ein eigenes Frontend in Astro und bringst alles auf einen Server. Erfahrung mit einem CMS brauchst du nicht: Jeder Schritt ist erklärt, mit Screenshots und jedem Befehl.

Questreihe

  1. Teil 1: Manablox installieren und dein CMS anlegenInstalliere Node.js, pnpm und Docker, lege mit einem Befehl ein Manablox-Projekt an und richte dein Admin-Konto ein.25 Min.
  2. Teil 2: Ein gestaltetes Portfolio ohne CodeLeg deinen ersten Space als fertiges Portfolio an, wähl ein Theme und ein Design, und sieh deine Website laufen.20 Min.
  3. Teil 3: Füll das Portfolio mit deiner ArbeitLade Bilder hoch, mach aus den Beispielprojekten deine eigenen, bearbeite die Abschnitte deiner Seiten und gib der Website deinen Namen und deine Farben.35 Min.
  4. Teil 4: Dein eigenes Frontend mit AstroLies deine Inhalte über die öffentliche API, leg eine Astro-Website an, die sie zeigt, und stell den Space auf dein eigenes Frontend um.30 Min.
  5. Teil 5: Layout, Hero und ProjektkartenGib der Astro-Website ein Layout mit Kopf- und Fußbereich, einen großen Hero, Projektkarten mit Titelbildern und eine richtige Projektseite.40 Min.
  6. Teil 6: Galerie, Kontakt und der letzte SchliffGestalte die übrigen Abschnitte, ergänze einen Inhaltstyp um ein Feld für einen Kontaktknopf, beschreib deine Seiten für Suchmaschinen und bau die Website für den Betrieb.40 Min.
  7. Teil 7: Bring dein Portfolio onlineMiete einen Server, richte deine Domain darauf und betreib dort das CMS, die öffentliche API und deine Astro-Website mit Docker und automatischem HTTPS.45 Min.