PHP Server mit Visual Studio Code

PHP mit Visual Studio Code.md

PHP Server mit Visual Studio Code

Um mehrseitige, dynamische Websites mit Visual Studio Code zu erstellen, benötigst du eine Programmiersprache – wir verwenden hier im Beispiel PHP – und einen Server, der dir die Website im Browser bereitstellen kann.

• Installation von PHP
• Einrichtung des Servers
• Einrichtung von Live Reload
• Website entwickeln

Installation und Einrichtung

Installation von PHP

HINWEIS: Wenn du einen Computer von Apple hast (MacBook, Mac Mini, iMac), ist PHP bereits installiert. Überspringe daher diesen Abschnitt.

• Lade dir PHP (Version „VC16 x64 Non Thread Safe“) von php.net herunter.
• Lege dir auf der Festplatte den Ordner C:/php an.
• Entpacke die ZIP-Datei vom Download und verschiebe alle Dateien in C:/php. Hier sollte nun die Datei php.exe enthalten sein.
• Benenne die Datei php.ini-development in php.ini um.

Einrichtung des Servers

• Öffne Visual Studio Code und gehe in den Bereich „Erweiterungen“.
• Suche nach der Erweiterung PHP Server. Installiere und aktiviere sie anschließend.
• Öffne die Einstellungen von Visual Studio Code mit STRG + , (Windows) bzw. Command + , (Mac) und gebe im Suchfeld phpserver ein.
• Trage im Feld Phpserver: PHP Path das ein: C:/php/php.exe.

HINWEIS: Mac-User brauchen in der Regel im Feld PHP Path nichts einzutragen. Sollte dies nicht ausreichen, trage dort /usr/local/bin/php.

Einrichtung von Live Reload

Die Erweiterung „Live Server“ sorgt in Visual Studio Code dafür, dass deine statische HTML-Website im Browser bereitstellt werden kann. Diese wird zudem bei jeder Dateiänderung automatisch neu geladen (Live Reload). Damit du das ebenfalls mit deiner dynamischen Website verwenden kannst, sind folgende Schritte nötig:

• Installiere die Erweiterung PHP Server und aktiviere sie.
• Öffne die Einstellungen von Visual Studio Code mit STRG + , (Windows) bzw. Command + , (Mac) und gebe im Suchfeld liveserver ein.
• Im Bereich Custom Browser trage am Besten Chrome ein.
• Die Checkbox Use Web Ext sollte aktiviert sein.
• Installiere dir nun für Chrome die Live Server Extension.

Website entwickeln

Ist alles erledigt, kann die eigentliche Arbeit losgehen. Erstelle dir in Visual Studio Code nun ein neues Projekt und lege dort die Datei index.php. Kopiere dort folgendes hinein und speichere sie:

<?php

echo 'Hallo Welt!';

Server starten

Folgende Schritte sind immer dann nötig, wenn du deine Website entwickeln möchtest.

• Öffne die Datei index.php durch einen Doppelklick in Visual Studio Code
• Offne Befehlspaleete mit der Tastenkombination STRG + SHIFT + p (Windows) bzw. Command + SHIFTund p und trage im Feld php ein.
• Wähle den Eintrag PHP Server: Serve project. Dies öffnet die PHP-Website in deinem Browser. In der Regel unter der URL http://127.0.0.1:5500/. Kopiere dir diese Adresse.
• Klicke auf die Live Server Extension in Chrome, aktiviere dort Live Reload.
• Füge nun unter unter Actual Server Address die kopierte Adresse ein und speichere die Änderung durch Klick auf den Button Apply.
• Öffne noch einmal die Befehlspalette, suche nach liveserver und wähle den Eintrag Live Server: Open with Live Server.
• Kopiere dir die Adresse der sich öffnenden Website und trage sie in der Extension unter Live Server Address ein. Speichere die Änderung.

Viel Spaß!