O Laravel, é um robusto framework PHP, e Inertia.js, uma dinâmica biblioteca JavaScript, colaboram de forma integrada para acelerar o desenvolvimento de aplicativos. Laravel simplifica tarefas do lado do servidor, enquanto Inertia.js facilita as interações do lado do cliente. Juntos, eles suportam um fluxo de dados suave e atualizações em tempo real, ajudando você a construir aplicativos web responsivos rapidamente.

A implantação de um aplicativo Laravel-Inertia usando o serviço de hospedagem de aplicativos da Kinsta envolve algumas etapas:

  1. Configurar o banco de dados usando a Hospedagem de Banco de Dados da Kinsta.
  2. Hospedar seu aplicativo e configurar buildpacks para Node.js e PHP, integrando o banco de dados.
  3. Configurar o Node.js para instalar o Inertia e as dependências do PHP para o ambiente do Inertia.

Este tutorial orientará você nesse processo, passo a passo.

Entendendo os requisitos de implantação

Para acompanhar o processo, verifique se você tem os seguintes pré-requisitos:

  • Conhecimento fundamental de Laravel e Vue.js
  • Familiaridade com o banco de dados
  • Uma conta Kinsta. Comece um teste gratuito hoje mesmo.

Neste artigo, você implantará um aplicativo de blog que serve uma lista de artigos e permite que o leitor visualize um artigo específico. O aplicativo foi estilizado com o Tailwind CSS e desenvolvido com Laravel e Vue.js.

O ambiente runtime JavaScript do Node.js lida com a renderização no lado do servidor. Ele coordena a comunicação entre os componentes do aplicativo de frontend Inertia.js e o backend do Laravel para atualizações dinâmicas do frontend no lado do servidor.

O aplicativo Kinsta Blog com um título e uma lista de artigos.
O aplicativo Kinsta Blog com um título e uma lista de artigos.

Para obter mais informações sobre como criar esse aplicativo, leia Como usar o Inertia.js em seus projetos Laravel. Você também pode fazer o download do código-fonte completo do aplicativo.

Como implantar o aplicativo na Kinsta

Comece configurando um banco de dados para o seu aplicativo na hospedagem de banco de dados da Kinsta. Você pode fazer isso seguindo estas etapas:

  1. Faça login ou crie uma conta para visualizar seu painel MyKinsta.
  2. Clique em Bancos de dados na barra lateral esquerda e, em seguida, clique em Adicionar banco de dados.
  3. Na seção Detalhes básicos, insira os detalhes do seu banco de dados. Isso inclui o tipo de banco de dados (MySQL) e a versão (8.0). Em seguida, clique em Continuar.
  4. A seção Resumo mostra os detalhes da fatura do serviço e suas informações de cobrança. Confirme e clique em Criar banco de dados.

Como configurar o ambiente do Laravel

Para configurar o ambiente Laravel na Hospedagem de Aplicativos da Kinsta, você deve seguir os seguintes passos Siga estas etapas:

  1. Clique em Aplicativos na barra lateral esquerda do MyKinsta e, em seguida, clique em Adicionar aplicativo.
  2. Escolha o repositório do seu aplicativo, ative a implantação automática no commit, insira o nome do aplicativo e selecione o local do centro de dados. Seu aplicativo e banco de dados devem estar na mesma região.
  3. Em seguida, insira suas variáveis de ambiente. Digite APP_KEY no campo Key 1. Use o gerador on-line do Laravel para criar uma chave para o Valor 1. Clique em Continuar.
  4. Na aba Ambiente de build, selecione Usar Buildpacks para configurar a imagem do contêiner. Essa opção permite que você escolha os Buildpacks mais tarde.
  5. Na aba Recursos, especifique o comando start do seu aplicativo. Como este é um aplicativo Laravel, ele usa o seguinte comando: 
    php artisan serve --host 0.0.0.0 --port 8080
  6. A aba Resumo mostra a fatura com seu pod e método de pagamento. Confirme todas as informações e clique em Criar aplicativo.

A implantação do seu aplicativo será iniciada, mas ela irá falhar porque ainda é necessário adicionar os Buildpacks necessários durante a build do seu aplicativo Laravel-Inertia.

Adicione Buildpacks

  1. No menu do lado esquerdo do seu aplicativo, clique em Configurações.
  2. Em seguida, clique na aba build e em Adicionar buildpack para adicionar os buildpacks Node.js e PHP. Adicione os Buildpacks que contêm a última linguagem principal à lista de Buildpacks para garantir que o Buildpacks específico da linguagem tenha precedência sobre a configuração geral do ambiente do aplicativo.
  3. Clique em Adicionar Buildpacks e adicione os Buildpacks do Node.js e do PHP. Certifique-se de que o Buildpacks da linguagem principal (PHP) seja adicionado por último.

    Adicionando Buildpack para o aplicativo Laravel-Inertia.
    Adicionando Buildpack para o aplicativo Laravel-Inertia.

  4. Clique em Implantar na barra lateral e clique em Reimplantar.

