Herzlich willkommen!Session „Git & WordPress“

@kirstenschelper @taxifisch

Git & WordPress

Für wen ist diese Session?

• Level: Einsteiger

• Designer, die WordPress Themes entwickeln und nicht viel mit Programmierung am Hut haben

• Leute, die es schon 1000 Mal versucht haben, aber nie verstanden haben, wie Git funktioniert

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Was gibt es nicht in dieser Session

• Die Antwort auf alle Fragen

• Schritt für Schritt Anleitung zum Arbeiten mit Git

• Geheimrezepte und Git-Voodoo

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Wer wir sind

Git & WordPress

Kirsten Schelper{designer}

Elisabeth Hölzl{developer}

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Unser Einstieg in Git

Git & WordPress

Foto Raymond Bryson on Flickr

First Contact

@kirstenschelper @taxifisch

Git & WordPress

Das s_theme (von Automattic)

… liegt auf GitHub*

… wird von Kirsten als Grundlage für Themes verwendet

* verschiedene Leute arbeiten daran * kriegt regelmäßig Updates und Fixes

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Kirsten‘s Workflow bisher

1. s_theme von GitHub herunterladen

2. An der lokalen Kopie arbeiten

3. Eigenes Theme draus machen

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Das Problem:

Ich verpasse alle Updates von Automattic,weil die lokale Kopie keine Verbindung zum Original auf GitHub hat

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

Git & WordPress

Foto istockfoto.cm/wildcat78

Das ist doof.

@kirstenschelper @taxifisch

Git & WordPress

Dann machen wir eben Git!

@kirstenschelper @taxifisch

Git & WordPress

Kopier mal

ins Terminal

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Kirsten‘s Story

• Ich habe Git auf meinem lokalen Rechner installiert

• Ich habe rumprobiert, Dateien geändert usw.

• Aber ich konnte rein gar nichts SEHEN

• Dieses Git – ist vollkommen unsichtbar!

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Zwischenbilanz

• Als Designer ohne Programmiererfahrung ist man aufgeschmissen

• Man muss sich einen freundlichen Programmierer suchen

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Wie tickt Git?

@kirstenschelper @taxifisch

Git & WordPress

Problem Herausforderung1. Abstraktion. Für visuelle Menschen ein Graus.

2. Mit der Kommandozeile arbeiten heißt: Es gibt kein visuelles Feedback, man sieht buchstäblich nicht was man tut.

3. Das ist die schlechte Nachricht. Die gute Nachricht:

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

Git & WordPress

http://www.flickr.com/photos/27875041@N02/4533462327/sizes/l/

Git ist einfach. Irgendwie.

@kirstenschelper @taxifisch

Git & WordPress

Ein bisschen Git-Chinesisch• init

• repository

• branch

• commit

• merge

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

initialisieren

@kirstenschelper @taxifisch

Git & WordPress

Staging Area• Git verlangt, dass man seine Änderung in etwas namens

„Staging Area“ legt, bevor man ein commit macht

• Die Staging Area kann man sich vorstellen wie eine Lagerhalle, in der man Dinge zusammenstapelt, die zusammen gehören. Zum Beispiel: Code, der zum Menü gehört auf einen Stapel, Code, der zum Slider gehört auf einen anderen.

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

Omm!

http://www.flickr.com/photos/joao_trindade/4323984439/sizes/l/in/photostream/

@kirstenschelper @taxifisch

Git & WordPress

Beispiel für einen Git Workflow

@kirstenschelper @taxifisch

Git & WordPress

Ziele Workflow s_theme• Wir wollen das s_theme als eine Art „Boilerplate“

für verschiedene WordPress Themes verwenden

• Wir wollen keine Updates (auf GitHub) mehr verpassen

• Wir wollen, dass im Code, an dem wir arbeiten, nichts durcheinander kommt, wenn es ein Update vom s_theme gibt

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Wie tickt Git? QuellenGit WorkflowAnfänge

Kirsten‘sRepo

Das s-Theme auf den lokalen Rechner klonen

Verbindung zum s_theme im Automattic repo

Änderungen am s_theme holen

_s-themeclone 1.1

git remote add automattic

commit

fork

git clone

git fetch automattic

_s-themeclone 1.1

GitHub

2

Einleitung

git kommandos

arbeiten & commit

arbeiten & commit

1

3

4

Automattic‘s Repo

_s-themeFork machen

_s-theme

@kirstenschelper @taxifisch

Git & WordPress

Zusammenfassung GitHub Workflow• Ein Projekt auf GitHub auswählen und forken (Schritt 1)

• Git auf dem lokalen Rechner installieren

• Das Projekt auf den lokalen Rechner klonen (Schritt 2)

• [Arbeiten]

• Das lokale Projekt mit dem Original-Projekt auf GitHub verbinden (Schritt 3)

• Updates vom Original-Projekt holen (Schritt 4)

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Warum eigentlich „Fork“?

@kirstenschelper @taxifisch

Git & WordPress

Wie tickt Git? QuellenGit WorkflowAnfänge

Kirsten‘sRepo

Das s-Theme auf den lokalen Rechner klonen

Verbindung zum s_theme im Automattic repo

Änderungen am s_theme holen

_s-themeclone 1.1

_s-themeclone 1.1

GitHub

2

Einleitung

arbeiten & commit

arbeiten & commit

1

3

4

Automattic‘sRepo

_s-themeFork machen

_s-theme

@kirstenschelper @taxifisch

Git & WordPress

Wie tickt Git? QuellenGit WorkflowAnfänge

Kirsten‘sRepo

Änderungen am s_theme holen

_s-themeclone 1.1

s-themeclone 1.1

GitHub

Einleitung

arbeiten & commit

Automattic‘sRepo

_s-themeFork machen

_s-themeclone 1.0

arbeiten & commit

_s-theme

_s-theme-ks

@kirstenschelper @taxifisch

Git & WordPress

Arbeit mit Git bedeutet… den Workflow besser und sicherer machen

… mit den vielen spannendend Projekten auf GitHub spielen

Keine Angst– Git ist ziemlich idiotensicher

Es ist relativ schwer was kaputt zu machen

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

Ressourcen zum Lernen

• Brandneue Video Serie auf Treehouse: Introducing Git Basics

• Artikelserie in unserem Blog http://die-netzialisten.de/

• git the stupid content trackerTutorials und sehr gute Ressources

Wie tickt Git?Einleitung QuellenGit WorkflowAnfänge

@kirstenschelper @taxifisch

Git & WordPress

• Slides auf Slidesharehttp://de.slideshare.net/KirstenSchelper/

Vielen Dank – Fragen?