{"id":179,"date":"2025-07-29T20:43:32","date_gmt":"2025-07-29T20:43:32","guid":{"rendered":"https:\/\/codefornoobs.pt\/?p=179"},"modified":"2025-07-29T20:43:33","modified_gmt":"2025-07-29T20:43:33","slug":"deploy-na-vercel-para-iniciantes-guia-passo-a-passo","status":"publish","type":"post","link":"https:\/\/codefornoobs.pt\/?p=179","title":{"rendered":"Deploy na Vercel para Iniciantes \u2014 Guia Passo a Passo"},"content":{"rendered":"\n

Antes de come\u00e7ares o processo de publica\u00e7\u00e3o do teu site est\u00e1tico, precisas de uma conta na Vercel \u2014 a plataforma respons\u00e1vel por alojar e disponibilizar o teu projeto na web. A cria\u00e7\u00e3o da conta \u00e9 simples e pode ser feita em poucos passos.<\/p>\n\n\n\n

Primeiro, acede a https:\/\/vercel.com<\/a> e clica em “Sign Up”. Vais ser convidado a escolher um m\u00e9todo de autentica\u00e7\u00e3o: podes criar uma conta com email ou, mais comum e pr\u00e1tico, atrav\u00e9s da integra\u00e7\u00e3o com GitHub, GitLab ou Bitbucket. <\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Recomenda-se que uses GitHub, pois a integra\u00e7\u00e3o com os reposit\u00f3rios ser\u00e1 \u00fatil no passo seguinte. Ap\u00f3s autorizares o acesso aos teus reposit\u00f3rios, a tua conta estar\u00e1 pronta a usar. A Vercel oferece um plano gratuito com funcionalidades suficientes para a maioria dos projetos pessoais e de pequena escala.<\/p>\n\n\n\n

Com a conta criada, podes ent\u00e3o preparar o teu projeto local. Este pode ser um conjunto de ficheiros HTML e CSS ou Javascript. Certifica-te de que o projeto est\u00e1 funcional e pronto para ser colocado online. Podes ter tamb\u00e9m projectos com react ou next.js, mas sinceramente nunca experimentei apenas publiquei websites simples.<\/p>\n\n\n\n

O passo seguinte \u00e9 garantir que o projeto est\u00e1 sob controlo de vers\u00f5es com Git. No terminal, inicializa o reposit\u00f3rio com git init<\/code>, adiciona os ficheiros com git add .<\/code>, faz o primeiro commit e cria um reposit\u00f3rio remoto no GitHub. Liga o teu reposit\u00f3rio local ao remoto com git remote add origin <URL><\/code> e faz git push<\/code> para a branch principal. Neste post explico um pouco melhor ao pormenor como criar um reposit\u00f3rio no Github. \u00c9 algo simples e feito em meia d\u00fazia de passos.<\/p>\n\n\n\n

Agora que o projeto est\u00e1 no GitHub, voltas ao dashboard da Vercel e escolhe a op\u00e7\u00e3o \u201cAdd New Project\u201d. Vais ver a lista de reposit\u00f3rios dispon\u00edveis \u2014 escolhe aquele onde colocaste o teu projeto e clica em \u201cImport\u201d. <\/p>\n\n\n\n

\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n<\/figure>\n\n\n\n

Poder\u00e1 ser preciso dar permiss\u00e3o para a Vercel conseguir ter acesso ao reposit\u00f3rio que pretendes publicar. Recomomendo dar acesso apenas aos projectos que pretendes publicar.<\/p>\n\n\n\n

A Vercel tentar\u00e1 identificar automaticamente o tipo de framework usado e propor as configura\u00e7\u00f5es adequadas. Caso necess\u00e1rio, podes ajustar o comando de build (por exemplo, npm run build<\/code>) e o diret\u00f3rio de sa\u00edda (dist<\/code>, build<\/code> ou .next<\/code>, dependendo do caso).<\/p>\n\n\n\n

Ap\u00f3s confirmares tudo, o processo de compila\u00e7\u00e3o e publica\u00e7\u00e3o inicia-se automaticamente. No fim, a Vercel apresenta-te um endere\u00e7o p\u00fablico \u2014 geralmente com o formato https:\/\/nome-do-projeto.vercel.app<\/code> \u2014 onde podes aceder ao site publicado. Cada vez que fizeres altera\u00e7\u00f5es e as enviares para o GitHub, a Vercel voltar\u00e1 a construir e atualizar o site de forma autom\u00e1tica.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Se quiseres associar um dom\u00ednio pr\u00f3prio, podes faz\u00ea-lo nas defini\u00e7\u00f5es do projeto. Tens duas op\u00e7\u00f5es: <\/p>\n\n\n\n

    \n
  • Primeira, compras diretamente o dominio so site, que h\u00e1-de facilitar um pouco o processo de adicionar um novo dominio; <\/li>\n<\/ul>\n\n\n\n
      \n
    • segunda, compras um dominio onde preferires (Existem imensos sites onde podes commprar o dominio). <\/li>\n<\/ul>\n\n\n\n
      \"\"<\/figure>\n\n\n\n

      Honestamente, com um pesquisa r\u00e1pida, no pr\u00f3prio site, podes ter alguma sorte e ter um dominio a um bom pre\u00e7o, mas parece-me, no geral, um pouco mais caro do que o habitual. Eu recomendaria comprar noutro sitio, apesar de ter de fazer mais uns passos. se optaste pela segunda op\u00e7\u00e3o vai ser necess\u00e1rio atualizar os registos DNS no teu provedor. \u00c0 partida \u00e9 s\u00f3 seguir os passos indicados na confira\u00e7\u00e3o do website na vercel. A Vercel trata da emiss\u00e3o do certificado SSL, garantindo que o site fica dispon\u00edvel com liga\u00e7\u00e3o segura (HTTPS) sem que tenhas de configurar nada manualmente.<\/p>\n\n\n\n

      Desta forma ficas um com site online em alguns simples passos. O melhor de tudo \u00e9 que tens o alojamento gratuito e o site fica logo dispon\u00edvel para partilharem com quem quiseres e em qualquer lugar. <\/p>\n\n\n\n

      <\/p>\n","protected":false},"excerpt":{"rendered":"

      Antes de come\u00e7ares o processo de publica\u00e7\u00e3o do teu site est\u00e1tico, precisas de uma conta na Vercel \u2014 a plataforma respons\u00e1vel por alojar e disponibilizar o teu projeto na web. A cria\u00e7\u00e3o da conta \u00e9 simples e pode ser feita em poucos passos. Primeiro, acede a https:\/\/vercel.com e clica em “Sign Up”. Vais ser convidado…<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-179","post","type-post","status-publish","format-standard","hentry","category-sem-categoria"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=\/wp\/v2\/posts\/179","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=179"}],"version-history":[{"count":5,"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=\/wp\/v2\/posts\/179\/revisions"}],"predecessor-version":[{"id":195,"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=\/wp\/v2\/posts\/179\/revisions\/195"}],"wp:attachment":[{"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=179"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=179"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codefornoobs.pt\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=179"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}