Desarrollo WordPress en Mac

Publicada en WordPress.

Mira nuestro vídeo

Existe una versión mejor de tu web

Comparte este artículo

Lo admito, tengo un Mac. Se trata de un MacBook Air del 2013, con bastantes batallas a sus espaldas, incluyendo el procesamiento de bastantes migraciones de webs a WordPress (perdí la cuenta cuando dejamos de hacerlas) y el desarrollo de nuestros plugins, Nelio A/B TestingNelio Content. El pobre sigue dando guerra cuatro años después, aunque empieza a tener sus achaques.

Mi primer mac fue un MacBook negro, allá por el 2007, antes de que llegaran las Apple Stores a España. Después de unos cuantos añitos como desarrollador en Mac (los últimos trabajando para la web y WordPress), tengo cierta experiencia con la plataforma y me siento cómodo con ella.

Hoy en día es muy habitual ver desarrolladores con Macs por todos los lados. Aún así, creo que puede ser útil explicar qué herramientas uso yo en mi día a día y qué utilidades puedes encontrar para mejorar tus habilidades como desarrollador WordPress en Mac.

Editores de código para WordPress

El editor de código es el santo grial de las utilidades necesarias para desarrollar en WordPress. Hay muchos y muy buenos, y seguramente escoger uno u otro depende muchísimo de los gustos del desarrollador. Así que te dejo la lista y ya eres tú el que decide:

  • VIM: el editor por excelencia para los más hackers del lugar. No tendrás que instalarlo en Mac porque ya viene. Sólo tienes que abrir un terminal y escribir vi. Si no lo has usado nunca, empieza con un tutorial como el que te enlazo aquí. Eso sí, la curva de aprendizaje va a ser divertida (literalmente, porque lo tienes hasta en aventura gráfica). Aunque te diré que si eres un master del vim, tu productividad puede aumentar muchísimo como desarrollador. Te lo digo por experiencia, ya que mi compañero David lo usa a diario y hace virguerías. Aunque si intentas hacer pair programming con él te puede dar un ictus fácilmente.
  • TextMate: un editor sencillo que ha ido perdiendo fuelle a lo largo de los años. En su día fue competencia de SublimeText, pero parece que ha quedado relegado a una posición más testimonial.
  • SublimeText: si te va tener un editor básico y altamente configurable, pero que sea más amigable que VIM, SublimeText puede ser el editor que necesitas. Es muy popular entre desarrolladores WordPress, ya que tiene miles de extensiones para que lo conviertas en tu preciada navaja suiza. Yo llegué a trastear con él un tiempo, pero tuve problemas con actualizaciones y casi siempre lo tenía roto. Aún así, una opción muy recomendable.
  • Brackets: estamos ante un editor más amigable que los anteriores y con una filosofía muy parecida a Atom, aunque algo menos popular. Para serte sincero, no lo conocía hasta que no me he documentado para escribir esta entrada, pero lo que he visto me ha gustado bastante. Tiene también la mayoría de extensiones típicas que necesitas, así que parece que vale la pena.
  • Atom: mi editor actual. Lo bueno que tiene es que viene con varias extensiones preinstaladas que ya te serán útiles, pero además puedes instalar tantas como quieras, ya que se está convirtiendo en uno de los editores más populares hoy en día. Sí, a veces puede ser un poco lento, pero las actualizaciones lo hacen cada vez mejor en cuanto a rendimiento.
  • Visual Studio Code: el último editor de la mano de Microsoft, que funciona sorprendentemente bien y es de código libre. Ahora mismo es la competencia más directa de Atom, ya que su público objetivo es similar. Si probaste Atom y no te gustó, te recomiendo este, ya que no le tiene nada que envidiar y el número de extensiones disponibles es parecido.
  • PHPStorm: si más que un editor necesitas un entorno de desarrollo integrado (IDE), como puede ser Eclipse, sin duda la opción que más te va a gustar es PHPStorm. Tiene funcionalidades de soporte al desarrollo en WordPress y a otros frameworks PHP. Es muy potente, pero para mi gusto se trata de un programa un poco pesado y con una interfaz de usuario un poco anticuada. Por eso lo dejé de usar hace ya tiempo, aunque creo que es una opción interesante para muchos perfiles de desarrollador.
