Antony Cabral
Antony Cabral28/10/2024 11:52
Compartilhe

🌐 Como Hospedar uma Aplicação na Azure: Frontend e Backend!

  • #Azure

🖥️ O que é a Azure?

Azure é um serviço da Microsoft que funciona como uma grande central de tecnologia na nuvem. Imagina que você tem o seu próprio computador, só que ele não fica em casa, mas em uma rede enorme. Lá você pode rodar aplicativos, sites e até um jogo online! Hoje vamos ver como subir um frontend (parte visual) e um backend (código que faz as coisas funcionarem) usando dois jeitos diferentes: com uma Máquina Virtual e com o Serviço de Aplicativos da Azure para APIs.

🚀 Subindo o Frontend e o Backend na Azure com Máquina Virtual (VM)

  1. Criando a VM: Na Azure, vá para o painel e procure por “Máquinas Virtuais”. Clique em “Criar nova VM” e escolha as configurações básicas, como o tamanho da máquina e o sistema operacional (recomendo Ubuntu para projetos web).
  2. Instale seu Ambiente: Depois que a VM está pronta, você se conecta a ela via SSH (uma forma de acessar computadores à distância). Na VM, você pode instalar tudo o que precisa para o backend e frontend, como Node.js para rodar o frontend e Java ou Spring Boot para o backend.
  3. Deploy do Backend: Suba o backend na VM e deixe-o funcionando em uma porta específica, como 8080. Você faz isso executando o comando que inicia o backend, tipo java -jar meu-app.jar.
  4. Configurar o Frontend: Se você tem o frontend em React, Angular ou Vue, basta copiar os arquivos build ou dist para a VM e configurar o servidor da Azure para servir esses arquivos.
  5. Acessando a Aplicação: Para que o mundo possa acessar sua aplicação, configure a VM para abrir as portas que você usou. Vá em “Configurações de Rede” e adicione as portas HTTP e HTTPS.
  6. Acompanhe os Custos: A VM tem um custo baseado no uso. Na página de custos, você consegue ver o valor por hora e mês. Fique de olho para evitar surpresas!

☁️ Hospedando a Aplicação Usando o Serviço de Aplicativos (App Service) para APIs

  1. Criando o App Service: No painel da Azure, procure por “App Services” e clique em “Criar”. Escolha o nome e o plano de hospedagem que caiba no seu bolso. Esse serviço é legal porque gerencia várias coisas para você.
  2. Configurar o Backend: No App Service, você pode fazer o upload do backend diretamente. Ele automaticamente entende a linguagem e coloca o código para funcionar! Se você usa Node.js, Java ou até Python, a Azure cuida de tudo.
  3. Subindo o Frontend: No painel do App Service, vá para a parte de Deployment Center e faça upload do frontend. Para React, Angular ou Vue, só precisa subir os arquivos build e já fica tudo online.
  4. Custom Domain: Quer seu próprio domínio? Na opção de “Domínios Personalizados”, você consegue apontar seu site para um domínio que você comprou. Coloque as configurações do DNS no seu provedor e pronto!
  5. Monitorando Custos: No App Service, você pode ver os custos de uso. Dependendo do plano, você vê um valor mensal com previsão de consumo. É bom para quem quer uma conta certinha!

💸 Como Ver o Custo na Azure

  1. Cost Management: Para saber o quanto você está gastando, a Azure tem uma área chamada “Cost Management”. Lá, você vê tudo em detalhes! É só clicar em “Exibir Custos” no painel principal, e ele mostra quanto cada serviço está usando.
  2. Alertas de Custo: Se quiser, pode criar alertas para saber quando os gastos chegam a um certo valor. Assim, você fica tranquilo e evita pagar muito!

🚀 Call to Action

Achou útil? Siga nossas redes sociais para aprender mais sobre desenvolvimento e tecnologia!

Github

Linkedin

#tecnologia #Azure #desenvolvimento

Compartilhe
Comentários (0)