Dauer: 1

Was lernst du

• Nützliche Resourcen
• Software installieren
• Einstiegsseite einrichten
• Ein Codelab erstellen
• Codelab-Kategorie anpassen
  

• Sehr gute Anleitung um eine Codelab-Umgebung einzurichten
• Offizielle Dokumentation
• Codelab to create a codelab
• CheatSheet
• Andere Anleitung

Es muß folgende Software installiert werden:

• Go
• Node.js und npm
• Codelab-Tool claat

Als Einstiegsseite kann dieses Projekt geklont werden:

git clone https://github.com/googlecodelabs/tools

Ein Codelab erstellen

• Unter dem Ordner site folgende Ordnerstruktur erstellen: codelabs/assets
• Markdown-File erstellen, z.B. sample.md
• Inhalte einfügen
• File mit Hilfe von claat exportieren: claat export sample.md Nun wurde automatisch ein Ordner dem Namen des codelabs erzeugt
• Zum Anzeigen des erzeugten Codelabs: gulp serve --codelabs-dir=codelabs oder claat serve

Info Boxes

Eine grüne Infobox

Positive
:Diese Box enthält zusätzliche Informationen.

Eine gelbe Hinweisbox

Negative
: Diese Box enthält eine Warnung oder ähnliches.

Dazu wird das File /site/app/styles/_categories.scss. angepasst, z.B. so:

@include codelab-card(['sample'], #FC0023, 'sample.svg');

Das Icon wird in den Ordner /site/app/images/icons gespeichert

Die Codelabs können als statische Seite zum Beispiel in Firebase deployed werden

• firebase deploy

Wenn es Probleme mit dem Login gibt, eventuell ein Logout und erneutes Login versuchen:

firebase logout
firebase login

Und das war's.