Já vimos aqui no blog um post sobre a criação de um repositório no Github e sobre a utilização do Github Pages para criação de portfólio. Esse recurso por si só já é muito bom, pois evita a necessidade de um servidor pago para ter um site, mas ele fica ainda mais atraente com a utilização de domínios personalizados nessas páginas.
Por padrão, quando criamos um site no Github Pages o endereço utilizado para acessar a página possui o padrão: https://nome_do_usuario.github.io/nome_do_repositorio
fica muito mais interessante se ao invés disso, usarmos por exemplo, para uma página pessoal o domínio relacionado ao seu perfil de desenvolvedor https://seunome.dev
, no meu caso utilizo https://eltonfonseca.dev
Curso Git e GitHub - Controle de versão
Conhecer o cursoServiço de DNS
Quando compramos um domínio, precisamos de um serviço de DNS onde vamos criar as zonas. Alguns vendedores de domínio já possuem por padrão o serviço de DNS também, como é o caso do Google Domínio, dono dos domínios .dev
, mas a maioria dos vendedores de domínio não possuem.
Primeiramente vamos ver como realizamos a configuração do domínio onde o vendedor não possui o serviço de DNS (como é o caso do registro.br, por exemplo). Nesse caso podemos usar a Cloudflare que possui plano gratuito. Acesse o link https://dash.cloudflare.com/sign-up para realizar o cadastro.
Depois de logado precisamos adicionar um novo site:
Informe o domínio do seu site:
Basta seguir os passos para terminar a adição, única coisa que precisa se atentar é o tipo de plano para selecionar gratuito.
Apontar o DNS no domínio
Agora precisa informar na empresa onde comprou o domínio qual é o servidor que será responsável pelos DNS. Acesse a página de Overview do seu site na Cloudflare, ele te apresentará quais nameservers deve usar:
Se o domínio foi comprado no registro.br, após logar basta clicar sobre ele e clicar no botão Alterar Servidores DNS. A configuração deve ficar conforme a imagem abaixo:
Se tiver comprado o domínio em outra empresa precisará verificar qual é o procedimento específico no sistema dela, geralmente isso é bem simples.
Curso Git - Fundamentos
Conhecer o cursoAdicionar zona de DNS na Cloudflare
Agora precisamos criar uma zona no Cloudflare que aponta para o IP do Github Pages, com isso toda vez que o usuário acessar no navegador https://eltonfonseca.dev ele retornará o caminho para a página. Vamos usar no nosso exemplo uma zona tipo A
, mas poderíamos usar um ALIAS
ou ANAME
.
Acesse o menu DNS no painel do site no Cloudflare e em seguida adicione o seguinte registro:
Esse endereço de IP foi retirado da página da documentação do Github Pages. Ele ainda possui outros ips alternativos:
- 185.199.108.153
- 185.199.109.153
- 185.199.110.153
- 185.199.111.153
Basicamente terminamos a nossa configuração de DNS. Se a empresa onde comprou o domínio já possuir o gerenciador de DNS basta realizar esse último passo.
Veja no Google Domains como isso é feito:
Configurando o Github Pages
Precisamos configurar o Github para responder ao domínio personalizado que criamos. Depois de já ter o site funcionando com o endereço padrão (mostrado no post do início).
Acesse as configurações do repositório onde está o site:
Em seguida em GitHub Pages informe o seu domínio personalizado:
Depois de clicar em Save marque também a opção Enforce HTTPS para que os acessos aconteçam via HTTPS.
Podemos testar o site no navegador com o novo domínio:
Prontinho já temos o nosso site funcionando com domínio personalizado no Github Pages. Isso nos permite hospedar sites estáticos de forma extremamente simples sem ter que pagar um servidor de hospedagem ou realizar configurações complexas. O Github Pages possui algumas limitações e politicas de uso, antes de iniciar o seu uso pode ser interessante ler a documentação.