Configurar um Ambiente de Desenvolvimento Local WordPress com Vagrant

Se você desenvolve com WordPress, é preferível configurar um ambiente local onde você tenha instalado um servidor, uma ferramenta de banco de dados e alguns sites WordPress junto com outras ferramentas que você precisa. Isso é aceitável se você trabalha em apenas alguns projetos. Mas quando eles se multiplicam, problemas ocorrem. E também as dores de cabeça de manter múltiplos ambientes, porque o cliente tem uma configuração diferente da sua.

Para contornar esse problema, podemos usar o que chamamos de Vagrant. O Vagrant é uma ferramenta para trabalhar com ambientes virtuais. Ele fornece uma maneira fácil de configurar um ambiente de desenvolvimento local com alguns comandos, e você pode replicar uma configuração completa quantas vezes quiser, com facilidade e sem a complicação de instalar tudo manualmente. Para executar o Vagrant, você precisa definir um conjunto de regras. O Vagrant configura sua máquina virtual com base nessas regras. O Vagrant precisa de dois arquivos para isso: Vagrantfile, que informa ao Vagrant que tipo de hardware a máquina virtual precisa, e um arquivo de implantação, que diz ao Vagrant o que fazer na máquina virtual.

Como o Vagrant trabalha com ambientes virtuais, você precisa de um software de máquina virtual para executar o Vagrant. Para nossos propósitos, usaremos o Virtualbox de Código Aberto.

Instalando o VirtualBox

Acesse a página de download do Virtualbox e baixe um arquivo binário correspondente ao seu sistema operacional hospedeiro. (O sistema operacional hospedeiro é o sistema operacional de onde você estará executando seu ambiente de desenvolvimento.) Instale o Virtualbox.

Instalando o Vagrant

Baixe o binário correspondente ao seu sistema operacional na página de download do Vagrant e instale-o.

Para testar se foi instalado com sucesso, digite o seguinte comando na linha de comando do seu sistema operacional.

$ vagrant -v

Instalando o Plugin Vagrant Hosts Updater

O plugin vagrant-hostupdater modificará o arquivo hosts do seu sistema operacional para que os domínios configurados pelo Vagrant funcionem. Para instalá-lo, execute o seguinte comando

$ vagrant plugin install vagrant-hostsupdater

Reinicie seu sistema operacional após instalar o Vagrant/Virtualbox para que não haja problemas de rede.

Instalando o Git

Linux

Também precisaremos do controle de versão do Git para este tutorial. Se você não o tiver instalado, instale-o usando o seguinte comando se você tiver uma distribuição Debian/Ubuntu

$ sudo apt install git

ou se você tiver Fedora

$ sudo dnf install git

ou se você tiver CentOS/RHEL

$ sudo yum install git

Verifique a versão do Git instalada via o seguinte comando

$ git --version

Você verá algo como

$ git version 2.20.1

Você precisa configurar o Git através dos seguintes comandos.

$ git config --global user.name "Seu Nome"   
$ git config --global user.email "[email protected]"

Windows

Para instalar o Git no Windows, acesse a página de Download do Git e instale o binário.

Mac OS

Se você tiver o homebrew instalado, pode instalar o Git através do seguinte comando.

$ brew install git

ou você pode baixar um pacote binário da página de Download do Git e instalá-lo.

Instalar Varying Vagrant Vagrants

Em vez de criar uma configuração do Vagrant do zero, usaremos o Varying Vagrants Vagrant (VVV) - uma configuração Vagrant de código aberto destinada especificamente à criação de Ambientes de Desenvolvimento WordPress. Um VVV padrão configura sua máquina virtual com base no Ubuntu 18.04 junto com servidor Nginx, banco de dados MariaDB, PHP, WP-CLI, Node.js, MailHog, Composer, memcached, phpMyAdmin, git e várias outras ferramentas. O VVV lhe dará várias instalações do WordPress por padrão, uma delas sendo a versão mais recente para ajudá-lo a experimentar.