Captura de pantalla de Atom, un editor de código escrito en Node.js, Coffeescript y Webkit.
Captura de pantalla de Atom, un editor de código escrito en Node.js, Coffeescript y Webkit.

VIM, SublimeText, PHPStorm, Atom, … elige el que más te guste y listo. Como ya te expliqué recientemente, yo uso ahora mismo Atom. Estoy razonablemente contento con este editor y con sus plugins, que me simplifican el trabajo como desarrollador WordPress. Aún así, tengo ganas de probar Visual Studio Code, que aunque sea de Microsoft, tiene una pinta muy buena.

Herramientas de control de versiones

Una vez que tienes código desarrollado, lo que necesitas es no perderlo. Para esto tienes herramientas de control de versiones como Git y Subversion. Y si además trabajas en equipo, aún te será más necesario, para que podáis coordinar el trabajo de todos, fusionar código y evitar que unos machaquen los cambios de otros. Ambas herramientas se utilizan desde la línea de comandos, pero si tienes alergia al terminal, aquí te dejo alternativas con interfaz gráfica para tu Mac. Nosotros con el terminal tenemos de sobra, pero seguro que alguna de estas te resulta útil:

  • SourceTree: cliente Git para Mac y Windows de los creadores de Bitbucket. Si no te defiendes con el terminal, desde aquí podrás trabajar con Git sin problemas. Lo estuve usando un tiempo, pero podía ser más rápido desde el terminal, así que lo dejé.
  • GitHub Desktop: cliente de Git para conectar tu cuenta de GitHub. Si alojas tus repositorios de código allí, te puede servir para controlar todo desde esta aplicación de escritorio.
  • Tower: cliente de Git para Mac y Windows con una interfaz bastante bonita. Se integra además con Bitbucket y Github, entre otros.
  • SmartSVN: cliente de Subversion multiplataforma, que además incluye comparación de archivos para ver sus diferencias.
  • Versions: cliente de Subversion exclusivo para Mac que te simplifica trabajar con tus repositorios SVN.
  • Cornerstone: cliente de Subversion exclusivo para Mac. Seguramente el que más funcionalidades avanzadas incluye manteniendo una interfaz de usuario bonita y sencilla de usar.
Captura de pantalla de SourceTree para Mac.
Captura de pantalla de SourceTree para Mac.

Hoy en día Git está mucho más extendido que Subversion, aunque en WordPress no acaba de ser así. Para subir el código de tu plugin a WordPress todavía tendrás que usar Subversion. Nosotros, para todo lo demás usamos repositorios privados Git alojados de forma remota y gratuita en Bitbucket. Recuerda que también tienes GitHub como alternativa.

Servidores WordPress para trabajar en local