Configure o ambiente do Node.js

  1. O aplicativo Laravel-Inertia precisa do script Vite para que a página seja atualizada sem recarregar. Portanto, no menu do lado esquerdo de sua conta Kinsta, clique em Processes (Processos).
  2. Na seção Processos Runtime, clique em Criar processo. Escolha Background worker como o tipo de processo e adicione os seguintes comandos: 
    npm install && npm start
    Criando comando start do Node.js para o aplicativo Laravel-Inertia.
    Criando comando start do Node.js para o aplicativo Laravel-Inertia.

    Dê ao processo o nome que você quiser para identificá-lo na Kinsta, como “Node”. Além disso, selecione o tamanho do pod e a contagem de instâncias com base nas necessidades e no orçamento do seu aplicativo. Este tutorial usa 2 CPUs com 8 GB de RAM.

  3. Clique em Continuar para criar seu processo. Essa ação aciona uma reimplantação.

Configure o ambiente do banco de dados

  1. Na página Configurações, na aba Conexões, você deve ver Aplicativos permitidos. Clique em Adicionar conexão para adicionar o banco de dados como uma conexão.
  2. Selecione o banco de dados. Abaixo dele, marque Adicionar variáveis de ambiente para acessar o banco de dados. Essa ação preenche automaticamente todas as variáveis de ambiente do banco de dados.
  3. Edite as chaves das variáveis para corresponderem ao arquivo database.php do seu aplicativo, que está na pasta de configuração na raiz do aplicativo.
  4. Modifique as chaves do Laravel DB_DATABASE, DB_USERNAME e DATABASE_URL, como na captura de tela a seguir:

    Adicionando variáveis de ambiente e modificando as chaves.
    Adicionando variáveis de ambiente e modificando as chaves.

  5. Adicione outra variável de ambiente chamada APP_URL. Seu valor é a URL de implantação do aplicativo. Você pode obter essas informações em Domínios no menu lateral.

Migração do banco de dados

  1. No menu lateral, clique em Processos.
  2. Na seção Processos Runtime, clique em Criar processo.
  3. Nomeie o processo como “Migração”. Selecione o tipo Background worker. Cole o seguinte comando no campo Iniciar comando: 
    php artisan migrate:fresh --seed --force

    Esse comando migra a tabela Article e adiciona dez artigos ao aplicativo. Seus processos devem se parecer com a seguinte captura de tela, com os processos Node, Migration e Web e seus detalhes.

    Processos Runtime ao implantar o aplicativo Laravel-Inertia.
    Processos Runtime ao implantar o aplicativo Laravel-Inertia.

  4. No menu lateral, selecione Implantações. Clique em Última implantação. Você deverá ver uma página como a seguinte, com um título e uma lista de artigos com texto e imagens de espaço reservado.

    O aplicativo Laravel-Inertia foi implantado com sucesso na Kinsta.
    O aplicativo Laravel-Inertia foi implantado com sucesso na Kinsta.

Como monitorar e manter o aplicativo após a implantação

Depois de implantar seu aplicativo, você pode ter problemas com o aumento das solicitações. A análise de aplicativos da Kinsta ajuda você a monitorar essas alterações e a manter a integridade do seu aplicativo.

A análise mostra recursos, desempenho e solicitações HTTP para que você tenha uma ideia de como o aplicativo funciona. Você pode observar rapidamente quando seu aplicativo precisa de mais recursos nos quadros de monitoramento da aba Desempenho e, em seguida, aumentar ou diminuir a escala conforme necessário.

Os registros de runtime também ajudam a sua equipe a depurar problemas rapidamente. Você pode encontrar a origem do problema nas entradas de registro, o que facilita a manutenção do aplicativo.

Como solucionar problemas comuns de implantação

Você pode encontrar alguns problemas ao implantar seu aplicativo Laravel-Inertia na Kinsta. Vamos discutir quais são esses problemas e como solucioná-los.

Primeiro, a Kinsta adiciona um caractere especial à senha gerada quando você cria um banco de dados. Isso pode causar erros de reversão quando você conecta o banco de dados ao seu aplicativo Laravel-Inertia. Para solucionar esse problema, use sua senha em vez de confiar nas senhas geradas.

Falhas de implantação com auto-commit são outro problema típico. A implantação pode falhar se você especificar o comando start incorreto. Para resolver esse problema, verifique se seus processos têm erros de digitação ou estão atribuídos incorretamente a um tipo de processo.

Resumo

Agora você sabe como implantar um aplicativo Laravel e Inertia na Kinsta. Isso envolve a definição de Buildpacks e comando start para configurar o aplicativo, criar um banco de dados e, em seguida, conectar e migrar o banco de dados para fornecer dados ao aplicativo.

A combinação do Laravel e do Inertial permite que você conecte seu aplicativo e banco de dados sem configurar manualmente uma API, economizando tempo e energia que você pode usar para criar novos recursos interessantes para o aplicativo.

A Kinsta hospeda seu aplicativo e seu banco de dados. Você também pode usar as conexões externas do seu banco de dados para se conectar a um aplicativo que está sendo executado fora da Kinsta. 37 centros de dados ajudam a oferecer serviços mais próximos aos usuários do seu aplicativo, reduzindo a latência enquanto oferecem uma infraestrutura de implantação confiável e segura.

Use o que você aprendeu neste tutorial para implantar seu aplicativo dinâmico da web – ou seu banco de dados – na Kinsta. Comece sua jornada de implantação com a Kinsta hoje mesmo.