Schneller Tipp Verwenden Sie CodeKit 2.0 für die lokale WordPress-Entwicklung

Das Arbeiten in einer lokalen Umgebung (dh direkt auf Ihrem eigenen Computer) ist ein Standardansatz, wenn Sie WordPress-Themes und Plugins erstellen. Es erspart Ihnen das Brechen einer Live-Site und beschleunigt den Prozess, indem Sie die Anforderungen an das Web reduzieren. Es hat jedoch einen Nachteil; Sie können nur auf Ihre lokale Umgebung zugreifen örtlich, auf Ihrem System. Das gleichzeitige Testen auf anderen Geräten und Systemen ist schwierig.

In diesem kurzen Artikel werde ich erklären, wie Sie Codekit 2.0 verwenden und Ihren lokalen Entwicklungsworkflow mit Stilinjektion, Browser-Aktualisierung und Gerätetests beschleunigen können, ohne dazu eine Codezeile zu berühren!

Lokale WordPress-Entwicklung

Um loslegen zu können, müssen Sie WordPress lokal einrichten. Wir haben ein paar Artikel zu Tuts +, die Ihnen den Einstieg erleichtern MAMP (eine lokale Serverumgebung, die Folgendes umfasst: Mac,EINPache, MySQL und PHP, Perl oder Python):

• So richten Sie eine Killer-WordPress-Testumgebung lokal ein
• Skelett für WordPress: Aufstehen und Laufen
  

Stellen Sie nach der Installation von MAMP sicher, dass es ausgeführt wird. 

Sie müssen auch die lokale URL kennen (häufig http: // localhost: 8888, aber Sie können diesen Apache-Port in den MAMP-Einstellungen definieren). Stellen Sie sicher, dass die lokale Site ordnungsgemäß funktioniert, bevor Sie fortfahren.

Codekit-Konfiguration

Codekit hat kürzlich ein umfangreiches Upgrade auf 2.0 durchgeführt, das die gleichzeitige Browseraktualisierung über mehrere Geräte hinweg sowie die Stilauswahl ermöglicht. In nur wenigen Schritten können Sie Codekit so einrichten, dass es mit Ihrem lokalen WordPress-Setup arbeitet.

Wenn Ihre lokale WordPress-Installation fertig ist und Sie MAMP ausführen, fügen Sie Ihr Design als Projekt zu Codekit hinzu. Sie können dies tun, indem Sie den Ordner des Themas in Codekit ziehen.

Externe Server-Einstellungen

Als Nächstes müssen wir Codekit mitteilen, wo unser lokaler MAMP-Server läuft. Aktualisieren Sie also die Einstellungen für "Externer Server":

1. Klicken Sie in Codekit auf das Zahnrad unter dem Namen des Projekts.
2. Klicken Sie auf die zweite Option Browser-Aktualisierung in der linken Seitenleiste.
3. Scrollen Sie nach unten zu Externer Server Einstellungen und drehen Externer Server erforderlich AUF.
4. Aktualisieren Sie die Externe Serveradresse mit der lokalen MAMP-URL der WordPress-Site (z. B. http: // localhost: 8888 / your-local-site oder wie in diesem Beispiel http://wptest.dev). Stellen Sie sicher, dass Sie diese URL besuchen, um sicherzustellen, dass sie korrekt ist und ordnungsgemäß funktioniert.

Um den Server zu verwenden, klicken Sie auf die Vorschau-Schaltfläche rechts oben in Codekit. Ihr Browser wird mit einer eindeutigen URL geöffnet (http: //Ihr-computername.local: 5757). Sie können jetzt diese URL manuell auf allen anderen Geräten aufrufen, die mit Ihrem WLAN-Netzwerk verbunden sind, um eine Verbindung zu den Browser-Aktualisierungen von Codekit herzustellen und Stilinjektionen zu erstellen.

Wenn Sie eine Datei in Ihrem Code-Editor speichern, wird der Browser aktualisiert, oder wenn Sie das Stylesheet aktualisieren, fügt Codekit die neuen Stiländerungen ein.

Codekit bietet auch Sass-Kompilierung (mit Libass), Style-Injection, Browser-Aktualisierung, Syntaxprüfung, Minification, Hooks und mehr mit nur einem Programm! Wenn Sie MAMP bereits verwenden, sollten Sie Codekit ausprobieren und beobachten, wie es Ihren Workflow beschleunigt.

Welche Tipps haben Sie für die lokale WordPress-Entwicklung, lassen Sie uns dies in den Kommentaren wissen!