Para poder desarrollar para WordPress necesitarás un servidor local de WordPress. Sin esto no podrás probar el código de tus temas, plugins o lo que sea que desarrolles, algo que no te recomiendo bajo ningún concepto. Hoy en día es mucho más fácil montarse un entorno de desarrollo con instalaciones WordPress de prueba. Existen varias alternativas que te paso a detallar aquí:

  • Varying Vagrant Vagrants (VVV): la opción «oficial» para desarrolladores de WordPress. Necesitarás tener instalado Vagrant y VirtualBox previamente. A partir de ahí, VVV se instala desde la línea de comandos, por lo que tendrás que tener cierta experiencia técnica. Si te funciona, es el mejor entorno a usar, pero a veces se rompe «porque sí». Y arreglarlo no siempre es sencillo. Además, tanto la gestión de nuevas instalaciones como la elección de configuraciones específicas se hace un poco engorrosa si no tienes cierto manejo con el terminal.
  • Local: hace lo mismo que VVV, pero mucho más fácil de instalar y gestionar. Tu sólo verás una interfaz con tus instalaciones WordPress y no tendrás que preocuparte de máquinas virtuales ni configuraciones ni nada más. Está desarrollado por la empresa de hosting Flywheel, pero es gratuito y nunca me ha fallado. Me pasé a Local harto de que me petara VVV cada pocos días y estoy encantado.
  • MAMP: paquete instalable que incluye servidor web Apache, base de datos MySQL y PHP. Las últimas versiones incluyen también la posibilidad de optar por NGINX en vez de Apache. Si no tienes demasiada idea de administración de servidores, esta opción te puede ser interesante ya que todo se controla desde un único panel. Eso sí, luego tendrás que instalar tu WordPress en el servidor directamente siguiendo las instrucciones del Codex.
Captura de pantalla de Local.
Captura de pantalla de Local.

Actualmente combino VVV con Local para mis instalaciones de WordPress en local. Aunque para serte sincero, Local es lo que más uso dada su facilidad y mayor rapidez.

Herramientas de diseño

En Nelio no somos muy especialistas en diseño, pero está claro que creemos que es un aspecto de vital importancia y por eso hacemos nuestros pinitos de vez en cuando para cubrir nuestras necesidades. Aquí tienes la lista de herramientas que conocemos:

  • ScreenFlow: herramienta para grabar la pantalla de tu ordenador y además editar vídeo. Estamos encantados con ella, ya que nos ayudó a conseguir crear el vídeo promocional de Nelio Content.
  • Inkscape: herramienta de dibujo vectorial multiplataforma que también funciona para Mac, aunque he de decir que no está muy bien adaptada a Mac OS X. La sigo usando porque David me enseño a manejarla en nuestra etapa en la Universidad cuando los dos usábamos Ubuntu y me encanta. Cuando la porten de verdad a Mac será un lujo, pero por lo menos funciona.
  • GIMP: programa de manipulación de imágenes que viene del mundo Linux y también funciona para Mac. La usamos mucho en Nelio para trabajar con imágenes, banners, y demás.
  • Sketch: herramienta de dibujo vectorial avanzado. No la he llegado a usar nunca porque en Nelio tampoco tenemos demasiadas necesidades ahora mismo, pero la tengo en mi lista de opciones a probar en el futuro. La veo como un sustituto de Inkscape si finalmente abandonan la creación de una versión Mac nativa de este.
Captura de Screenflow incluyendo las pistas de audio.
Captura de Screenflow.

Lo sé, no he añadido ninguna herramienta de Adobe (véase Photoshop, Lightroom, Premiere…), pero la verdad es que no utilizamos ninguna ni hemos tenido necesidad de utilizarla con las alternativas que te he expuesto antes. Si en algún momento nos especializamos más en diseño, seguramente la lista acabará creciendo.

Otras utilidades para desarrolladores web

Además de todo lo anterior, no quiero terminar el artículo sin olvidarme de listar una serie de herramientas que nos parecen muy útiles para tener a mano cuando eres desarrollador web WordPress. Aquí las tenéis:

  • Poedit: la internacionalización es muy importante. Si tienes que traducir tus temas y plugins, esta es la herramienta perfecta para hacerlo. Además, la versión Pro tiene soporte para temas y plugins para WordPress.
  • Postman: muchas veces necesitas hacer peticiones HTTP a servidores para comprobar que tanto las llamadas como las respuestas son correctas. Puedes utilizar wget o curl desde el terminal, pero con Postman tienes la posibilidad de simplificar el proceso gracias a su interfaz.
  • Transmit: para poder subir archivos a un servidor remoto o descargarlos, tienes la opción de utilizar ftp o sftp (o incluso lftp, del que un día hablaré) desde el terminal. Sin embargo, a mí me gusta utilizar Transmit para guardar mis contraseñas de conexión y trabajar de forma más cómoda. Otra opción es Filezilla, aunque la interfaz de Transmit me parece más moderna.
  • Node/NPM: en Nelio utilizamos este gestor de paquetes JavaScript para gestionar las dependencias en el código del cloud de Nelio Content. Facilita muchísimo ser más eficiente controlando paquetes y nuevas versiones de estos.
  • Gulp/Grunt: automatizar tareas durante el desarrollo (minificar archivos, combinarlos, etc.) es algo que te permite ahorrar parte de tu tiempo y simplifica tu vida. En Nelio utilizamos gulp y grunt para automatizar ciertas tareas relativas al desarrollo de nuestros plugins.