O primeiro passo é clonar o repositório Git do VVV para um diretório local em seu sistema.

$ git clone -b master git://github.com/Varying-Vagrant-Vagrants/VVV.git ~/vvv

Aqui estamos clonando o branch master do repositório no sistema. Se você quiser atualizações mais rápidas, pode usar o branch develop.

Iniciando o VVV

Mude para o diretório onde você clonou o VVV.

$ cd vvv

Inicie o ambiente Vagrant que instalará a máquina virtual e configurará tudo.

$ vagrant up

Esse processo pode levar um tempo, então seja paciente. Você pode ser solicitado a fornecer sua senha de root durante o processo, que é necessária para configurar o arquivo hosts do seu sistema.

Nota para Usuários do Windows 8/10

Se você estiver no Windows, pode receber o seguinte erro

==> default: Booting VM...   
Houve um erro ao executar `VBoxManage`, um CLI usado pelo Vagrant   
para controlar o VirtualBox. O comando e o stderr estão mostrados abaixo.   
   
Comando: ["startvm", "1fe83aa1-2f23-4ddd-ad77-b7e7e00aabe6", "--type", "headless"]   
   
Stderr: VBoxManage.exe: erro: Falha ao abrir/criar a rede interna 'HostInterfaceNetworking-VirtualBox Host-Only   
Ethernet Adapter #3' (VERR_INTNET_FLT_IF_NOT_FOUND).   
VBoxManage.exe: erro: Falha ao anexar o LUN de rede (VERR_INTNET_FLT_IF_NOT_FOUND)   
VBoxManage.exe: erro: Detalhes: código E_FAIL (0x80004005), componente ConsoleWrap, interface IConsole

Note o Adaptador referido aqui:

VirtualBox Host-Only Ethernet Adapter #3

Abra o Painel de Controle >> Centro de Rede e Compartilhamento. Agora clique em Alterar Configurações do Adaptador. Clique com o botão direito no adaptador cujo Nome ou o Nome do Dispositivo corresponda a VirtualBox Host-Only Ethernet Adapter #3 e clique em Propriedades. Clique no botão Configurar.

Agora clique na aba Driver. Clique em Atualizar Driver. Selecione Procurar meu computador por drivers. Agora escolha Deixe-me escolher a partir de uma lista de drivers disponíveis no meu computador. Selecione a opção que você obtiver e clique em Avançar. Clique em Fechar para finalizar a atualização. Agora volte para seu Terminal/Powershell/Janelinha de Comando e repita o comando vagrant up. Deve funcionar bem desta vez.

Uma vez que isso esteja concluído, você pode visitar seu painel VVV no url http://vvv.test.

O VVV vem com duas instalações padrão do WordPress - http://one.wordpress.test e http://two.wordpress.test Ambas as sites têm os mesmos detalhes de login, admin como nome de usuário e password como senha. As credenciais do banco de dados para ambos os sites são wp como nome de usuário e senha. As credenciais do usuário root do MySQL são root como nome de usuário e senha. E as credenciais do usuário root da VM são root como nome de usuário e vagrant como senha.

Há uma instalação do wordpress developer em http://trunk.wordpress.net, mas não funcionará, pois não foi provisionada. Esta instalação é útil se você é um colaborador do WordPress que trabalha com tickets e patches do Trac. Para habilitá-la, abra vvv-custom.yml e altere o valor de skip_provisioning sob wordpress-trunk para false e então reprovisione a VM usando o comando

$ vagrant reload --provision

Há outra instalação do wordpress sem url rotulada como wordpress-meta-environment. Esta instalação criará um ambiente útil para contribuições à equipe meta do WordPress, por exemplo, WordCamps, .org etc. Para habilitar esta instalação, adicione a seguinte linha sob wordpress-meta-environment no arquivo vvv-custom.yml.

hosts:  
  - wpmeta.test

E então altere o valor de skip_provisioning para false e reprovisione a VM.

$ vagrant reload --provision

Adicionar um Novo Site

