PHPStorm

ist eine kommerzielle, leistungsfähige Entwicklungsumgebung (Integrated Development Environment / IDE) für Webprojekte. Sie bietet insbesondere gute Unterstützung für Projekte, in denen die Programmiersprache PHP genutzt wird. Studierende erhalten eine kostenlose Educational License für PHPStorm.

Im Vergleich zu einfachen Texteditoren bieten IDEs oft viele Vorzüge beim Entwickeln von Software:

• Explizite Unterstützung bestimmter Programmiersprachen durch Syntax Highlighting, Fehlerkorrektur usw.
• Verwaltung von Projekten
• Integrierte Werkzeuge wie FTP- und SSH-Client
• Automatischer Upload auf einen entfernten Server
• Integration für Versionskontrollsystem wie z.B. Git

Projekteinrichtung

Der erste Schritt bei der Arbeit mit PHPStorm ist die Einrichtung eines Projekts. Bei der Projekteinrichtung wird ein lokales Verzeichnis auf deinem Computer vorbereitet, in dem dein Programmcode gespeichert wird.

• Wähle File › New Project im Hauptmenü des Programms.
• Der Dialog, der sich daraufhin öffnet, schlägt dir einen Speicherort für dein Projektverzeichnis auf deinem Computer vor. Ändere den Standard-Verzeichnisnamen von untitled zu einem aussagekräftigen Namen. Vermeide aus Sicherheitsgründen wie üblich Leer- und Sonderzeichen in Datei- und Verzeichnisnamen, nutze am besten nur die Buchstaben A-Z, die Ziffern 0-9 sowie Binde- und Unterstriche.
• Dein Projektverzeichnis wird nun vorbereitet und du solltest die PHPStorm-Standardansicht wie unten dargestellt sehen.

Projektansicht

Linkerhand zeigt dir PHPStorm einen Verzeichnisbaum mit allen Ressourcen in deinem Projektverzeichnis. Du kannst Dateien und Verzeichnisse von anderen Speicherorten auf deinem Computer per Drag & Drop in dein Projekt verschieben bzw. kopieren. Alternativ kannst du natürlich auch dein Projektverzeichnis im Windows Explorer bzw. Mac Finder lokalisieren und Dateien auf diese Weise organisieren.

Neue Web-Dateien kannst du bequem über das Kontextmenü (Rechtsklick) im Verzeichnisbaum anlegen. Wähle dazu New und den Dateitypen, den du erzeugen möchtest, z.B. eine neue HTML-Datei:

Sobald eine Datei existiert und im Verzeichnisbaum linkerhand aufgeführt ist, kannst du sie über das Kontextmenü in einem installierten Browser öffnen. PHPStorm startet dazu im Hintergrund einen einfachen Webserver auf deinem Computer, der u.a. in der Lage ist, PHP-Programmdateien auszuführen, und ruft die Datei über den Webserver ab. Dies ist ein grundlegend anderer Vorgang, als wenn du die Datei einfach von deiner Festplatte aus im Browser öffnest — dann findet keine Programmauswertung statt und du würdest rohen Programmcode sehen.

Serververbindungen

Einer der wichtigsten Vorzüge bei der Arbeit mit PHPStorm ist es, dass sowohl ein SSH-, als auch ein FTP-Client direkt integriert ist.

SSH-Verbindung

Du stellst eine SSH-Verbindung zu einem entfernten Server, zum Beispiel deinem Hetzner-Webspace, direkt aus PHPStorm heraus her, indem du im Menü Tools › Start SSH Session… wählst.

Beim ersten Start wirst du zunächst eine neue SSH-Verbindung einrichten müssen. Bei folgenden Starts wirst du aus den bereits angelegten Einträgen wählen können.

Du findest alle notwendigen Verbindungsparameter in deiner Hetzner-Verwaltungsoberfläche:

• Trage bei Host am besten die IP-Adresse deines Servers ein — die ist am eindeutigsten. Alternativ kannst du hier auch deinen Domainnamen verwenden, oder den Hetzner-internen Servernamen (z.B. www127.your-server.de).
• Der Port ist bei Hetzner 222 (abweichend vom Standard 22).
• Den User name sowie das Password findest du in deiner Hetzner-Oberfläche. Vergiss nicht, das Passwort speichern zu lassen, um es nicht immer wieder eingeben zu müssen.

