image

Acesse bootcamps ilimitados e +650 cursos

50
%OFF
Article image
Rafael Maia
Rafael Maia14/02/2025 10:34
Compartilhe

🚀 Do Zero ao Deploy: Como lançar seu primeiro projeto na web

  • #GitHub
  • #Node.js
  • #Next.js

Fala, Dev! Tudo certo?

Se você já começou a programar e quer ver seu projeto rodando na web, mas não sabe exatamente por onde começar, essa newsletter é para você! Hoje, vou te mostrar um passo a passo simples para transformar seu código local em um site acessível para qualquer pessoa.

1️⃣ Escolha sua stack

image

Antes de mais nada, você precisa decidir:

✔️ Frontend: HTML, CSS e JavaScript (ou frameworks como React, Vue, Svelte).

✔️ Backend: Node.js, Python (Django/Flask), PHP ou outra linguagem.

✔️ Banco de Dados: MySQL, PostgreSQL, MongoDB, Firebase...

Se for um projeto estático (só HTML, CSS e JS), o processo é mais simples!

2️⃣ Versionamento com Git e GitHub

image

Seu código precisa estar bem organizado e acessível. Para isso:

  • Instale o Git e crie um repositório no GitHub.
  • Use comandos básicos:
git init
git add .
git commit -m "Primeiro commit"
git branch -M main
git remote add origin https://github.com/seu-usuario/seu-repo.git
git push -u origin main

3️⃣ Escolha onde hospedar seu projeto

image

Dependendo do seu tipo de projeto, você tem várias opções:

🖥️ Frontend estático: Vercel, Netlify, GitHub Pages.

⚙️ Backend: Render, Railway, Heroku (com limitações).

💾 Banco de Dados: MongoDB Atlas, Supabase, ElephantSQL (PostgreSQL).

4️⃣ Subindo o código no serviço de hospedagem

Para projetos estáticos, basta conectar seu repositório do GitHub no Vercel/Netlify. Para backends, geralmente será necessário rodar comandos como:

git push heroku main  # Heroku  

Ou configurar variáveis de ambiente e um arquivo de configuração na plataforma escolhida.

5️⃣ Configurar um domínio (opcional, mas recomendado!)

Se quiser um domínio próprio (ex: meusite.com), você pode comprar em serviços como:

🌎 Namecheap

🌎 GoDaddy

🌎 Hostinger

Plataformas como Vercel e Netlify permitem conectar um domínio personalizado facilmente.

6️⃣ Teste tudo antes de divulgar!

🔍 Verifique se os links funcionam.

📱 Veja se o site está responsivo no celular.

⚡ Teste a velocidade e performance com o PageSpeed Insights.

🎯 Pronto para lançar!

Agora que seu site está no ar, compartilhe com a comunidade, envie para amigos e, claro, poste no LinkedIn e no X para mostrar o que você criou! 🚀

📩 Se curtiu esse passo a passo, responde aqui me contando qual projeto você quer lançar!

Nos vemos na próxima edição da Na Trilha do Dev! 👨💻🚀

Deixe um comentário e nos siga nas nossas redes sociais! Vamos adorar saber sua opinião. 😊

🚀 Minhas Redes Sociais

Instagram - Facebook - Linkedin - Portfólio - DIO

Compartilhe
Comentários (1)
Katia Packer
Katia Packer - 14/02/2025 10:53

Olá, Rafael.

Muito útil o artigo, parabéns!

Claro e objetivo. 🙂