Netlify Drop — O jeito mais fácil de subir o seu site na internet (de graça!)

Diego Martins de Pinho
Code Prestige
Published in
4 min readAug 17, 2018

Hoje em dia a coisa mais natural do mundo é ter o seu espaço na internet. E aqui não estou falando de ter um perfil nas redes sociais, mas sim, de ter um site próprio. Há uma série de vantagens em se ter um, principalmente se você trabalha com desenvolvimento de software, afinal, será neste espaço onde deverá estar todo o seu portfólio.

Entretanto, além dos custos de ser ter um domínio próprio (hoje o .com.br está na faixa dos R$ 45 reais/ano), precisamos nos preocupar com onde este site será hospedado. Neste aspecto, há milhares de opções disponíveis, mas quero te mostrar uma que acredito ser a mais fácil: o Netlify Drop.

Versão em Vídeo

Além das instruções que daremos abaixo, você também pode acompanhar todos os passos que serão feitos na versão em vídeo!

Se gostou, se inscreva no nosso canal para receber as novidades!

Hospedando sites na faixa

O Netlify Drop é o sucessor do falecido Bitballoon, serviço de hospedagem de sites que funcionava muito bem. Após a parceria das empresas, todos os sites do antigo serviço foram transferidos para o Netlify Drop; oferecendo agora uma interface (muito!) mais bonita e intuitiva para os usuários.

A utilização do serviço é bastante simples. A partir deste ponto vou assumir que você já tem o seu sitezinho pronto para deployar. Se não for o caso, crie apenas um HTML simples para testar e ver como é bem intuitivo.

O primeiro passo é criar um usuário no serviço. Temos 4 opções: GitHub, GitLab, BitBucket e e-mail.

Tela de login do Netlify Drop

Feito isso, você já está pronto para subir o seu site dentro do serviço. Para fazer isso, basta arrastar a pasta onde está o seu projeto para dentro do espaço dedicado (agora entendeu porque o serviço se chama Netlify Drop? rs).

Tela inicial do Netlify Drop

Ao fazer isso, o site começará a processar o seu projeto. O único requisito funcional para que a mágica funcione é que o arquivo index.html precisa existir, afinal, ele é o ponto de partida do seu site. Com o site sendo processado, você automaticamente cairá nesta página.

Tela de configuração do seu projeto

Note que o Netlify adota um nome aleatório para o seu site. No meu caso foi o “gracious-curran-f2807d”. Dificilmente você gostará de mantém este nome, por isso, para alterá-lo basta entrar na opção Site settings. Neste menu há uma infinidade de configurações possíveis, mas para este artigo vamos focar somente na primeira, Site name.

Tela de configurações do Netlify Drop

E pronto! O seu site está disponível no link que você configurou! E o melhor de tudo, com certificado SSL!

Meu site pessoal publicado!

ps: vale a pena mencionar o que o nome do site está sujeito a disponibilidade no serviço.

Esta é só a ponta do iceberg…

Achou o serviço incrível? Eu também. Já o utilizo para subir meus sites e até mesmo projetos em React. Fora isso, também subo os meus jogos criados através da plataforma Construct 2 (te convido a ler o meu livro sobre o assunto!).

ps: Veja um exemplo simples de jogo criado com o Construct 2 e h ospedado no Drop clicando aqui.

Mas se você é curioso como eu, deve ter notado várias possibilidades na tela de configuração. Entre elas, estão:

  • Configuração de domínio personalizado
  • Administração de time (acesso de controle)
  • Deploy contínuo (integração com o Git)
  • Manipulação de Forms e Login
  • Split Testing
  • E muito mais…

O serviço é muito completo e obviamente algumas destas funcionalidades são pagas (e caso exista interesse de vocês, posso escrever mais artigos explicando como explora-las). Entretanto, para o uso básico, você não gastará nenhum centavo :)

Referências

Gostou? Recomende 👏 este artigo e acompanhe nossa publicação para não perder os próximos conteúdos!

Siga nossa publicação e não perca os próximos artigos! http://www.codeprestige.com.brFacebook, Twitter, Youtube

Siga o autor deste artigo e troque uma ideia com ele! http://www.diegopinho.com.br • Twitter, LinkedIn

Aprenda mais com nossos cursos de programação online!

ECMAScript 6ECMAScript 7 e 8React 16VS CodeMais

--

--

Diego Martins de Pinho
Code Prestige

Professor de tecnologia, desenvolvedor de software e escritor