Captura de pantalla de Postman.
Captura de pantalla de Postman.

Si se nos ocurren más utilidades, las iremos añadiendo aquí.

Conclusión personal

Hoy en día puedes tener un entorno de desarrollo en condiciones para WordPress (o para web, en general) en cualquier plataforma, ya sea Mac, Linux o Windows. Muchos programas los encontrarás disponibles para más de una plataforma, así que lo más importante aquí es que escojas aquellos que domines más o con los que te sientas más cómodo.

Con las herramientas mínimas, es decir, un editor y un servidor de WordPress local tienes más que suficiente para empezar. No obstante, a medida que te vayas profesionalizando irás ampliando tu toolkit con más opciones. Nuestro arsenal ha ido creciendo a medida que íbamos desarrollando primero Nelio A/B Testing y luego Nelio Content.

Si utilizas herramientas que no aparecen en esta lista, por favor, comenta e iremos actualizando el artículo. Estoy seguro de que hay muchas más utilidades por ahí para ayudarte con el desarrollo para WordPress que vale la pena conocer. Así aprendemos todos.

Imagen destacada de Mikaela Shannon vía Unsplash.

6 comentarios en «Desarrollo WordPress en Mac»

  1. Muy interesante tu artículo Antonio.

    Solo aportar que yo usaba Atom para código y ahora estoy encantado con Brackets, mucho más amigable la interfaz y con módulos de integración con lenguajes de programación, por supuesto incluido todo WordPress, geniales y sencillos. Te recomiendo darle una oportunidad.

    En cuanto a cosas que se te hayan podido pasar, te recomiendo probar Coda, de la gente de Panic (Transmit) es un mix de cliente FTP y editor de código, en el que destaca, sobre cualquier otra cosa, el de CSS, con la opción de usar código puro o mediante paneles y deslizadores, lo que te ahorra montones de horas de programación. Se de gente que se ha pasado a Mac solo por Coda 🙂

    Ya puestos, te animo a que hagas un día una comparativa sobre clientes de SVN pues tengo una pelea con ellos tremenda y para subir plugins a WordPress.org es fundamental. Y siempre se me queda cara de gili y nunca sé si se han subido los cambios o como, es como una lotería (mientras no se deciden a pasar a Gits) 😀

    Un abrazo, muy interesante todo lo que publicáis el equipo Nelio, seguid así

    Fernando

    1. Gracias por el comentario Fernando. Probaré Brackets más adelante a ver que tal. Sobre Coda, creo que probé hace ya unos años una versión más antigua y no le saqué demasiado partido, pero le echaré un ojo también. Sobre clientes SVN, la verdad es que usamos directamente línea de comandos, pero puede ser interesante hacer una comparativa como la que propones. ¡Un abrazo!

Deja una respuesta

No publicaremos tu correo electrónico. Los campos obligatorios están marcados con: •

He leído y acepto la Política de privacidad de Nelio Software

Al marcar la casilla de aceptación estás dando tu legítimo consentimiento para que tu información personal se almacene en SiteGround y sea usada por Nelio Software con el propósito único de publicar aquí este comentario. Contáctanos para corregir, limitar, eliminar o acceder a tu información.