• Guias
• Nextjs App Configurations Turso

O template Next.js App + Configurations + Turso fornece uma forma rápida para construir uma aplicação Next.js com configurações personalizadas, App Router e integração com um banco de dados Turso.

Este template utiliza Next versão 13.5.6 e LibSQL 0.5.3.

Para usar este template, você deve:

• Criar uma conta Turso.
• Instalar a Turso CLI.
• Criar um banco de dados com uma tabela chamada posts, com os campos id e message, conforme explicado na próxima seção.
• Gerar um personal token do GitHub.

Você também deve ativar:

Para habilitar esses módulos:

1. Acesse o Azion Console > Account menu.
2. Selecione a opção Billing & Subscriptions.
3. Selecione a aba Subscriptions.
4. Ative o switch para cada módulo.

Supondo que você já tenha criado uma conta Turso e instalado a Turso CLI em seu computador, você só precisa completar os seguintes passos usando alguns comandos:

• Autentique sua conta Turso: turso login
• Crie um novo banco de dados: turso db create
• Liste seus bancos de dados: turso db list
  • Você obterá a URL do LibSQL para o seu banco de dados.
• Crie um token de autorização para acessá-lo: turso db tokens create [nome do seu banco de dados]
  • Neste caso, o nome do seu banco de dados deve ser posts.
  • Lembre-se de salvá-lo em um local seguro.
• Abra a interface shell do seu banco de dados: turso db shell [nome do seu banco de dados]
• Crie a tabela que será usada por este modelo usando SQL:

CREATE TABLE posts (
  id INTEGER PRIMARY KEY,
  message varchar(140)
);
.quit

Se você executou todos os comandos corretamente, poderá usar a URL/token durante o processo de lançamento deste template.

Para usar este template, acesse o Azion Console e clique no botão + Create na página inicial.

Isso abrirá um modal onde você pode selecionar Templates > Next.js App + Configurations + Turso card.

Na página do template, clique na aba Settings para abrir o formulário e fornecer as informações para configurar sua aplicação.

Os campos identificados com asterisco são obrigatórios.

• Application Name *: o nome da sua nova edge application na Azion.
• GitHub Personal Token *: seu personal token do GitHub.
• Turso Database URL *: a URL do LibSQL para conectar com seu banco de dados Turso.
• Turso Authorization Token *: o token para autorizar o acesso no seu banco de dados Turso.

Depois de preencher todas as informações, clique no botão Next, localizado no canto inferior direito. Isso iniciará o processo de deployment.

Durante a implantação, você poderá acompanhar o processo através de uma janela mostrando os logs. Quando estiver concluída, uma nova página será exibida, confirmando que a edge application foi criada com sucesso.

Esta página mostra informações sobre a aplicação e algumas opções para continuar sua jornada.

Agora você pode gerenciar e ajustar as configurações através do Azion Console.

Considerando que essa configuração inicial pode não ser ideal para sua aplicação, todas as configurações podem ser personalizadas sempre que você precisar usando o Azion Console.

Para gerenciar e editar as configurações da sua edge application:

1. Acesse o Azion Console > Edge Application.

• Você será redirecionado para a página do Edge Application. Ela lista todas as edge applications que você criou.

2. Selecione a aplicação relacionada ao template.

• A lista é organizada em ordem alfabética. Você também pode usar a barra de busca localizada no canto superior esquerdo da lista; atualmente, ela é filtrada apenas pelo Application Name, ou nome da edge application.

Depois de selecionar a aplicação em que você trabalhará, você será direcionado para uma página que contém todas as configurações que você pode configurar.

Uma vez que o template é implantado, você pode editar e atualizar seus configurações, bem como implementar um workflow de continuous deployment, ou implantação contínua. No entanto, você precisará primeiro declarar seus secrets no repositório do GitHub do seu projeto para completar um segundo build com as alterações.

Assim que esta segunda compilação for concluída, você poderá gerenciar seu projeto com um fluxo de trabalho de implantação contínua e editar conforme desejado.

Para fazer isso, abra seu novo repositório do Next.js App + Configurations + Turso no GitHub. Em seguida, vá para Settings > Secrets and variables > Action para adicionar suas variáveis seguindo estas instruções:

1. Adicione o Azion personal token aos secrets:

• Leia como gerar um personal token da Azion na documentação.

    AZION_PERSONAL_TOKEN=<value>

2. Adicione os ambientes para uso no action workflow no arquivo main.yml, dentro da pasta .github/workflows do seu repositório::

  - name: edge-...
    id: azion_edge
    ...
    with:
        ....
        azionPersonalToken: ${{ secrets.AZION_PERSONAL_TOKEN }}
        ....

3. Abra um pull request com as alterações na main branch e inicie a implantação automática.

Agora, seu projeto está pronto para trabalhar com um fluxo de trabalho de implantação contínua, atualizando instantaneamente quaisquer alterações no aplicativo ou no repositório.

A edge application criada tem um domínio Azion atribuído para torná-la acessível através do navegador. O domínio tem o seguinte formato: xxxxxxxxxx.map.azionedge.net. No entanto, você pode adicionar um domínio personalizado para que os usuários acessem sua aplicação por meio dele.

Contribuidores