ACTHUNG: Es ist extrem wichtig, dass du beim Kopieren des Passworts aus der Hetzner-Oberfläche nicht versehentlich ein Leerzeichen am Anfang oder am Ende mitkopierst — dies passiert leider häufig. Füge den Inhalt deiner Zwischenablage sicherheitshalber kurz ein ein Textdokument ein und prüfe, dass keine Leerzeichen enthalten sind. Wenn du dein Passwort drei Mal falsch angibst, z.B. mit einem überflüssigen Leerzeichen, sperrt Hetzner deinen Zugang für eine Weile und du kannst in dieser Zeit keine Verbindung mehr herstellen.

Beim ersten Herstellen der Verbindung wirst du gebeten, die Vertrauenswürdigkeit des entfernten Servers zu bestätigen. Sobald die Verbindung erstmals hergestellt wurde, blendet PHPStorm eine Konsoleneingabe ein, die dieselben Möglichkeiten bietet wie bei einer SSH-Verbindung mit PuTTY oder KiTTY.

FTP- / SFTP-Verbindung

PHPStorm bietet verschiedene Verbindungsmöglichkeiten an, mit denen Dateien mit entfernten Servern ausgetauscht werden können. Die Verbindungsarten unterscheiden sich durch das verwendete Protokoll, mit dem kommuniziert wird:

• File Transfer Protocol (FTP)
• SSH File Transfer Protocol (SFTP)

Bei letzterem wird die Übertragung durch eine zuvor hergestellte SSH-Verbindung (sog. SSH-Tunnel) durchgeführt und findet deshalb verschlüsselt statt. Im Folgenden wird die Einrichtung und Nutzung einer »einfachen« FTP-Verbindung beschrieben.

Wie bei SSH-Verbindungen können in PHPStorm beliebig viele FTP-Verbindung konfiguriert und hinterlegt werden. Die Liste der eingerichteten Verbindungen lässt sich über Tools › Deployment › Browse Remote Hosts öffnen:

Beim ersten Öffnen sollte die Liste der hinterlegten Verbindungen zunächst leer sein. Über die … -Schaltfläche lässt sich eine neue Verbindung einrichten:

Auch zur Einrichtung einer neuen FTP-Verbindung werden die Angaben aus der Hetzner-Verwaltungsoberfläche benötigt. Die eingeblendeten Dialoge können sich von PHPStorm-Version zu Version leicht unterscheiden. Im ersten Schritt sollte ein Server anzugeben sein — nutze hier am besten wieder die IP-Adresse deines Webspace und belasse es bei der Voreinstellung FTP als Verbindungstyp:

Trage im nachfolgenden Dialog alle erforderlichen Datein ein:

• Der Standard-Port für FTP ist 21.
• Speichere dein Passwort, um es nicht wieder und wieder angeben zu müssen.
• Nutze die Test Connection-Schaltfläche, um die Gültigkeit deiner angaben zu prüfen
• Beim Herstellen der Verbindung kann der FTP-Client automatisch in ein Unterverzeichnis verwiesen werden. Dieses kann als Root path festgelegt werden — es ist dann nicht möglich, dieses Verzeichnis »nach oben hin zu verlassen«. Sobald du korrekte Verbindungsdaten zum Server angegeben und die Test Connection-Schaltfläche erfolgreich nutzen konntest, kannst du die kleine Ordner-Schaltfläche rechts im Root path-Eingabefeld nutzen, um die entfernten Verzeichnisse auf dem Server zu durchsuchen. Wenn du z.B. eine FTP-Verbindung zu deinem Wordpress-Projekt anlegen möchtest, dann nutze als Root path das Wordpress-Wurzelverzeichnis /public_html/wordpress und stelle unter Web server URL dann die passende Subdomain http://wordpress.<deinedomain>.de ein.
• Gib deinem Eintrag linkerhand einen aussagekräftigen Namen. Du kannst den Eintrag über das Kontextmenü umbenennen.

Schließe den Dialog nach erfolgreicher Einrichtung. Du solltest deine neu angelegte Serververbindung nun im Auswahlmenü finden und auswählen können. Sobald die Verbindung erfolgreich hergestellt wurde, werden darunter die Dateien und Verzeichnisse auf dem Server dargestellt (in der Abbildung leer).