Se você quiser adicionar outro site à VM, precisará editar o arquivo vvv-custom.yml que você pode encontrar no diretório vvv. Se não estiver lá, basta copiar vvv-config.yml e criá-lo. Este é um processo único e você não precisará fazê-lo novamente. Sempre faça suas alterações em vvv-custom.yml porque vvv-config.yml é sobrescrito quando você atualiza o VVV.

Adicione o seguinte código na seção de sites ao vvv-custom.yml para adicionar um novo site.

newsite:
    repo: https://github.com/Varying-Vagrant-Vagrants/custom-site-template
    description: "Uma instalação multisite WordPress em subdiretório"  
    vm_dir: /srv/www/newsite  
    local_dir: /home/user/vvv/www/newsite  
    branch: master  
    nginx_upstream: php
    skip_provisioning: false
    hosts:
      - newsite.test
    custom:
      wp_type: subdirectory

Variáveis

repo variable refere-se a um repositório do Github pré-definido que contém informações sobre como configurar um novo site WordPress na VM. Por enquanto, estamos usando um repositório mantido pelo VVV.

description variável é autoexplicativa.

vm_dir é o diretório real dentro da VM onde seu site residirá.

local_dir é o diretório na sua máquina host onde seu site vive.

branch variável diz ao Vagrant para verificar o branch master do repositório no exemplo aqui.

nginx_upstream é usado para definir onde o Nginx passa as solicitações e geralmente é usado para mudar a versão do PHP necessária para sua instalação. php aqui refere-se à versão padrão do PHP que é 7.2. Você pode usar php71 para mudá-la para PHP 7.1 ou php56 para mudá-la para PHP 5.6.

skip_provisioning está definido como false, o que significa que precisamos incluir este site na VM.

hosts variável é usada para definir a url que precisaremos para acessar o site.

custom seção é útil se você precisar de algum controle adicional sobre seu site WordPress. Você pode usar esta seção para configurar uma instalação multisite ou instalar uma versão diferente do WordPress e até mesmo mudar o nome do banco de dados ou do seu site que será usado para sua instalação.

wp_type variável decide se sua instalação será única, multisite com domínios ou multisite com subdiretório. wp_type aceita quatro valores: single, subdomain, subdirectory e none. Com a instalação em subdomínio, você pode definir múltiplos hosts para sua instalação multisite no seguinte formato

hosts:
    - multisite.test
    - site1.multisite.test
    - site2.multisite.test
  custom:
    wp_type: subdomain

Você pode adicionar mais uma variável sob a seção custom que é wp_version. Você pode defini-la como nightly se quiser instalar a versão Nightly do WordPress. Ela aceita três valores: nightly, latest e um número de versão.

custom: 
     wp_version: nightly

Há outra variável, db_name que permite que você defina o nome do banco de dados para sua instalação.

custom:
    db_name: super_secet_db_name

E por último, site_title variável permite que você defina o Título do seu site WP.

custom:
    site_title: Meu Site de Desenvolvimento Incrível

Isso deve cobrir todas as variáveis e opções que você precisaria para adicionar seu próprio site no VVV. Após alterar o arquivo vvv-custom.yml, basta executar o seguinte comando para fazer seu novo site funcionar.

$ vagrant reload --provision

Adicionar um Site Existente

Até agora, aprendemos como adicionar um site totalmente novo ao VVV. Mas e se você já estiver trabalhando em um site e quiser adicioná-lo ao VVV? Vamos ver como podemos fazer isso.

Para adicionar um site existente, o primeiro passo é o mesmo de antes, ou seja, editar o arquivo vvv-custom.yml e adicionar o seguinte código.

howtoforge:
    repo: https://github.com/Varying-Vagrant-Vagrants/custom-site-template
    description: "Um site WordPress"  
    vm_dir: /srv/www/newsite  
    local_dir: /home/user/vvv/www/newsite  
    hosts:
      - howtoforge.local

