Introducción
Estos son unos sencillos pasos que usualmente sigo para configurar un Virtual Host para los proyectos en los que suelo trabajar, así que intentaré explicarlo de la manera más clara y fácil posible.
Asumo que estés familiarizado con un entorno Linux/Ubuntu, así que no entraré en muchos detalles, a fin de cuentas no soy un experto en el manejo de servidores, pero esto es algo realmente sencillo.
Configuración
Para crear un Virtual Host, lo primero que necesitamos en un archivo de configuración con con las directivas necesarias para tal fin.
En nuestra terminal ejecutamos el siguiente comando (en mi caso uso nano, pero puedes usar el editor que más re plazca, como vim por ejemplo) con el cual crearemos el archivo de configuración.
$ sudo nano /etc/apache2/sites-available/example.sandbox.conf
Luego copiamos el siguiente bloque, sustituyendo example.sandbox
por el nombre de dominio que desees usar. Salvamos los cambios y salimos del editor.
<VirtualHost *:80>
ServerName example.sandbox
ServerAlias www.example.sandbox
ServerAdmin webmaster@example.sandbox
DocumentRoot /var/www/example.sandbox
ErrorLog ${APACHE_LOG_DIR}/error.log
CustomLog ${APACHE_LOG_DIR}/access.log combined
<Directory /var/www/example.sandbox>
Options Indexes FollowSymLinks
AllowOverride All
Require all granted
</Directory>
</VirtualHost>
Apache
Luego debemos decirle a Apache que habilite la configuración que acabamos de crear, para poder acceder luego desde el navegador al dominio que hemos elegido, en nuestro caso example.sandbox
.
Para ello, ejecutamos el siguiente comando desde nuestra terminal:
$ sudo a2ensite example.sandbox.conf
Si todo salió bien, recibiremos una respuesta como esta:
Enabling site example.sandbox.
To activate the new configuration, you need to run:
systemctl reload apache2
Ahora, como indica el mensaje en la línea de comandos, debemos reiniciar el servicio de Apache:
$ sudo systemctl reload apache2.service
Para estar seguros que la configuración que hemos creado no presenta errores, podemos usar el siguiente comando:
$ sudo apache2ctl configtest
En caso de que todo esté bien, la respuesta será Syntax OK
.
IP
Este paso es muy sencillo, solo debemos apuntar nuestro dominio example.sandbox
al IP de nuestro ordenador, que por regla general es 127.0.0.1
.
Para ello tenemos que editar el archivo hosts
de nuestro ordenador, así que una vez más usamos la línea de comandos:
$ sudo nano /etc/hosts
Entonces escribimos este bloque al final de dicho archivo:
# VirtualHosts
127.0.0.1 example.sandbox
Directorio de trabajo
Finalmente solo nos queda crear el directorio donde vamos a alojar nuestro proyecto, que en este caso debe coincidir con lo que tenemos en el bloque Directory
del archivo de configuración example.sandbox.conf
.
$ sudo mkdir /var/www/example.sandbox
El siguiente paso es asignarle al usuario actual (el usuario con que estamos autenticados en el sistema) la propiedad del directorio que acabamos de crear. También lo agregaremos al grupo de Apache:
$ sudo chown -R $USER:www-data /var/www/example.sandbox/
Proyecto
Ya estamos listos para crear nuestro proyecto.
Como vimos en el paso anterior, ahora el directorio /var/www/example.sandbox/
nos pertenece, así que ya no necesitamos usar el comando sudo
para trabajar en él.
Ya podemos crear nuestra primera página. En este sencillo ejemplo haremos lo siguiente:
$ nano /var/www/example.sandbox/index.html
Pega este bloque de código en el archivo index.html
que estamos creando y salva los cambios.
<html>
<head>
<title>Example Project</title>
</head>
<body>
<h1>Hello World!</h1>
<p>This is the landing page of <strong>Example Project</strong>.</p>
</body>
</html>
Ahora ya puedes acceder desde tu navegador a la dirección http://example.sandbox/ y verás la página que acabamos de crear.
Conclusiones
Usar Virtual Host en nuestro servidor local ofrece muchas ventajas, sobre todo porque se asemeja mucho más al entorno que tendremos en producción que si tuviéramos una dirección del tipo http://localhost/example.com/.
Un caso de uso es cuando trabajamos con una instalación de WordPress Multi Site, en este caso podremos usar la configuración de subdominios, y no estaremos atados a la configuración de directorios, que no siempre es la deseada en producción.
Espero que esta sencilla guía te sirva de ayuda. Antes te dejo un pequeño consejo que te puede servir de mucha ayuda, sobre todo si eres novicio en estos menesteres.
Pro Tip:
Si nuestro proyecto se llama ACME Project, debes basarte en ese nombre para crear las directivas en el archivo de configuración, directorios, etcétera. Estos siempre deben coincidir, así te evitas problemas o configuraciones más complicadas en el futuro.
En este caso, el dominio sería acme-project.sandbox
y el directorio donde se debe alojar sería /var/www/acme-project.sandbox
y así sucesivamente.
Entorno de desarrollo con NPM y WebPack - RogerTM says:
[…] vez que hayamos configurado nuestro servidor para alojar nuestro proyecto, ya podemos comenzar con el asistente que nos ayudará a crear el […]
Engel says:
Muy buena guía. ¿Pudieras hacer una con Nginx? Actualmente todos los sitios de WordPress que se dockerizan se hacen con Nginx.
Felicidades x tu Blog. Tiene una muy buena experiencia
WordPress Multi Dominio - RogerTM says:
[…] cosa importante es que necesitamos configurar un Virtual Host para nuestro proyecto, de otra manera nos será imposible, pues WordPress nos dará solo la opción […]