# Importe e implante um projeto do GitHub Esta documentação ajuda você a importar seu próprio repositório do GitHub para construir e implantar uma aplicação no edge da Azion. --- ## Pré-requisitos Antes de começar, você deve ter: - Uma conta na Azion. - Consulte o guia [Como criar uma conta na Azion](/pt-br/documentacao/produtos/contas/criar-uma-conta/) para mais informações. - Uma conta no [GitHub](https://github.com/signup) para importar seus repositórios. - Cada push será implantado automaticamente nesses repositórios para manter seus projetos atualizados. ### Frameworks suportados A Azion Web Platform oferece suporte para diferentes frameworks Jamstack, incluindo: - Next.js - Angular - Astro - Hexo - React - Vue Confira [alguns exemplos de código](https://github.com/aziontech/azion-samples/tree/dev/templates) para fazer fork e usar como boilerplate, se desejar. Saiba mais sobre [Compatibilidade com web frameworks](/pt-br/documentacao/produtos/devtools/azion-edge-runtime/compatibilidade-frameworks/) na documentação. :::note No caso de importar projetos baseados em frameworks não suportados, a plataforma não concluirá os processos de construção e implantação. ::: --- ## Importe um projeto e configure a application Para começar a criar, siga os passos: 1. Acesse o [Azion Console](https://console.azion.com). 2. Na página inicial, clique no botão **+ Create**. - Isso abrirá um modal com opções para criar novas aplicações e recursos. 3. Selecione a opção **Import from GitHub** e clique no card. - Essa ação abrirá a página de configurações. 4. Conecte sua conta da Azion com o GitHub. - Um pop-up será aberto para confirmar a instalação da [Azion GitHub App](/pt-br/documentacao/produtos/guias/azion-github-app/), uma ferramenta que conecta sua conta do GitHub com a plataforma da Azion. - Defina suas permissões e acesso ao repositório conforme desejado. 5. Selecione o **GitHub Scope** com o qual deseja trabalhar. 6. Na seção **General**, preencha os seguintes campos. Campos com um asterisco são obrigatórios. - **Applications Name** *: use um nome único e fácil de lembrar. Se o nome já estiver em uso, a plataforma retornará uma mensagem de erro. - O bucket para armazenamento e a function utilizarão o mesmo nome. - **Preset** *: defina as configurações iniciais para a aplicação. - **Root Directory** *: refere-se ao diretório onde seu código está localizado. Seu código não deve estar em um subdiretório, mas sim no diretório raiz. Um símbolo ``./`` aparece neste campo, indicando que é um diretório raiz. - **Install Command** *: o comando que compila suas configurações para construir para produção. Os comandos de construção são executados por meio de scripts. Por exemplo: `npm run build` ou `npm install` para o pacote `npm`. 1. Na seção **Variables**, você pode adicionar variáveis de projeto conforme necessário. - As variáveis são compostas por dois valores-chave, no formato VARIAVEL=VALOR. Por exemplo: `API_URL=www.apiurl.com/abc`. - O campo **Key** aceita letras maiúsculas, números e underline. - Você pode usá-las como variáveis globais e editá-las ou transformá-las em segredos na página de **Variables**. Leia a documentação sobre [Variables](/pt-br/documentacao/produtos/build/environment-variables/) para mais detalhes. 1. Clique no botão **Deploy** para iniciar a implantação. Você pode acompanhar o processo de implantação por meio de uma janela que exibe os logs. Quando estiver completo, uma notificação aparecerá, confirmando que a application foi criada com sucesso. A página também exibirá informações sobre a aplicação e algumas opções para continuar sua jornada, incluindo o domínio para acessá-la e o botão de gerenciamento. :::note O link para a aplicação de borda permite visualizá-la no navegador. No entanto, leva um certo tempo para propagar e configurar a aplicação nas edge locations da Azion. Pode ser necessário aguardar alguns minutos para que a URL seja ativada e a página da aplicação seja exibida corretamente no navegador. ::: --- ## Gerencie sua application Todas as configurações da aplicação podem ser personalizadas sempre que necessário por meio do Azion Console. Para fazer isso, clique no botão **Manage** que aparece durante a implantação ou vá para a página do **Applications** e selecione a aplicação que deseja atualizar. :::tip Leia a documentação sobre [gerenciamento de applications](/pt-br/documentacao/produtos/build/applications/primeiros-passos/) para mais detalhes. ::: Como sua conta da Azion está conectada ao repositório do GitHub, todas as alterações serão replicadas em ambos, mantendo seu projeto atualizado em um fluxo de trabalho de implantação contínua. ### Adicione um domínio personalizado A 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. import DocButton from '~/components/webkit/DocButton.vue'; ---