Isso dirá ao VVV para configurar um novo site acessível via http://howtoforge.local Mas é um site totalmente novo. O que precisamos fazer é convertê-lo em nossa instalação existente. Para isso, precisamos copiar os arquivos da nossa instalação WordPress existente para o diretório local, ou seja, /home/user/vvv/www/newsite

$ cp /var/www/howtoforge/ /home/user/vvv/www/newsite/

Agora precisamos copiar o banco de dados. Uma maneira simples de fazer isso é exportar seu banco de dados existente como um arquivo .sql, copiar esse arquivo para o diretório do nosso blog e importar o banco de dados novamente acessando via SSH à nossa VM.

Primeiro, faça login no mysql na linha de comando do seu sistema local e use o seguinte comando para exportar o banco de dados.

$ cd /home/user/vvv/www/newsite
$ mysqldump -u username -p database_name > data-dump.sql

Agora podemos reprovisionar a VM novamente.

$ vagrant reload --provision

Acesse sua VM via SSH.

$ vagrant ssh

Agora importe o banco de dados de volta para sua VM.

$ cd /srv/www/newsite 
$ mysql -u root -p newsite < data-dump.sql

O VVV já criou um novo banco de dados durante o provisionamento para nosso blog chamado newsite. A senha para o usuário root é root aqui. O comando acima importará nosso banco de dados existente para o novo.

Isso completa a configuração de um site existente no VVV.

Habilitar SSL

Instalações localhost geralmente não são seguras. E instalar seu próprio certificado no localhost pode ser um processo longo e tedioso, mesmo com o Let’s Encrypt. Mas o VVV torna esse processo bastante fácil e, por padrão, tem SSL habilitado em todas as suas instalações do WordPress. Basta começar a usar https com seus sites. Na primeira vez, seu navegador reclamará sobre um certificado inválido, mas adicione-o como uma exceção e deve estar tudo bem a partir de agora.

Atualizando o WordPress

Você pode atualizar sua instalação do WordPress a partir do seu painel. Além disso, o VVV atualizará seu WordPress sempre que você reprovisionar a VM. Você também pode atualizar o WordPress manualmente baixando-o do WordPress.org e extraindo o arquivo zip. E você também pode usar o WP CLI que vem com o VVV. Para atualizar seu site com o WP CLI, use os seguintes comandos.

$ cd /srv/www/newsite
$ wp core update

Atualizando o VVV

O primeiro passo é parar a máquina Vagrant.

$ vagrant halt

Agora, certifique-se de que seu vagrant e Virtualbox estão atualizados. Se não, baixe-os novamente e instale.

Execute o seguinte comando para atualizar sua caixa Vagrant. É opcional, mas é melhor que você siga em frente com isso.

$ vagrant box update

Agora, puxe a versão mais recente do VVV do Github.

$ git pull

Reprovisione a caixa novamente para completar a atualização.

$ vagrant up --provision

Ferramentas Adicionais

O VVV vem com várias utilidades que você pode instalar. Você as encontrará listadas na seção de utilidades no seu arquivo vvv-custom.yml. Por padrão, tls-ca e phpmyadmin estão habilitados. Você pode ainda instalar memcached, opcache, webgrind, mongodb, tideways e versões do php de 5.6 a 7.3 removendo o # na frente deles na seção de utilidades.

Você pode até adicionar seu próprio software que deseja instalar. Você precisaria modificar o arquivo vvv-custom.yml com algo como

utilities:
  core:
    - tls-ca  
    - phpmyadmin
  java:
    - java7
utility-sources:
  java:
    repo: https://github.com/example/java-utilities.git
    branch: master

Você adicionará uma nova seção, java aqui, por exemplo. O código para a instalação virá de um repositório git. Seu repositório git deve ser estruturado de forma semelhante a

java7/
    provision.sh

O arquivo provision.sh conterá o código necessário para instalar o java na sua VM. O nome da pasta deve corresponder ao nome que você usou acima no arquivo vvv-custom.yml.

Conclusão

Isso conclui nosso tutorial sobre como configurar um ambiente de desenvolvimento local WordPress com Vagrant. Deixe-nos saber se você tiver alguma dúvida.