Datenübertragung

Sobald sowohl ein lokales Projekt, als auch ein entfernter Server angelegt wurde, können beide Speicherorte parallel angezeigt werden. Die einfachste Form der manuellen Dateiübertragung zwischen beiden Speicherorten kann per Drag & Drop durchgeführt werden:

Vor allem auf Dauer ist es aber viel interessanter, einen automatischen Upload vom lokalen Projekt zum Entfernten Server einzurichten. Auf diese Weise kannst du an deinen lokalen Dateien arbeiten und PHPStorm nimmt dir im Hintergrund die Arbeit ab, die Daten nach jedem Bearbeitungsschritt auf den Server zu übertragen. Um einen automatischen Upload einzurichten, müssen zwei Schritte ausgeführt werden:

Einrichten eines Verzeichnis-Mappings

Damit PHPStorm automatisch Dateien von einem lokalen Verzeichnis auf einen Server überträgt (»Synchronisation«), muss ein sog. »Mapping« zwischen lokalem und entfernten Verzeichnis eingerichtet werden. Öffne dazu die Einstellungen zur entsprechenden FTP-Verbindung über die …-Schaltfläche neben dem Verbindungs-Dropdown. Wechsle im Einstellungsdialog auf die Mappings-Registerkarte:

• Wähle bei Local Path das lokale Verzeichnis, das automatisch auf dem entfernten Server gespiegelt werden soll. In der Abbildung wird dazu direkt das Projekt-Wurzelverzeichnis genutzt.
• Wähle unter Deployment path das korrespondierende Verzeichnis auf dem entfernten Server. Im Beispiel wird direkt das Wurzelverzeichnis auf dem entfernten Server genutzt (repräsentiert durch /). Durch die Ordner-Schaltfläche rechterhand lässt sich das Verzeichnis auch durch Suchen und Klicken auswählen. Beachte, dass die Einstellung des Root paths hier greift (siehe Einrichtung der FTP-Verbindung) und du kein Verzeichnis außerhalb des Root path wählen kannst.
• Falls du ein Unterverzeichnis zur Synchronisation wählst, dann empfiehlt es sich, den relativen Pfad zum Unterverzeichnis auch im Feld Web path anzugeben.

Sobald du die Einrichtung des Verzeichnis-Mappings abgeschlossen hast, kannst du den Dialog schließen. Du kannst beliebig viele weitere Mappings einrichten — was im oben gezeigten Beispiel keinen Sinn ergäbe, da hier ohnehin das komplette Projekt gespiegelt wird. Nicht wundern: ab dem zweiten eingerichteten Mapping sieht der dargestellte Dialog etwas anders, eher tabellenartig aus.

Aktivieren des automatischen Uploads

Um den automatischen Upload zwischen dein eingerichteten Mappings schließlich zu aktivieren, musst du im Menü Tools › Deployment › Automatic Upload (always) einmalig aktivieren:

Ab diesem Zeitpunkt sollte PHPStorm jede Änderung, die du an lokalen Dateien (linker Verzeichnisbaum) vornimmst, automatisch auf den entfernten Server übertragen. ACHTUNG: Eine umgekehrte Übertragung — vom entfernten Server auf deinen lokalen Computer — findet nicht automatisch statt. PHPStorm bekommt von entfernten Änderungen nichts mit.

Manuelle Übertragung bei eingerichtetem Mapping

Wenn ein Mapping zwischen lokalem Projekt und entferntem Server eingerichtet ist, kann dieses Mapping auch genutzt werden, um bequem einzelne Dateien oder ganze Verzeichnisse an den korrespondieren Ort auf dem entfernten Server zu übertragen, ohne dass der richtige Speicherort manuell ermittelt werden muss. Wähle dazu im Kontextmenü einer Datei oder eines Verzeichnisses einfach den Punkt Deployment › Upload to ….

Dieser Schritt ist vor allem dann (mindestens einmalig) notwendig,

• wenn du eine Datei außerhalb von PHPStorm verändert hast (etwa, weil du ein Bild mit Photoshop verändert hast, wovon PHPStorm nichts mitbekommt), oder
• wenn du eine Datei neu zum Projekt hinzufügst (durch Drag & Drop in PHPStorm oder im Windows Explorer / Mac Finder, denn auch davon bekommt PHPStorm nichts mit).