Build- und Deployment-Plan mit Bitbucket Pipelines

Ich erzähle das ja gerne herum: Meinen Bastelkram lege ich in Repositories bei Bitbucket ab. Fast alles was ich so tue und probiere steht unter Versionskontrolle.

Unter anderem liegt dort auch das Theme dieses Blogs, an dem ich ziemlich regelmäßig Dinge ausprobiere und verändere. Das entwickele ich auf meinem eigenen Computer, committe und pushe meine Änderungen in das bei Bitbucket liegende Git-Repository. Dann verbinde ich mich per SSH auf meinen Server bei Uberspace und mache dort ein git pull. Meine Änderungen werden heruntergeladen. Dann sind die neuen Dateien online. So weit, so kompliziert.

Als dann letztens in meinem Postfach die Einladung zum Test von Bitbucket Pipelines vorfand, hatte ich gleich eine Idee in meinem Kopf: Als großer Freund von Automatismen dachte ich natürlich gleich daran, den oben beschriebenen Vorgang zu automatisieren. Gleichzeitig würde ich auch gerne die kompilierten Assets, also die aus dem SCSS generierten CSS-Dateien, das konkattenierte und minifizierte Javascript, die optimierten SVG-Dateien und das SVG-Sprite aus dem Repository löschen. Die werden nur auf dem ausliefernden Server gebraucht, sie müssen nicht unter Versionskontrolle stehen.

Bitbucket Pipelines bietet einem die Möglichkeit in einem Docker-Container anhand einer Konfigurationsdatei verschiedene Aktionen auszuführen. Mit ein bisschen Probiererei kam dann am Ende diese bitbucket-pipelines.yml-Datei heraus:

# barabal-gerstle-theme build and deployment for dertagundich.de

# use node-image to build the theme-assets
image: node:4.6.0

pipelines:
  branches:
    # only build master-branch
    master:
      - step:
          script:
            # install needed tools and build assets
            - npm install
            - node_modules/.bin/gulp build
            # prepare ssh-connection to uberspace
            - mkdir -p ~/.ssh
            - cat my_known_hosts >> ~/.ssh/known_hosts
            - (umask  077 ; echo $MY_SSH_KEY | base64 --decode > ~/.ssh/id_rsa)
            # remove unneccessary files before deployment
            - rm -rf node_modules
            - rm -rf source
            # copy files to uberspace
            - scp -r * username@host.uberspace.de:~/domain.tld/wp-content/themes/theme-autodeploy

Ein paar Anmerkungen, auch wenn eigentlich schon alles in den Kommentaren steht:

• Ich benutze einen node-Docker-Container zum Bauen meiner Dateien.
• Es wird nur auf Änderungen im Master-Branch meines Themes reagiert.
• Als erstes werden dann die zum Bauen des Themes notwendigen Werkzeuge per npm installiert. Und die Quelldateien dann von einem gulp-Task gebaut.
• Anschließend wird der Docker-Container so präpariert, dass man sich per SSH auf meinen Uberspace verbinden kann. Ich habe mich dabei an diese Anleitung hier gehalten. Da ist alles gut erklärt und einfach nachzuvollziehen.
• Die im Ordner "node_modules" gespeicherten Werkzeuge und die Quelldateien im Ordner "source" braucht es im Livesystem nicht. Deshalb werden die mal schön vor dem Kopieren gelöscht.
• Schließlich werden die für das Ausspielen des Themes notwendigen Dateien auf den Uberspace kopiert.

Um die zwei Minuten dauert das alles im Schnitt, ich bin mit der Lösung sehr zufrieden. Gerade wenn eine Kleinigkeit am Theme zu machen ist, spare ich mir eine Menge Aufwand. Einfach die Änderung in den Master pushen. Zwei Minuten später ist alles fertig.