Compatibilidade com Frameworks | Angular

Sobre o Angular

Angular é uma plataforma abrangente para construção de aplicações web. É uma solução completa que inclui tudo o que você precisa para criar aplicações do lado do cliente, desde ferramentas de desenvolvimento até utilitários de teste. O Angular utiliza o TypeScript como sua linguagem principal e segue uma arquitetura baseada em componentes com um sistema robusto de injeção de dependências.

Principais recursos:

• Framework completo com ferramentas e utilitários integrados.
• Arquitetura baseada em componentes com suporte a TypeScript.
• Sistema poderoso de injeção de dependências.
• Roteamento e manipulação de formulários integrados.
• Programação reativa com integração ao RxJS.
• Recursos de gerenciamento de estado integrados.

Você pode realizar o deploy do seu projeto Angular utilizando nossos templates prontos para implantação ou vinculando um projeto existente com o Azion CLI.

Templates disponíveis

Realizando deploy de um template no Azion Console

1. Faça login no Console.
2. Clique no botão + Create.
3. Naveegue para a seção Templates.
4. Escolha o template Angular desejado.
5. Conecte sua conta do GitHub.
6. Escolha um nome para sua aplicação.
7. Clique em Deploy.

Realizando deploy de um projeto existente usando importação do GitHub

1. No Console, clique no botão + Create.
2. Selecione Importar do Github.
3. Selecione seu repositório.
4. Escolha um nome para a aplicação.
5. Selecione o Preset do Angular.
6. Insira o comando de instalação:

npm install

7. Clique em Deploy.

Realizando deploy de um template via Azion CLI

Você pode usar a Azion CLI para realizar o deploy de um template.

1. No terminal, inicialize o projeto:

  azion init

2. Dê um nome ao seu projeto ou pressione enter para aceitar a sugestão dada:

? Your application's name:  (black-thor)

3. Escolha o preset Angular:

? Choose a preset:  [Use arrows to move, type to filter]
> Angular
  Astro
  Docusaurus
  Eleventy
  Emscripten
  Gatsby
  Hexo
  Hono
  Hugo
  Javascript
  ...

4. Escolha um dos templates disponíveis.

5. Você pode optar por iniciar um servidor de desenvolvimento local ou não.

Do you want to start a local development server? (y/N)

Os próximos passos dependem de sua resposta.

• Se você optou por executar um servidor de desenvolvimento local.
• Se você optou por não executar um servidor de desenvolvimento local.

Resposta “Sim” para desenvolvimento local

1. Instale as dependências do projeto. Digite y quando a interação solicitar:

Do you want to install project dependencies? This may be required to start local development server (y/N)

Aguarde até que a instalação seja concluída.

Saída:

Your Edge Application was built successfully
[Azion] [Server] › ✔  success   Function running on port 0.0.0.0:3333, url: http://localhost:3333

2. No browser, visite http://localhost:3333/ e você pode ver o seu projeto Angular rodando.

Realizando deploy do projeto

Quando o seu projeto está em execução localmente, você ainda pode implantá-lo. Para fazer isso:

1. Pare a execução no terminal com control + c.

2. Acesse a pasta do projeto:

cd [nome-do-seu-projeto]

3. Realize o deploy do projeto:

azion deploy

4. Aguarde enquanto o projeto é construído e implantado na Azion Web Platform.

Após a implementação ser concluída, você receberá um domínio para acessar o seu projeto Astro na plataforma da Azion.

Aguarde alguns minutos para que a propagação ocorra e, em seguida, acesse a sua aplicação usando o domínio fornecido, que deve ser semelhante a https://xxxxxxx.map.azionedge.net.

Resposta “não” para desenvolvimento local

Após indicar que você não deseja executar um servidor local, implante o projeto.

1. Digite y para a seguinte interação, indicando que deseja implantar o projeto:

Do you want to deploy your project?

2. Instale as dependências do projeto. Digite y quando a interação solicitar:

Do you want to install project dependencies? This may be required to start local development server (y/N)

3. Aguarde enquanto o projeto é construído e implantado na plataforma da Azion.

Após a implantação ser concluída, você receberá um domínio para acessar o seu projeto Astro na plataforma da Azion.

Aguarde alguns minutos para que a propagação ocorra e, em seguida, acesse a sua aplicação usando o domínio fornecido, que deve ser semelhante a https://xxxxxxx.map.azionedge.net.

Deploy de um projeto local com Azion CLI

Você pode utilizar o processo abaixo para realizar o deploy de um projeto local, compatível com as frameworks suportadas.

1. Dentro da pasta de seu projeto existente, use o comando abaixo para vincular o seu projeto a uma edge application:

azion link

2. Selecione o preset Angular.

3. A CLI vai lhe guiar pelo restante do processo.