Mit dem Codyhouse-Framework lässt sich verhältnismäßig schnell eine moderne, komplexe und responsive Webseite erstellen. Grundlegende Kenntnisse über HTML und CSS sollten jedoch vorhanden sein. Wer sich also mit dem Thema beschäftigen möchte, der kann hier für wenig Geld (ca. 180€ für einen Lifetime Account) auf alle Komponenten und Inhalte zurückgreifen. Ich möchte hier gar nicht auf die genauen Inhalte eingehen, sondern kurz aufzeigen, welche Startschwierigkeiten ich hatte. Den ganz so einfach war der Start mit den Befehlen im Mac Terminal mit „npm install“ und „npm gulp watch“ leider nicht. Was fehlt also als Laie, um mit Codyhouse starten zu können? Wie starte ich Codyhouse richtig, damit ich SASS (Syntactically Awesome Stylesheets) mittels Präprozessor verarbeitet bekomme?
Tipp 1) Xcode installieren
Damit auf deinem Mac Book die Befehle korrekt ausgeführt werden können, musste ich einige Tools nachinstallierten. Ganz wichtig: Xcode aus dem AppStore herunterladen, weil hier einige kleine Tools enthalten sind, die für das große Ganze wichtig sind.
Tipp 2) Homebrew installieren
Als nächsten Schritt habe ich Homebrew installiert, um als „fehlender Paketmanager“ schnell und einfach weitere Komponenten installieren zu können. Darunter fallen dann z.B. die Entwicklungsumgebung npm oder für andere Projekte auch yarn.
Tipp 3) Node und npm installieren
Damit wir dem Codehouse Framework und der richtigen Verwendung ein wenig näher kommen, müssen anschließend noch die Pakete für Node und npm installiert werden. Ein paar Details habe ich mir über das Internet angelesen und folgende Anleitung dafür verwendet.
Probleme bei meiner Einrichtung
Nachdem ich mehrfach die Schritte durchgeführt habe, bin ich auf diverse Fehlermeldungen gestoßen. Diese sind direkt entstanden, nachdem ich mit „npm install“ starten wollte. Mit der Hilfe von Google und einigen Versuchen bin ich darauf aufmerksam geworden, dass meine Node und npm Versionen nicht kompatibel sind zum erwarteten Codyhouse-Framework und dem SASS Präprozessor. Also habe ich recherchiert und über Umwege auch ältere Versionen von Node installiert und richtig in meinem System verlinkt. Alles in allem war dieser Schritt viel aufwendiger, als das Arbeiten mit dem Codyhouse-Framework an sich. Dennoch: Für ein breiteres Publikum mit HTML / CSS Kenntnissen, sollte hier nachgebessert werden, um einen einfacheren Einstieg zu ermöglichen.
Alternative, bis zu meiner Problemlösung:
Wem das Thema SCSS / SASS und die ganze Entwicklungsumgebung zu viel des Guten ist, kein Problem! Es besteht die Chance, bis zu einem gewissen Grad auch ohne diese Komponenten auszukommen. Hierzu können einfach die Basics aus HTML und CSS verwendet werden, um ebenfalls schnell zum Ergebnis zu kommen. Jedoch: Nicht alle angebotenen Komponenten lassen sich 1:1 nur mit CSS abbilden und zusammenklicken. Der Ursprung liegt weiterhin in SASS / SCSS und die Entwickler bieten nicht alles mitten CSS-Copy and Paste an. Für einen schnellen Start jedoch gut machbar (z.B. Landingpage als Visitenkarte).
Links für meine Recherche / Problemlösung:
Beitragsbildquelle: www.codyhouse.co