Astuce utilisez CodeKit 2.0 pour le développement WordPress local

Travailler dans un environnement local (c'est-à-dire: directement sur votre propre ordinateur) est une approche standard lors de la création de thèmes et de plug-ins WordPress. Cela vous évite de casser un site actif, tout en accélérant le processus en réduisant les requêtes sur le Web. Il y a un inconvénient cependant; vous ne pouvez accéder qu'à votre environnement local localement, sur votre système. Il est difficile de tester simultanément sur d'autres appareils et systèmes que vous pourriez avoir..

Dans cet article rapide, je vais vous expliquer comment utiliser Codekit 2.0 et accélérer votre flux de travail de développement local avec l'injection de style, l'actualisation du navigateur et les tests de périphériques sans toucher une ligne de code à configurer.!

Développement WordPress local

Pour commencer, vous devez installer WordPress localement. Nous avons quelques articles sur Tuts + pour vous aider à commencer à utiliser MAMP (un environnement de serveur local comprenant Mac,UNEpache, MySQL et PHP, Perl ou Python):

  • Comment configurer un environnement de test WordPress Killer localement
  • Skeleton to WordPress: Se lever et courir

Une fois MAMP installé, assurez-vous qu'il est en cours d'exécution. 

Vous aurez également besoin de connaître l'URL locale (souvent http: // localhost: 8888 par défaut, mais vous pouvez définir ce port Apache dans les préférences MAMP). Assurez-vous que le site local fonctionne correctement avant de continuer..

Configuration du kit de code

Codekit a récemment effectué une mise à niveau majeure vers la version 2.0, offrant l'actualisation simultanée du navigateur sur plusieurs périphériques, ainsi qu'une injection de style. En quelques étapes, vous pouvez configurer Codekit pour qu’il fonctionne avec votre configuration WordPress locale..

Une fois que votre installation WordPress locale est prête et que MAMP est en cours d’exécution, ajoutez votre thème en tant que projet à Codekit. Vous pouvez le faire en faisant glisser le dossier du thème dans Codekit.

Paramètres du serveur externe

Ensuite, nous devons indiquer à Codekit où notre serveur MAMP local est en cours d’exécution. Mettons à jour les paramètres "External Server":

  1. Cliquez sur l'engrenage sous le nom du projet dans Codekit..
  2. Cliquez sur la deuxième option intitulée Rafraîchissement du navigateur dans la barre latérale gauche.
  3. Faites défiler jusqu'à la Serveur externe paramètres et tour Serveur externe requis SUR.
  4. Mettre à jour le Adresse du serveur externe avec l'URL MAMP locale du site WordPress (par exemple, http: // localhost: 8888 / your-local-site, ou comme dans cet exemple http://wptest.dev). Assurez-vous de visiter cette URL pour vous assurer qu'il est correct et qu'il fonctionne correctement.

Pour commencer à utiliser le serveur, cliquez sur le bouton Aperçu en haut à droite de Codekit. Votre navigateur sera ouvert avec une URL unique (http: //votre-ordinateur-nom.local: 5757). Vous pouvez maintenant visiter manuellement cette URL sur tout autre appareil connecté à votre réseau wi-fi pour vous connecter au rafraîchissement du navigateur Codekit et aux injections de style..

Lorsque vous enregistrez un fichier dans votre éditeur de code, le navigateur s'actualise ou, si vous mettez à jour la feuille de style, Codekit injecte les nouveaux changements de style..

Codekit offre également la compilation Sass (avec Libass), l’injection de style, le rafraîchissement du navigateur, la vérification de la syntaxe, la minification, les hooks et plus avec un seul programme! Si vous utilisez déjà MAMP, essayez Codekit et regardez-le accélérer votre flux de travail..

Quels conseils avez-vous pour le développement WordPress local, laissez-nous savoir dans les commentaires!