Web-Development mit macOS

Glaubenskriege gibt es in der IT-Welt viele. Neben der ewig währenden Frage, ob emacs oder vim unter Masochisten nun der bessere Editor sei, ist besonders auch die Wahl des Betriebssystems für viele eine Grundsatzentscheidung. Die populärsten darunter – Windows, macOS (ehemals OS X) und Linux(-Derivate) – haben alle ihre Vorzüge und Eigenheiten, die für die Web-Entwicklung relevant sein können. In diesem Blog-Post zeigen wir euch, wie ihr euch bzw. euren Rechner fit für Web-Development mit macOS macht.

Web-Development mit macOS

Eine Frage des guten Geschmacks

Jeder Entwickler hat unterschiedliche Ansprüche an ein Betriebssystem. Die einen schätzen die große Anwendungsvielfalt unter Windows, die anderen die Flexibilität und Anpassbarkeit diverser Linux-Distributionen und wiederum andere die Ästhetik von macOS.

Ich persönlich setze im privaten und beruflichen Umfeld auf eine Kombination aus allen dreien. Windows 10 auf meinem Heim-PC, um gelegentlich zu Zocken. Manjaro (Linux) auf meinem ehemaligen Windows Notebook, da ich die Paketverwaltung und Command-Line-Tools unter Linux sehr zu schätzen weiß. Und schlussendlich macOS auf dem mac Mini in der Arbeit, da es mir ein schlankes User Interface (UI) liefert und ich dennoch auf viele Tools, die ich unter Linux liebe, zurückgreifen kann. Der macMini ist übrigens aus dem Jahr 2012, reicht aber dank i7 Prozessor, 16GB Arbeitsspeicher und SSD auch in 2019 noch für die Web-Entwicklung aus. Es muss also kein extrem teurer Rechner aus dem aktuellen Apple Line-Up sein.

Konsolen-Shenanigans

Wie schon vorhin erwähnt, ist mir die Command-Line bzw. ein Terminal sehr wichtig, da man damit viele Aufgaben sehr schnell erledigen kann und die Hände auch nicht von der Tastatur nehmen muss. In Zeiten von Node.js, npm und Docker kommt man ohne Terminal sowieso oft nicht aus. Als Shell setze ich hier auf Zsh in Verbindung mit Oh My ZshiTerm2 erfreut sich aber ebenfalls großer Beliebtheit.

Bevor ihr mit Homebrew (siehe weiter unten) und anderen Schmankerln loslegen könnt, benötigt ihr die Command Line Tools (CLT) for Xcode. Installiert euch diese mit xcode-select --install oder direkt mit Xcode.

Programmzustellung per Post Paketverwaltung

Wer einmal mit einer Paketverwaltung unter Ubuntu oder anderen Systemen gearbeitet hat, wird die Vorzüge schnell woanders vermissen. Ein bekanntes sudo apt-get install zsh und schon ist besagte Shell von vorhin am System installiert und wird auch mit Leichtigkeit aktualisiert.

Unter macOS gibt es dafür Homebrew. Anstatt sich Programme über Webseiten herunterzuladen und dann in den Applications-Ordner zu kopieren oder Installations-Routinen durchzuklicken, kann man damit schnell und unkompliziert alle möglichen Applikationen installieren.

Mit /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" startet man die Einrichtung von Homebrew über ein Terminal. Um dann darüber weitere Programme zu installieren, reicht ein einfaches brew install <programmname> So lassen sich die meisten Anwendungen installieren. Sollte eine mal nicht in den Paketquellen von Homebrew vorhanden sein, gibt es eventuell so genannte Taps, also Quellen von Dritten.

Web-Essentials

Mit Homebrew können nun viele der notwendigen Tools installiert werden. Zur Basis-Ausstattung eines Web-Entwicklers gehören die Versionskontrolle gitNode.js und npm (Node Package Manager). Node.js installiert man sich am besten über den Node Version Manager, damit man zwischen Projekten und unterschiedlichen Node.js-Versionen leicht wechseln kann. Für PHP-Entwickler natürlich PHP 7.x, MariaDB (oder ein anderes Datenbank-System wie MySQL oder PostgreSQL) und der PHP Paket-Manager composer.

Installiert und gestartet werden diese Programme mit folgenden Befehlen (möglicherweise muss das Terminal zwischen den einzelnen Befehlen neu gestartet werden):
brew install git nvm php mariadb composer nginx
brew services start mariadb
sudo brew services brew start nginx # runs as root to use port 80
brew services start php
nvm install node
nvm use node

