Visual Studio Code para PHP

Visual Studio Code es uno de los mejores editores de código fuente (si no el mejor). Es simple, rápido y además tiene muchas características como autocompletado (Intellisense), asistente de sintaxis, snippets y la posibilidad de añadir extensiones.

¿Estás planteándote si es posible utilizar Visual Studio Code para el desarrollo de PHP y páginas web? ¡Por supuesto que sí! En las siguientes líneas vamos a explicar qué ajustes es necesario realizar, y qué extensiones recomendamos instalar.

Configurar Visual Studio Code para PHP

Visual Studio Code utiliza el propio motor de PHP para interpretar la sintaxis del lenguaje de programación. Esto puede sonar trivial, pero es una buenísima noticia ya que esto permite que VS Code para PHP esté siempre a la última.

Para permitir que nuestro Visual Studio Code nos proporcione toda la potencia de PHP, lo primero que tenemos que hacer es modificar los Ajustes para decirle a VS Code dónde está instalado PHP.

Para ello, una vez abierto Visual Studio Code, vamos a Archivo -> Preferencias -> Ajustes (File -> Preferences -> Settings), o utilizamos el atajo de teclado «Control+,». Esto nos abrirá el panel de Ajustes que debemos modificar a continuación.

ajustes de visual studio code

Escribimos «php» en la barra superior para filtrar los ajutes y sólo mostrar los que necesitamos:

filtrar ajustes php

En este panel de ajustes, debemos asegurarnos que las opciones de «Enable» y «Run» estén marcadas. Tras esto, vamos a modificar el fichero settings.json para incluir la ruta al ejecutable de PHP que tenemos instalado en nuestro ordenador.

Nota: Si no tienes PHP instalado, necesitarás instalarlo previamente.

ruta de php en visual studio code

La ruta dependerá del Sistema Operativo que estés usando (Windows, Linux o Mac).

Llegados a este punto, ya podemos utilizar nuestro Visual Studio Code como IDE para desarrollar en PHP.

Extensiones PHP en Visual Studio Code

Antes de crearnos nuestro primer Hello World con PHP en Visual Studio, os recomendamos instalar las siguientes extensiones para el IDE que os harán la vida mucho más fácil 🙂

  • PHP IntelliSense: proporciona autocompletado de código según vayamos escribiendo.
  • PHP Debug: nos permite añadir puntos de interrupción e inspeccionar nuestro código y variables en tiempo real mientras se ejecuta.
  • PHP Extension Pack: contiene las dos anteriores 🙂
extensiones php para vs code

Para ello debemos pinchar en el botón de extensiones del menú lateral izquierdo, y filtrar por «php». Pinchamos en el botón «Install» para cada una de ellas, y listo.

Debug PHP en Visual Studio Code

Depurar nuestro código PHP con Visual Studio Code es más fácil que nunca gracias a la extensión PHP Debug que hemos comentado en la sección anterior.

Es muy importante el hecho de poder hacer debug de nuestro código, ya que podremos parar la ejecución con puntos de interrupción (breakpoints) que nos permitirán ver el valor de variables y/o entender la forma en que ejecuta nuestro código.

Para comprender bien cómo funciona la depuración en VS Code os recomendamos echar un vistazo a esta guía publicada en la web de Visual Studio.

HelloWorld en PHP con Visual Studio Code

Llegados a este punto, ya tenemos listo nuestro Visual Studio Code para comenar a desarrollar PHP 🙂

Lo primero que tenemos que hacer, como siempre que utilizamos VS Code, es abrir una Carpeta o Espacio de trabajo (Workspace) para comenzar a trabajar.

abrir carpeta en vscode

En mi caso, creo una nueva carpeta HelloWorldPHP (de momento vacía) y la selecciono. A continuación, creamos un nuevo fichero llamado index.php y que será el punto de entrada de nuestra web en PHP.

Para verlo en el navegador, podemos hacer botón derecho sobre el fichero index.php y abrirlo con cualquier navegador (Chrome, Firefox, Safari, etc). De momento esto nos servirá, ya que aún no hemos añadido código PHP.

Finalmente, vamos a probar a introducir código PHP en nuestra web, para comprobar que toda la configuración de Visual Studio Code es correcta. Por ejemplo, podemos probar a mostrar en nuestra página web información sobre la instalación de PHP (versión, etc).

intellisense php en visual studio code

Como veis, el código PHP se introduce entre las etiquetas <?php y ?>, ya que es la sintaxis típica de PHP. Mientras escribimos dentro de estas etiquetas, tenemos ayuda por parte de la extensión de IntelliSense que hemos activado previamente, de forma que no tenemos que aprendernos de memoria todas las funciones disponibles en PHP.

Utilizar un servidor local de PHP

Tras introducir código PHP en el fichero index, te habrás dado cuenta de que no se visualiza en nuestro navegador. Esto es porque el código PHP necesita un servidor para poder ser ejecutado, así que ya no vale símplemente con abrir el fichero index.php con nuestro navegador.

Esto no será necesario cuando estemos desplegando nuestra web PHP en un servidor, pero sí en nuestro ordenador o PC local de desarrollo.

Un workaround rápido es abrir con un Explorador de Archivos la carpeta donde está nuestro index.php, y levantar una Terminal/Consola/Powershell. A continuación escribimos el comando:

terminal servidor web local php

Y en ese momento ya tendremos un servidor local que es capaz de ejecutar nuestra web PHP en la dirección http://localhost:8001 (en vez de 8001, puedes elegir el puerto que quieras que no esté ocupado).

Conclusiones

En este artículo hemos visto cómo configurar Visual Studio Code para PHP. Es un tema muy interesante ya que VS Code es uno de los editores de código fuente más potentes y ligeros que existen a día de hoy.

La experiencia de desarrollo con Visual Studio Code es una de las mejores que he tenido. entre todos los IDE que he probado, así que espero que os haga la vida un poco más fácil a la hora de desarrollar vuestras webs en PHP.