COMO CONFIGURAR O DOCKER PARA FRONTEND | Angular + Nginx

  Рет қаралды 13,820

Fernanda Kipper | Dev

Fernanda Kipper | Dev

2 ай бұрын

⭐ Seja um membro do canal e tenha acesso à lives, vídeos e conteúdos exclusivos!
/ @kipperdev
Nesse vídeo eu vou te mostrar como configurar o Docker criando seu dockerfile para hospedar seus sites Angular usando a abordagem de SPAs e sites estáticos com Nginx. Esse Dockerfile podem ser facilmente adaptados para outras abordagens de sites estáticos, como por exemplo, os gerados usando Next js e Nuxt js.
🎁 APRENDA SOBRE DEVOPS NA TRILHA DA ROCKETSEAT (10% OFF)
tr.ee/kipperdev-desconto-rock...
🔗 Link do arquivo Mime.types
github.com/Fernanda-Kipper/lo...
🔗 Repositório do projeto
github.com/Fernanda-Kipper/lo...
👉 Aprenda inglês com 47% OFF
tr.ee/kipperdev-yt-fluencypass
👉 Me siga no instagram!
/ kipper.dev
🌎 Comunidade do Discord
/ discord

Пікірлер: 53
@kipperdev
@kipperdev 2 ай бұрын
ATENÇÃO! Acabei não mostrando como HABILITAR o SSG no Angular, então vou deixar o link aqui para quem quiser buildar e servir sua aplicação usando a técnica de SSG angular.io/guide/prerendering
@FelipeOliveir4
@FelipeOliveir4 2 ай бұрын
Esse canal tem mais conteúdos do que eu consigo consumir, muito bom, logo teremos uma nova Loiane Groner :D
@kipperdev
@kipperdev 2 ай бұрын
Ahahahahah valeu Lipe, tmjj! 💜
@med.brunofreire
@med.brunofreire 2 ай бұрын
Fernanda, seria bem legal ensinar como fazer o CI/CD com GithubActions para a instancia do Docker sem ter que fazer o rebuild a cada mudança no código do projeto, por exemplo, ao fazer mudanças no app/src, como fazer o deploy do novo código sem ter que fazer o rebuild da imagem, mas somente fazer com que a instancia do docker no VPS puxe o novo código e execute sem fazer o servidor ter que reiniciar...
@gabrielguimaraes7925
@gabrielguimaraes7925 2 ай бұрын
Fe, vc é melhor canal de dev atualmente, sem blablabla da bolha tech . Obrigado
@kipperdev
@kipperdev 2 ай бұрын
muito obrigadaa, Gab 💜💜
@Gu-yu5wu
@Gu-yu5wu 29 күн бұрын
Muito obrigado, me ajudou muito.
@RodrigoSouza-vb4iq
@RodrigoSouza-vb4iq Ай бұрын
Obrigado! Deu certo aqui! Estava precisando dessa aula! Explicação top!! :D Ganhou o inscrito no canal!
@AltoDeData
@AltoDeData 2 ай бұрын
Muito bom Explicação muito boa
@eduardoorlandimelle9229
@eduardoorlandimelle9229 2 ай бұрын
Vídeo excelente! Muito obrigado por compartilhar o conhecimento! 🙂
@kipperdev
@kipperdev 2 ай бұрын
Muito obrigadoo, Edu 💜
@CRISTOVIVE_EM_MIM
@CRISTOVIVE_EM_MIM 2 ай бұрын
Encontrei esse canal, e é a primeira pessoa que não tem medo de ensinar, e não fica enrolando com papinhos. Estou amando seu conteúdo @kipperdev
@kipperdev
@kipperdev 2 ай бұрын
Que bomm 💜 Fico muito feliz em saber que você tem gostado
@arozendojr
@arozendojr 2 ай бұрын
Gostei das duas abordagens, só conhecia uma
@camilaqueirozdev
@camilaqueirozdev 2 ай бұрын
Muito show, didática top
@kipperdev
@kipperdev 2 ай бұрын
Muito obrigadaa, Camila
@arissonlimafreire
@arissonlimafreire 2 ай бұрын
Muito bom o vídeo, parabéns
@kipperdev
@kipperdev 2 ай бұрын
Valeuu, Arisson 💜
@wever5593
@wever5593 2 ай бұрын
Kipper, beleza?! A abordagem para Produção com a sua experiência do dia a dia, é sempre realizar o Deploy com o NGINX (ou outro do gênero), e o servidores Angular, Vue e etc só para desenvolver? Eu entendi que também é possível deixar rodando diretamente com esses servidores, é só para entender como funciona a tomada de decisão em um cenário real...
@kipperdev
@kipperdev 2 ай бұрын
Oii, tudo bem? Ótima pergunta! Isso depende muito da necessidade de cada empresa. Tem alguns casos em que a aplicação precisa controlar um pouco mais a requisição para rotear ela entre diferentes aplicações, nesse caso a abordagem com nginx é preferível. Já se você quer subir um backend em node, Que não precisa de geração estática, por exemplo, talvez um nginx seja um over engineering e apenas a aplicação node bastasse. Mas, como sempre na computação, a resposta é depende hahaha
@luisdomiciano
@luisdomiciano 2 ай бұрын
Muito bom
@kipperdev
@kipperdev 2 ай бұрын
Valeuu, Luis
@XINTSUAI
@XINTSUAI 2 ай бұрын
Faz um video depois subindo um app Angular 17 SSR usando App Engine e Firestore do Google rs...
@gabrielrochasantana
@gabrielrochasantana 2 ай бұрын
Muito legal o conteúdo, parabéns. Dá para rodar essa aplicação com o docker instalado no wsl2 do windows?
@WesleyNascimento-fo3rf
@WesleyNascimento-fo3rf 2 ай бұрын
Faz de NextJS
@arissonlimafreire
@arissonlimafreire 2 ай бұрын
Faz um vídeo desse ensinando a dockerizar uma aplicação com React
@arozendojr
@arozendojr 2 ай бұрын
Em micro serviço backend usamos Endpoint Health Checks, para fronte existe algo semelhante ?
@arozendojr
@arozendojr 2 ай бұрын
Olhando seus links do instagram, HyperX Duocast - USB é o que você usa hoje ?
@gabrielguimaraes7925
@gabrielguimaraes7925 Ай бұрын
Fe,conforme eu vou alterando e criando novos arquivos localmente, é para nginx perceber isso e atualizar meu contêiner automaticamente, por enquanto que contêiner está rodando ? Ou sempre que tiver alterações eu tenho que dar down na img atual e buildar novamente ?
@Jhoonnn
@Jhoonnn 2 ай бұрын
valeuuu pelas dicas Fer, mais um vídeo de alta qualidade
@kipperdev
@kipperdev 2 ай бұрын
Valeuu John! Que bom q gostou do videooo 💜
@Fernando-vb1wt
@Fernando-vb1wt 2 ай бұрын
FALA FERNANDA, SOU SEU CHARÁ E TBM DESENVOLVEDOR WEB RS FUI TENTAR USAR O MÓDULO DE FILTRO NGX FILTER PIPE NO ANGULAR 17 MAS NA HORA DE IMPORTAR ELE DIZ Q NÃO PODE IMPORTAR COMPONENTE SEM SER STANDALONE... VC USA OUTRO FILTRO P ANGULAR 17 OU TEM ALGUMA MANEIRA DE CONTORNAR ISSO?? DESDE JÁ, OBRIGADO
@kennyroger22
@kennyroger22 2 ай бұрын
Será que possível você fazer com VUE ou NUXT.. Sucesso aí 👊🏽
@andersonsmont
@andersonsmont 2 ай бұрын
Sim, dockerfile é feito de sequência de "determinações" ou vamos dizer ações. Imagine você indo se preparar para executar um serviço em Vue, você define isso no Dockerfile. Então a maneira que você imaginar faça.
@bruno-dev
@bruno-dev 2 ай бұрын
Pow faz como dockerizar o nextJs
@FelipeOliveir4
@FelipeOliveir4 2 ай бұрын
Mano, uma dica, você tem que começar a expandir a mente e pensar fora da caixa, pegue esse conteúdo e faça você um video portado pro NextJS. Eu já usei vídeos de Angular para me ajudar com .NET porque falava do mesmo conceito de orientação a objetos.
@enriquesantosdeoliveira5798
@enriquesantosdeoliveira5798 2 ай бұрын
Tem na documentação do next 😅
@user-fz3vk2og4s
@user-fz3vk2og4s 2 ай бұрын
Fernanda ci vogliono i sottotitoli per favore
@maicon.wagner
@maicon.wagner Ай бұрын
Qual é o intuito de criar isso? Sendo que o angular já tem seu próprio cli para subir um servidor e até mesmo gerar os arquivos estáticos?
@koba1-671
@koba1-671 Ай бұрын
Tenho a mesma dúvida
@GuiZeroUm
@GuiZeroUm 2 ай бұрын
Faz mais vídeos sobre React pls
@FelipeOliveir4
@FelipeOliveir4 2 ай бұрын
Já tem muito conteúdo de React na internet, se você quer ser contratado no momento atual estude Angular.
@GuiZeroUm
@GuiZeroUm 2 ай бұрын
@@FelipeOliveir4 Não consegui pegar gosto por angular
@FelipeOliveir4
@FelipeOliveir4 2 ай бұрын
@@GuiZeroUm Eu trabalho com React mas não gosto muito não, muito desorganizado, não tem padrão, para iniciante isso é horrível. O React é bom pro dev experiente que quer implementar seu próprio padrão ao meu ver ou para projetos que requerem ajustes finos.
@FelipeOliveir4
@FelipeOliveir4 2 ай бұрын
@@GuiZeroUm É igual Java, falam mal, mas é o que tem vaga 🤷🏾‍♂️
@GuiZeroUm
@GuiZeroUm 2 ай бұрын
@@FelipeOliveir4 vou tentar aprender angular, e que eu acho muito mais interessante react, principalmente agora que ele tá caminhando para ser uma linguagem voltado ao full stack. Gosto por exemplo de utilizar tailwind, que pra mim casa perfeitamente com o react
@elivanmaia2082
@elivanmaia2082 2 ай бұрын
Alguém aqui é bom em frontend para me dar uma força em um trabalho da escola?
@kipperdev
@kipperdev 2 ай бұрын
Oii, Eli! Lá no Discord da comunidade (o link tá na descrição) o pessoal sempre ajuda com dúvidas e sugestões. Te convido a participar!
@samuel_coder
@samuel_coder 2 ай бұрын
enginéx
@FelipeOliveir4
@FelipeOliveir4 2 ай бұрын
A galera só quer saber de React, essa galera sabe que no momento atual é melhor estudar Angular? Que é justamente o que as grandes empresas usam? Que lá fora um dev front não se limita a 1 ou 2 frameworks? Vejo muito colega meu do layoff reclamando da vida, mas correr atrás que é bom nada.
@kipperdev
@kipperdev 2 ай бұрын
É isso aí! A linguagem/framework tem que ser uma ferramenta que usamos, não o fim do nosso aprendizado
APRENDA DOCKER DO ZERO | TUTORIAL COMPLETO COM DEPLOY
44:15
Fernanda Kipper | Dev
Рет қаралды 82 М.
Дарю Самокат Скейтеру !
00:42
Vlad Samokatchik
Рет қаралды 6 МЛН
100❤️
00:19
MY💝No War🤝
Рет қаралды 21 МЛН
He sees meat everywhere 😄🥩
00:11
AngLova
Рет қаралды 12 МЛН
Became invisible for one day!  #funny #wednesday #memes
00:25
Watch Me
Рет қаралды 56 МЛН
Resolvendo DESAFIO de VAGA BACKEND com Java Spring
1:25:07
Fernanda Kipper | Dev
Рет қаралды 300 М.
Dockerize an Angular Application using Nginx
56:41
Get Arrays
Рет қаралды 17 М.
Programmatic Navigation in SwiftUI explained
17:50
donny wals
Рет қаралды 2,1 М.
ARQUITETURA BACKEND DO FACEBOOK | System Design
27:12
Fernanda Kipper | Dev
Рет қаралды 19 М.
APRENDA GIT e GITHUB DO ZERO - guia completo
37:00
Fernanda Kipper | Dev
Рет қаралды 52 М.
Vim Tips I Wish I Knew Earlier
23:00
Sebastian Daschner
Рет қаралды 43 М.
REAGINDO VAGAS DE FULLSTACK/FRONTEND DA GRINGA | O que elas estão pedindo ?
22:24
Lembra dos SONS BIZARROS do MODEM? A gente conta o que eram!
19:05
Manual do Mundo
Рет қаралды 628 М.
RESOLVENDO DESAFIO FRONTEND - PROJETO ANGULAR COMPLETO
3:23:50
Fernanda Kipper | Dev
Рет қаралды 221 М.
Зачем ЭТО электрику? #секрет #прибор #энерголикбез
0:56
Александр Мальков
Рет қаралды 198 М.
НЕ ПОКУПАЙ СМАРТФОН, ПОКА НЕ УЗНАЕШЬ ЭТО! Не ошибись с выбором…
15:23
تجربة أغرب توصيلة شحن ضد القطع تماما
0:56
صدام العزي
Рет қаралды 47 МЛН
Отдых для геймера? 😮‍💨 Hiper Engine B50
1:00
Урна с айфонами!
0:30
По ту сторону Гугла
Рет қаралды 8 МЛН