Fehlende PHP-Module werden mit pecl install <module> geladen. Zum Beispiel pecl install xdebug zum Debuggen.

Ebenfalls für PHP-Entwickler interessant: Laravel Valet. Valet ist ein Programm, welches eure lokalen Projekte unter *.test Domains im Browser verfügbar macht. Nachdem ihr PHP und composer installiert habt, richtet ihr Valet mit composer global require laravel/valet ein. Mehr Details dazu in der offiziellen Dokumentation.

Ein tolles Tool für MySQL (und MariaDB) ist übrigens Sequel Pro, welches, auch wenn es der Name nicht vermuten lässt, Freeware ist. Es dient als Alternative zu phpMyAdmin und Adminer, funktioniert also unabhängig vom Webserver und lässt euch eure Datenbanken verwalten. Perfekt für Leute, denen das über das Terminal zu kompliziert oder langwierig ist.

Docker hingegen ist eine Container Plattform. Stell dir diese Plattform wie leichtgewichtige virtuelle Maschinen vor. Du kannst zum Beispiel deine Projekte in so einem Container laufen lassen, abgekapselt vom Rest deines Systems. Oder deine Datenbank. Oder deinen Webserver. Und und und. Um Docker einzurichten, stellt Homebrew wieder einen praktischen Befehl bereit:
brew cask install docker

Google Chrome (Browser) und Filezilla (FTP-Client) eignen sich ebenfalls hervorragend für die Web-Entwicklung. Chrome unterstützt meist sehr schnell neue JavaScript-Features und bietet zahlreiche Debugging-Optionen. Filezilla dient zum Übertragen von Dateien auf (S)FTP-Server, wirkt aber ein wenig altbacken in der Optik. Wer sich eine bessere (optische) Integration in macOS wünscht, wird vielleicht mit Cyberduck oder Transmit (kostet $45 USD) glücklicher.

Microsoft auf dem Mac

Als Editor bzw. IDE (Integrated Development Environment) schwöre ich auf Visual Studio Code von Microsoft. Der Editor basiert zwar auf Electron, was nicht gerade für seine Performance bekannt ist, lässt sich davon aber nichts anmerken. Visual Studio Code ist flott und bringt von Haus aus Debugging-Möglichkeiten und Git-Integration mit. Zusätzliche Features können bequem per Erweiterung hinzugefügt werden. Gibt es eine Erweiterung für Angular-Support? Jup. ESLint? Na klar. Node.js Debugging? Aber sowas von. Von diesen Erweiterungen gibt es zahlreiche für alle mögliche Programmiersprachen, Frameworks und Anwendungsfälle.

Wie ihr euch vermutlich schon denkt, gibt es auch von Visual Studio Code ein Paket für Homebrew mittels brew cask install visual-studio-code Alternativ einfach das Binär-Paket über die Homepage beziehen.

Tipps für den Umstieg von Windows und Linux

Wo es Licht gibt, da herrscht auch Schatten. Bei aller Liebe zur Entwicklung unter macOS fehlte mir von Haus aus aber ein vernünftiges Fenster-Management. Das Tool Magnet schafft hier Abhilfe und erlaubt es mir, Fenster per Tastaturkürzel oder Ziehen an den Bildschirmrand, hin und her zu schieben. So kann ich schnell mit zwei bis drei Tasten ein PDF auf die rechte, und meinen Editor auf die linke Bildschirmhälfte platzieren. Ich weiß bis heute noch nicht, wieso Apple das nicht direkt ins Betriebssystem integriert. Apropos Tasten und Tastaturkürzel: Wenn ihr auch mit der Apple-Tastatur nicht ganz klar kommt – oder eventuell sogar zwischen den Betriebssystemen wechseln müsst – und deshalb eine “normale” Tastatur einsetzt, kann ich euch Karabiner Elements ans Herz legen. Damit könnt ihr Tasten nach euren Wünschen neu belegen.

Ich hoffe, ihr habt mit diesem Blog-Post einen Einblick in die Web-Entwicklung unter macOS bekommen und eventuell das ein oder andere Tool für euch entdeckt. Am Ende des Tages ist es nicht von Bedeutung, ob auf eurem Rechner ein Apfel, Fenster oder Pinguin prangt. Ihr müsst mit eurem System produktiv arbeiten können.