Fui na emoção desenvolver meu projeto sem pensar na parte de deploy... que trampo bixo kkkkkkk, ajudou muito mano, vlw! Até salvei seu vídeo na minha playlist aqui.
Parabéns meu chará! Ótimo vídeo, excelente didática, extremamente útil. PS.: No momento deste comentário, no engines em package.json em 3:14, o node está na versão 18, ficando assim: "engines": { "node": "18.x" } 🙌
Meu Deus, eu não sabia que precisava separar o Back-end do Front-end dessa forma para o Deploy... Fodeu... Agora vou ter o trampo de separar os dois e subir separadamente 💀
Tava fazendo um e-commerce, deu um trabalho e tanto fazer esse deploy e configurar o projeto, horas e horas, mas... consegui, deu certo! Tome-le GPT, tome-le video, nada de resolver, li as doc, nada, ai descansei... fui dar outra olhadinha, achei o que era, dai consegui fazer o deploy depois... Eu não tava conseguindo fazer a requisição do front pro back, no backend eu usava o express ai no front eu não estava usando o axios, ai tive que configurar tudo certinho, ai quando eu fiz a primeira requisição do front e deu certo, fiquei tão feliz, ai foi só alegria, descansar agora...
Eu comecei a estudar backend e não sabia fazer o deploy ajudou mt, se tiver como ensinar a usar com banco de dados no caso tô usando sqlite, mas ainda não sei fazer🤡
muito bom o vídeo, só uma coisa devo usar o vercel apenas projetos que mexem com back-end e o netlify para projetos front-end? mesmo utilizando frameworks, posso usar estes sites?
Pedro parabéns e obrigado pelo conteúdo! Fiquei com dúvida do motivo que preferiu o netlify. Tem algum problema com custo ou limitações com a vercel ou foi apenas pra diversificar?
Salve man, primeiramente parabéns pelo vídeo! Bom ver o conteúdo relacionado a programação crescendo cada vez mais. Posso estar sendo chato, e desculpa por isso. No app.use(cors()) por padrão isso faz com que qualquer origem de domínio tenha permissão para realizar requests para o servidor, isso seria uma falha de segurança, certo? Sei que o intuito do vídeo não é ser muito explicativo, até porquê é uma aplicação bem simples, posso estar errado também em relação ao cors, se puder tirar a minha dúvida, agradeço.
muito bom o video, me tira uma duvida por favor nao da para subir tudo junto no netlify nao? pois to tentando subir um, mas ta dando erro... tem alguma config especifica para funcionar?
@@pedrosilvadev_Obrigado por responder manow, seguir sua dica... mas infelizmente nao esta funcionando esta dando 404 not found... vou procurar mais pra tentar entender onde estou errando
Opa, bão!? E no meu caso que o backend tem varias pastas, onde eu uso pasta para as controllers e para as routes e tenho também a index, e está tudo separado.. como faço o deploy de várias pastas no backend? No seu vídeo vc só tem um arquivo index.js...
Dev Pedro, queria saber como ofuncionaria se eu tivesse um projeto web, feito com o trio html,css,js e o back end php e mysql, quero saber como eu faria para fazer o deploy do front end e o back end em sites diferentes de deploy???
estou tentando hospedar na vercel um projeto só com uma api backend em express e as páginas em react, porém a vercel não constrói o javascript na página, ela roda a função da api e deixa aberta a roda dela, porém na rota / root do html não tem o bundle.js sendo mandado junto pro cliente, ai não aparece nada, não estou entendendo o que fazer
Bom dia, você esta com 2 projetos diferentes, no caso um para o server e outro para o frontend? E no caso de eu estar com um server.json no mesmo projeto do frontend, como devo hospedar de forma correta?
@@pedrosilvadev_ Ai que esta meu problema, não estou conseguindo fazer isso corretamente, nenhum projeto meu que tem API esta rodando certinho no deploy.
Mano, me dá uma luz aqui kkkkkkk eu tenho uma aplicação que entrega arquivos estáticos com Handlebars, é a aplicação principal. Também tenho outra aplicação totalmente separada que gerencia o conteúdo dessa aplicação principal, tipo um blog. Ela tem um front em Vue.js e um backend em node, como tu faria pra hospedar isso?
Boa noite meu mano, uma dúvida: no meu projeto não há Index.js somente Index.tsx e App.txs já que o projeto é em react. No versel.json e package.json eu coloco para apontar em qual dos dois? Porque eu estou testando os dois mas quando faço o deploy no vercel dá erro 404 Desde já agradeço amigo
como esta usando typescript, precisa gerar um build do projeto, vai gerar uma pasta dist, ai voce joga a config pra essa pasta dist pois lá vai ter o arquivo index.js
O que acontece com os valores contidos no arquivo .env que não sobem para o github? Eu tenho uma aplicação backend aqui com essa característica e mongo db. Dá um help. Valeu.
João se vc se refere a arquivos que ficam em .env ou .env.local, esses são adicionados ao .gitignore pois contém dados sensíveis, geralmente tokens, chaves, credenciais e afins que o backend utiliza pra funcionar, estes só funcionam em dev local e precisam serem criados em variáveis de ambiente na plataforma em qual vc realizar o deploy, e se for em servidor configurado do zero precisam serem criadas também
@@dev-mucaEstou justamente com essa dificuldade, tenho API no código backend e criei as variaveis e deixei a api no .env Porém, se eu não subir o .env, como ele vai funcionar? Você poderia trocar uma ideia cmg pv sobre? Eu até posso pagar pra ti me ajudar nisso. Tmj mano
A conexão deve ser feita no back end, pois ele é o intermediário entre o front (cliente) e o banco de dados. Você terá que usar banco de dados em nuvem, e no backend utilizar as libs necessárias para trabalhar com o tipo de banco escolhido. A Vercel disponibiliza serviços de banco de dados para integrar na aplicação. Agora, se quiser algo gratuito, apenas para estudos ou teste, tem o MongoDB Atlas, que é um cloud do MongoDB e te dá um banco NoSQL de 512MB. OBS: ambos os ambientes da Vercel e Netlify são serverless, portanto não tem como "rodar" um banco diretamente nos deploys
Estou tentando upar um site django no vercel, mas não estou conseguindo, dá um erro de "pip command not found". Eu não sei qual é a maneira correta de fazer o deploy, consegue me ajudar?
@@pedrosilvadev_ deu certo eu já havia encontrado, todavia vou deixar o que achei aqui as configurações extras que precisei fazer para Deploy das minhas SPAs na Vercel e Netlify. para Vercel: Incluir na raiz do projeto um arquivo com o nome "vercel.json" com o conteúdo { "rewrites": [{ "source": "/(.*)", "destination": "/" }] } para Netlify: Incluir na raiz do projeto um arquivo com o nome "netlify.toml" com o conteúdo [[redirects]] from = "/*" to = "/index.html" status = 200
seria possível fazer o deploy em um único projeto (o server e o client) na vercel? algo como ... "builds": [ { "src": "client/package.json", "use": "@vercel/node" }, // Implantação do cliente ReactJS { "src": "server.js", "use": "@vercel/node" } // Implantação do servidor Node.js ],
Fui na emoção desenvolver meu projeto sem pensar na parte de deploy... que trampo bixo kkkkkkk, ajudou muito mano, vlw! Até salvei seu vídeo na minha playlist aqui.
quem nunca né kkkkkkkkkkkk clássico
@@jao2532 sim KAKAKAKAKAKAK
oloco achei super simples
Parabéns meu chará! Ótimo vídeo, excelente didática, extremamente útil.
PS.: No momento deste comentário, no engines em package.json em 3:14, o node está na versão 18, ficando assim: "engines": { "node": "18.x" } 🙌
Me ocorreu esse erro! Bem observado
Explicação simples e direta. Ajudou demais! Obrigada
Vídeo sensacional pra quem quer criar aplicações Full Stack. Ótimo conteúdo. Obrigado por compartilhar isso 🚀 👏🏼👏🏼
muito tooop simples e direto ajudou muito amigao consegui deployar meu front e meu back seguindo teu video valeuzao
This video is fantastic, congratulations for your performance in this presentation.
Merece 1M de curtidas!! Obrigada por criar esse conteúdo incrível!!
Obrigado pelo comentario
Muito obrigado pelo conteúdo! Simples e direto!
Não tentei ainda, mas posso dizer que você salvou minha vida com o deploy na vercel. 👏🏼👏🏼👏🏼👏🏼🧡
Que bom que consegui ajudar 🙏🏽
Parabéns, show de bola! Era isso que estava precisando, obrigado pela ajuda!
Perfeito, que didática incrível, parabens pelo conteúdo muito top !
Muito bom! Estava precisando dessa aula pois tava com dúvidas para subir projetos de backend. 👏👏👏👏
Top man 🙌🏽
Muito obrigado ronaldo fenomeno bombado, é só brincadeira meu mano ajufou demais vlw
E quando o back e o front estão no mesmo projeto, sendo separados por diretórios "api" e "frontend", como seris o processo?
Meu Deus, eu não sabia que precisava separar o Back-end do Front-end dessa forma para o Deploy... Fodeu... Agora vou ter o trampo de separar os dois e subir separadamente 💀
top demais caramba !!!
So fiquei curioso para fazer como ficaria para deixa hospedado e fazendo alterações.
Muito bom Pedro! Obrigado pela ajuda!
Brabo demais, direto ao assunto. Valeu Pedrão
Conteúdo do vídeo muito top!
Tava fazendo um e-commerce, deu um trabalho e tanto fazer esse deploy e configurar o projeto, horas e horas, mas... consegui, deu certo! Tome-le GPT, tome-le video, nada de resolver, li as doc, nada, ai descansei... fui dar outra olhadinha, achei o que era, dai consegui fazer o deploy depois...
Eu não tava conseguindo fazer a requisição do front pro back, no backend eu usava o express ai no front eu não estava usando o axios, ai tive que configurar tudo certinho, ai quando eu fiz a primeira requisição do front e deu certo, fiquei tão feliz, ai foi só alegria, descansar agora...
Como tá fazendo a conexão?
Eu comecei a estudar backend e não sabia fazer o deploy ajudou mt, se tiver como ensinar a usar com banco de dados no caso tô usando sqlite, mas ainda não sei fazer🤡
Conteúdo muito bom!
Obrigado pelo vídeo Pedro, me ajudou demais !!!
FAAZ esse video sobre a aplicação inteira irmaoo, vale muito esses seus conteudos!
muito bom o vídeo, só uma coisa devo usar o vercel apenas projetos que mexem com back-end e o netlify para projetos front-end? mesmo utilizando frameworks, posso usar estes sites?
pode sim,vercel da pra hospedar o front end tbm,so quis mostrar as duas plataformas pra galera
Ajudou bastante!!! Muito obrigado
Muito top, valeu mesmo!
Faz um vídeo desse código mas para pegar emails de registro, seria muito bom.
Valeu.
Muito bom, direto, rápido e rasteiro 👏🏻👏🏻 uma pergunta, não da pra por dois no vercel?
Muito bom, vou subir varios agora, valeu pedro 👏
Show 🚀🚀🚀🚀
Pedro parabéns e obrigado pelo conteúdo! Fiquei com dúvida do motivo que preferiu o netlify. Tem algum problema com custo ou limitações com a vercel ou foi apenas pra diversificar?
Obrigado ! Apenas para mostrar as duas mesmo
muito bom o video faz tempo que queria subir minua api
Excelente conteúdo!
Uma dúvida: dá pra hospedar banco de dados? Se não, o Prisma funciona normal nele?
Cara nunca tentei, teria q dar uma olhada lá na plataforma
Que bom 👏👏👏
Se eu desenvolver uma aplicação fullstack com frontend nextjs e backend express qual seria a melhor forma de hospedagem custo beneficio?
da pra hospedar do jeito que fizno video
@@pedrosilvadev_ paga um pacote e instala frontend e backend junto? É seguro isso?
Muito bom Pedro me salvou
Salve man, primeiramente parabéns pelo vídeo! Bom ver o conteúdo relacionado a programação crescendo cada vez mais. Posso estar sendo chato, e desculpa por isso. No app.use(cors()) por padrão isso faz com que qualquer origem de domínio tenha permissão para realizar requests para o servidor, isso seria uma falha de segurança, certo? Sei que o intuito do vídeo não é ser muito explicativo, até porquê é uma aplicação bem simples, posso estar errado também em relação ao cors, se puder tirar a minha dúvida, agradeço.
isso ai, o certo é configurar o cors para os dominios que podem fazer request para o back end
Ficou show, direto ao objetivo, eu não sabia que dava para hospedar backend na vercel, lá tbm da para colocar banco de dados?
Nunca tentei kkk, costumo usar mongo, então é mais uma conexão apenas sem precisar hospedar
Comecei há pouco tempo, mas qual seria melhor, eu colocaria o site que eu criei no netliy ou no sql server (versão gratuita) que é limitada?
Massa demais, sabe informar onde eu consiga subir alguma aplicação backend com banco de dados postgres, com docker?
Sei que a azure libera 3 meses se n me engano , lá da pra subir dockrr
O render.
Não tem como fazer um projeto completo já com front e Back e subir tudo junto ?
@@Pedromonteiro-xk1tt da sim, hoje em dia da pra se fazer isso usando next js e criando a api direto nele
Precisa configurar a port no vercel? E eu estou com um projeto com banco de dados no neon tech mas tá dando problema na migrations .. o que será??
muito bom o video, me tira uma duvida por favor nao da para subir tudo junto no netlify nao? pois to tentando subir um, mas ta dando erro... tem alguma config especifica para funcionar?
se tiver tentando subir back end, apenas vercel
@@pedrosilvadev_Obrigado por responder manow, seguir sua dica... mas infelizmente nao esta funcionando esta dando 404 not found... vou procurar mais pra tentar entender onde estou errando
Ola Pedro, tudo bem? Eu descobri recente o NETILIFY e gostaria de saber se posso hospedar o back-end nele tbm?
Não tem como, apenas na vercel dessa maneira
ajudou dmsss
Mano, tem como você disponibilizar seu repo se estiver público para eu ver as configurações? É que o meu não deu bom :/
continua com vídeos assim!
Muito bom mano
Opa, bão!? E no meu caso que o backend tem varias pastas, onde eu uso pasta para as controllers e para as routes e tenho também a index, e está tudo separado.. como faço o deploy de várias pastas no backend? No seu vídeo vc só tem um arquivo index.js...
Voce seleciona o arquivo principal, aonde vai iniciar o servidor
@@pedrosilvadev_ deu certo, obrigado!!!
Dev Pedro, queria saber como ofuncionaria se eu tivesse um projeto web, feito com o trio html,css,js e o back end php e mysql, quero saber como eu faria para fazer o deploy do front end e o back end em sites diferentes de deploy???
o front vc consegue subir no github pages, ja o back precisaria criar um contianer docker para rodar o php
Ajudou muito, vou tentar! Mas nao sei como farei com o database
Tenta usar o prisma
estou tentando hospedar na vercel um projeto só com uma api backend em express e as páginas em react, porém a vercel não constrói o javascript na página, ela roda a função da api e deixa aberta a roda dela, porém na rota / root do html não tem o bundle.js sendo mandado junto pro cliente, ai não aparece nada, não estou entendendo o que fazer
Não tem como eu utilizar o mesmo repositório para o back-end e o front-end para fazer o deploy e consumir o meu back-end mesmo assim ?
Eu recomendo deixar separado, até pra facilitar a manutenção , e hoje é o padrão utilizado, mas da pra deixar junto sim
Funciona com fastify também?
Bom dia, você esta com 2 projetos diferentes, no caso um para o server e outro para o frontend? E no caso de eu estar com um server.json no mesmo projeto do frontend, como devo hospedar de forma correta?
Nesse caso, teria q alterar o serve.json e conectar ao Back end
@@pedrosilvadev_ Ai que esta meu problema, não estou conseguindo fazer isso corretamente, nenhum projeto meu que tem API esta rodando certinho no deploy.
@@mr-tomio o Back end sobe ?
O mesmo funciona se o meu back tiver DB?
Mano, me dá uma luz aqui kkkkkkk eu tenho uma aplicação que entrega arquivos estáticos com Handlebars, é a aplicação principal. Também tenho outra aplicação totalmente separada que gerencia o conteúdo dessa aplicação principal, tipo um blog. Ela tem um front em Vue.js e um backend em node, como tu faria pra hospedar isso?
Da mesma forma kkk
Boa noite meu mano, uma dúvida: no meu projeto não há Index.js somente Index.tsx e App.txs já que o projeto é em react. No versel.json e package.json eu coloco para apontar em qual dos dois? Porque eu estou testando os dois mas quando faço o deploy no vercel dá erro 404
Desde já agradeço amigo
como esta usando typescript, precisa gerar um build do projeto, vai gerar uma pasta dist, ai voce joga a config pra essa pasta dist pois lá vai ter o arquivo index.js
@@pedrosilvadev_ estou tentando gerar um build e nao esta dando certo. Se eu alterar o index.tsx para index.js e apontar para ele da certo?
E se meu backend fiz em Java? O que muda no vercel.json e no package?
Cara não sei nada sobre Java kkk teria q dar uma pesquisada
me fiz essa pergunta agora men, conseguiu a resposta? lkkk
Top!!
E o banco de dados mano , como faço pra fazer o deploy de um banco realacional e configurar com no backend ai com express.js ?
O que acontece com os valores contidos no arquivo .env que não sobem para o github? Eu tenho uma aplicação backend aqui com essa característica e mongo db. Dá um help. Valeu.
João se vc se refere a arquivos que ficam em .env ou .env.local, esses são adicionados ao .gitignore pois contém dados sensíveis, geralmente tokens, chaves, credenciais e afins que o backend utiliza pra funcionar, estes só funcionam em dev local e precisam serem criados em variáveis de ambiente na plataforma em qual vc realizar o deploy, e se for em servidor configurado do zero precisam serem criadas também
@@dev-mucaEstou justamente com essa dificuldade, tenho API no código backend e criei as variaveis e deixei a api no .env
Porém, se eu não subir o .env, como ele vai funcionar?
Você poderia trocar uma ideia cmg pv sobre?
Eu até posso pagar pra ti me ajudar nisso. Tmj mano
voce cria variaveis de ambiente na vercel ou no netlify
O código fonte da aplicação fica público como no github? Ou vc pode privar e ainda ter um link público?
É possivel subir alguma aplicação front E backend juntas?
É possível sim, n é muito utilizada hj em dia mais é
Como faço se eu quiser usar um banco de dados pra salvar os dados e fazer o CRUD, tipo MySQL?
descobriu mano?
Vídeo top 👏👏
obs: qual tema tu usa man, interessei pakas kk
Beautiful dracula !
Meu banco de dados é mongo, fiz o deploy do backend na vercel e do frontend na vercel tb, porém por algum motivo tá dando erro...
Como fazer a conexão do site com o banco de dados?
A conexão deve ser feita no back end, pois ele é o intermediário entre o front (cliente) e o banco de dados.
Você terá que usar banco de dados em nuvem, e no backend utilizar as libs necessárias para trabalhar com o tipo de banco escolhido.
A Vercel disponibiliza serviços de banco de dados para integrar na aplicação.
Agora, se quiser algo gratuito, apenas para estudos ou teste, tem o MongoDB Atlas, que é um cloud do MongoDB e te dá um banco NoSQL de 512MB.
OBS: ambos os ambientes da Vercel e Netlify são serverless, portanto não tem como "rodar" um banco diretamente nos deploys
no meu deu Congratulations! porem na tela erro 404 sabe dizer o motivo ?
Se a api fazer uso de um banco de dados, funciona fazer deploy no vercel?
geralmente utilizo prisma pra isso
Muda alguma coisa se tiver um banco de dados? Eu uso o MySQL
Também gostaria de saber!
use o Prisma para fazer a conexão com o DB no backend
Estou tentando upar um site django no vercel, mas não estou conseguindo, dá um erro de "pip command not found". Eu não sei qual é a maneira correta de fazer o deploy, consegue me ajudar?
vou ficar devendo, em django nao tenho conhecimento
@@pedrosilvadev_ sem problemas, vlw por responder
Gostaria de saber pq quando eu subo o servidor ao index dele me retornar a resposta do método GET ele retorna todo o código da pasta index.js
Deve ter feito algo errado, coloca uma rota get com um hello pra ver se vai retornar
Ele aceita se eu mandar diretamente usando ts? ou tenho que fazer a conversão para js?
voce precisa gerar um build do ts para js
Fala amigo falto mostrar como faz a conecxao com o banco de dados
Não tem banco de dados, só adicionei um array para simular o intuito era só mostrar o deploy
Agora eu viro dev full sterco 😀
brabo
de onde tirar isso q tem q colocar na versel.js???
pra mim ta dando erro de "versions" na hora de fazer o deploy
Funciona com python tbm?
Qual banco de dados você utilizou?
Ali foi só um array mesmo. Pra simular as requisições, mas costumo usar mongodb
@@pedrosilvadev_ E como seria o deploy desta aplicação com o mongo.db?
O ruim é que as duas pastas ficam separadas
meu router dom se perde quando dou f5
isso aqui pode te ajudar stackoverflow.com/questions/64815012/why-does-react-router-not-works-at-vercel
@@pedrosilvadev_ deu certo eu já havia encontrado, todavia vou deixar o que achei aqui as configurações extras que precisei fazer para Deploy das minhas SPAs na Vercel e Netlify.
para Vercel: Incluir na raiz do projeto um arquivo com o nome "vercel.json" com o conteúdo
{
"rewrites": [{ "source": "/(.*)", "destination": "/" }]
}
para Netlify: Incluir na raiz do projeto um arquivo com o nome "netlify.toml" com o conteúdo
[[redirects]]
from = "/*"
to = "/index.html"
status = 200
Bá, to fazendo curso onde front e feito junto com backend, etendi foi nada que tu fez kkkkkkkkk. me fudi
tentei de varias formas so da error
Banco de dados?
O meu não mostrou ola mundo e sim o código completo pq ??
Alguém?????
o meu deu not_found 404
Michael, conseguiu resolver? Pq o meu ta dando exatamente isso!
@@igorfontenelle9341 sim mano eu só deletei e fiz dnv acho que eu tinha escrito a caminho errado
@@igorfontenelle9341 o meu ta dando tambem, tentei em dois projetos
Com `gh repo create` nem precisa acessar o github!!
seria possível fazer o deploy em um único projeto (o server e o client) na vercel?
algo como ... "builds": [
{ "src": "client/package.json", "use": "@vercel/node" }, // Implantação do cliente ReactJS
{ "src": "server.js", "use": "@vercel/node" } // Implantação do servidor Node.js
],
Da pra vc criar usando next, e fazer api no próprio nextjs
@@pedrosilvadev_ salvo engano, serverless functions na vercel não suportam websockets, e no glitch também é bem chatinho
Cai no click bait, linguagem de front no backend :( queria um pra hospedar java.
nesse perfil nao falamos sobre java kkkkkk
ai que triste kkk @@pedrosilvadev_