Shopware Entwicklung mit Git – davon habe ich vor ein paar Wochen gelesen, und war gleich neugierig. Seid ihr es auch? Na dann super – Hier geht`s ohne Umwege ans Eingemachte. Mit Git kann man online seinen Code speichern und mit anderen auf hochprofessionelle Art im Team am Code arbeiten. In diesem Beispiel verwende ich den kostenlosen Account von bitbucket und die ebenfalls kostenlose Software SourceTree. Statt BitBucket könnte man auch das bekanntere GitHub nutzen, der Weg ist ähnlich.

Ok auf geht`s – hier ist die grobe Inhaltsübersicht:

– Sourcetree installieren
– Bitbucket Account anlegen
– Repository anlegen
– Bitbucket mit SourceTree verbinden

Shopware Entwicklung mit Git – Sourcetree installieren

Als erstes gehen wir auf die sourcetree Seite und laden uns dort die aktuelle Version runter. Viel Auswahl gibt es nicht und die Installation geht auch zügig und problemlos. Wenn wir das Programm öffnen werden wir nach unserem Login für Bitbucket oder GitHub gefragt, daher sollten wir dort zunächst einen Account anlegen.

 

Shopware Entwicklung mit Git – Bitbucket Account anlegen

So der 2. Punkt ist auch sehr einfach, wir gehen einfach auf https://bitbucket.org und klicken auf den grünen Get started for free Button um uns einen Account anzulegen. Ist der Account angelegt und die Mail bestätigt könnt ihr loslegen und euer erstes Repository anlegen.

 

Shopware Entwicklung mit Git – Repository anlegen

Klickt oben im Menü auf Repositories und dann auf Create repository. In diesem Beispiel lege ich ein Repository für unser erstes kommendes Shopware 5 Theme „byoutea“ an. Hier seht ihr die Einstellungen:

Shopware Entwicklung mit Git - Repository anlegen

Shopware Entwicklung mit Git – Repository anlegen

Shopware Entwicklung mit Git – Bitbucket mit SourceTree verbinden

Wenn ihr bei SourceTree eure Userdaten von Bitbucket eingegeben habt klickt ihr auf Remote und bekommt dann das zuvor angelegte Projekt angezeigt.

Shopware 5 Entwicklung mit Git - SourceTree Anbindung

Shopware 5 Entwicklung mit Git – SourceTree Anbindung

 

Klickt einfach mal drauf, dann kann es weitergehen.

Als nächstes wählt ihr den Ordern aus, der verbunden werden soll. In diesem Beispiel habe ich eine Shopware 5 Installation lokal installiert. Im Ordner Themes/Frontend hatte ich einen Ordner namens byoutea den ich kurz auf dem Schreibtisch zwischengeparkt und im eigentlichen Ordner gelöscht habe. Dann habe ich den vorher noch da gewesenen Ordner in SourceTree als Zielpfad definiert. Nach der Aktion war der byoutea Theme Ordner also wieder da, jedoch noch leer.

Shopware 5 Entwicklung mit Git - Lokaler Ordner

Shopware 5 Entwicklung mit Git – Lokaler Ordner

Jetzt bekommen wir das Projekt auch im Lokal Tab angezeigt und können unsere eigentlichen Dateien aus dem Ordner byoutea  wieder da rein legen, wo sie hergekommen sind. Wenn ihr gerade mit einem neuen Projekt bei = startet ist das natürlich nicht relevant. Normaaalerweise macht man es so, dass man über die Zeile Zielpfad in den htdocs Ordner navigiert und dort mit einem Klick auf Klone einen neuen Ordner erstellt, in dem später die Dateien gespeichert werden. Zurück zum Geschehen…

So sieht es nun also ungefähr in meinem Frontend Ordner aus:

Shopware 5 Entwicklung mit Git - Dateien im Finder

Shopware 5 Entwicklung mit Git – Dateien im Finder

Was hat sich geändert? Ich bekomme aufgrund der insgesamt 11 Dateien, die ich abgelegt habe, nun eine 11 angezeigt und kann nun den allerersten Upload in mein Repository durchführen. Hierfür klicke ich auf das mit 11 markierte Projekt und bekomme dieses Fenster angezeigt:

Shopware 5 Entwicklung mit Git - Erster Upload

Shopware 5 Entwicklung mit Git – Erster Upload

Vor dem ersten Commit wird man aufgefordert einen Usernamen und seine E-Mail Adresse einzugeben.

Shopware 5 Entwicklung mit Git - SourceTree User

Shopware 5 Entwicklung mit Git – SourceTree User

Danach können die Dateien in der Liste markiert, und der erste Commit ausgeführt werden. Im Kommentarfeld erscheint nun der Username – schreiben Sie beim ersten Commit: initial commit als Kommentar.

Hat es funktioniert sieht man nun die Liste der Dateien im Bereich Source.

Shopware 5 Entwicklung mit Git - BitBucket Dateien

Shopware 5 Entwicklung mit Git – BitBucket Dateien

Und bei SourceTree wird alles grün angezeigt, wenn alles funktioniert hat.

Shopware 5 Entwicklung mit Git - SourceTree nach Commit

Shopware 5 Entwicklung mit Git – SourceTree nach Commit

Spätere Updates können dann, nach dem Commit & Kommentieren mit dem Push Button hochgeladen werden. Außerdem empfiehlt es sich, zusätzlich Zweige zu den unterschiedlichen Anpassungen anzulegen. Der Ordner, der nun mit BitBucket verknüpft ist, liegt bei mir auch im Ordner meiner lokalen Shopware 5 Installation. So kann ich schnell und einfach das Design anpassen und Änderungen vornehmen die ich dann, wenn ich zufriden bin, in mein Repository hochlade und natürlich kommentiere.

Wenn man einmal damit angefangen hat möchte man es nicht mehr missen, es macht auch ein bißchen süchtig, also seid vorsichtig.

Nicht vergessen: Wenn Ihr less Dateien anpasst, und ihr keine Änderungen seht, muss das Theme kompliwert werden. Wenn ihr  jedoch tpl Dateien ändert solltet ihr den Shopcache löschen, falls ihr keine Änderungen zu sehen bekommt.

Weiterführende Literatur & Quellen:
Atlassion.com – Einführung in Git & wie man Repositorys anlegt.
https://confluence.atlassian.com/bitbucket/create-a-git-repository-759857290.html
Alternativer Artikel zum Thema:
http://8mylez.com/blog/git-nutzen-fuer-theme-entwicklung/
Codestellen finden:
http://forum.shopware.com/themes-und-design-f101/less-dateien-und-codestellen-finden-mit-firebug-t32546.html
Zur deutschen BitBucket Seite geht es hier entlang:
https://de.atlassian.com/software/bitbucket

Pin It on Pinterest

Share This