Então, digamos que você veio para cima com um site muito agradável.
Eu tenho um bem aqui.
Vou clicar no meu arquivo index.html
e tenho algumas imagens nele.
Eu tenho um arquivo especial chamado CSS que
você pode não estar familiarizado com ainda, mas tudo bem.
Mas vamos ver como é o meu site.
Aqui vamos nós, para cima.
Aqui está apenas uma pequena página que eu fiz sobre mim com um pouco de formatação.
Mas se você verificar e você tipo de olhar no canto superior,
você pode ver que este site não está ao vivo.
O fato de que diz, “dois-pontos “,
tão adiante, que não posso compartilhar com outras pessoas ao vivo.
Eu posso enviar meu código por e-mail,
eu poderia dizer para alguém, “Oh, olha,
eu fiz uma página da web”, e então eu poderia enviar para eles
este arquivo e todas as imagens e tudo mais,
mas isso é um pouco chato.
Então, vamos tentar fazer com que este site vá ao ar na minha conta do GitHub Pages.
Então, volte aqui,
para minha conta do GitHub que se você ainda não criou, tudo bem.
Eu tenho outro vídeo,
vá criar sua conta e volte aqui e se encontre com a gente.
Mas tirando isso,
vou fazer minha primeira conta ao vivo.
Mais uma vez, vou subir e fazer um plus para um novo repositório.
Basicamente, considere uma nova pasta cheia de código.
Da última vez precisei ter muito cuidado com o nome do repositório, não desta vez.
Eu só vou chamar este,
digamos amostra, eu tento muito manter tudo em minúsculas.
Você pode incluir o pouco como traço,
mas sem caracteres especiais.
Então, vou deixar como amostra.
Muito importante, eu vou clicar em”, Inicialize este repositório com um Leia-me,
e eu clico sobre isso,
e eu vou clicar em “Criar repositório”.
Então, o GitHub agora está criando um novo site para eu fazer upload do meu código.
Agora, as pessoas que usam o GitHub para,
eu vou dizer como reais,
estão realmente fazendo um monte de coisas a partir de
linhas de comando e eles têm que memorizar um monte de coisas.
Não vamos fazer isso.
Estamos apenas usando o GitHub Pages para hospedar nosso código.
Então, vamos clicar em “Fazer upload de arquivos”.
Agora, aqui está uma parte complicada,
se eu clicar em “Escolha seus arquivos”,
eu poderia fazer isso e eu poderia ir através e escolher,
bem, eu preciso deste arquivo e aquele,
mas ele não vai me deixar carregar pastas inteiras.
Veja se eu clico em CSS e eu clico em abrir, é como, “Oh,
este é o arquivo que você quer?” ,
eu não quero isso, eu quero tudo, não apenas arquivos.
Então, eu clico em “Adicionar”.
O que eu vou fazer é ir até aqui,
e eu vou apenas voltar para cima, um,
e eu vou apenas arrastar esta pasta toda de uma vez,
e isso vai me deixar carregar quantos arquivos eu quiser.
O próximo erro que cometo o tempo todo é que eu esqueço de ir
até o fundo e dizer: “Comprometa mudanças”.
Então, este é o primeiro passo de dois passos para fazer o seu site entrar em funcionamento.
O primeiro passo é apenas fazer upload de seus arquivos.
Novamente, isso pode levar alguns minutos para ser concluído.
Então, enquanto isso está acontecendo,
eu vou subir, até lá e então eu vou subir.
Então, o que eu vou clicar agora é,
eu vou subir e clicar em “Configurações”. Tudo bem.
Agora, o que eu preciso fazer é dizer, “Ei,
se alguém quer ver meu site,
eu não quero que eles vejam meu código.
Eu quero que eles vejam minha página real.”
Então, eu vou voltar aqui,
e eu vou rolar para baixo, rolar para
baixo neste mouse,
e o que eu estou procurando é um site que diz, “páginas do GitHub”.
Vá para nenhum e escolha ramo mestre e salve. Tudo bem.
Nunca se sabe se funcionou ou não.
Então, eu vou voltar para baixo novamente,
clicar aqui e voltar para baixo,
e se eu descer para as páginas do GitHub, ele vai me dizer,
“Ei, seu código está agora aqui”.
Então, eu vou clicar sobre isso,
e não é incomum para dizer, hey,
você não tem nada ainda ou algo assim.
Então, o que eu vou fazer é,
eu vou voltar ao meu código e dizer, “Ok”.
Qual era o nome da pasta que eu arrastei para cima?
Oh, era o sampler,
e qual era o nome do meu arquivo?
Felizmente, foi index.html e é, ótimo.
Eu vou para aqui,
e agora quando eu clicar,
eu tenho um erro 404.
Não se preocupe, isso vai acontecer muito.
A primeira coisa a verificar é,
você colocou um erro de digitação?
Sim, eu escrevi amostra em vez de sampler.
Então, vamos colocar esse r ali.
Agora, eu vou apertar Enter e lá está o meu site. Tudo bem.
Então, o que você pode fazer,
as duas etapas para criar esta conta do GitHub é carregar
seu arquivo e, em seguida, alterar esse tipo de link para GitHub Pages para ativá-lo.
Depois de fazer isso,
você pode carregar quantas coisas quiser.
Mas vou fazer mais uma coisa com você rapidinho.
Vou voltar para minha conta do GitHub
e vou fazer isso mais uma vez, mas um pouco diferente.
Quero ir para github.com.
Vou fazer mais um repositório.
Vou chamar este,
amostra dois, e desta vez,
vou esquecer e não vou clicar neste Leia-me.
Vamos clicar no repositório.
Oh! Bem, agora não há lugar para eu clicar nos arquivos de upload,
e você se sente meio preso.
Se você esquecer, basta rolar para a direita até o link Leia-me na página,
e você clica nele e eu sou realmente cria o Leia-me.
Ele vai cair.
Só para que você saiba, commit new file é
o equivalente a salvar arquivos para o que fazemos em nossa área de trabalho.
Então, agora, eu posso fazer upload de arquivos.
Vou fazer isso mais uma vez para te mostrar
outra maneira provavelmente mais fácil. Eu vou voltar aqui.
Antes de arrastar toda a pasta do sampler,
desta vez vou pegar aqui.
Estão todos a carregar.
Vou clicar em “Confirmar alterações”.
Enquanto isso está acontecendo,
eu quero que você pense,” Qual foi o segundo passo?
Qual foi o próximo passo que ela disse que eu tinha que fazer?
Esse passo é entrar em configurações e adicionar as páginas do GitHub.
Então, vamos até as configurações. Para
cima, vai acontecer, bem aqui.
Role para baixo no ramo Mestre e salvar,
e então desde que eu quero ser um pouco preguiçoso,
Eu só vou rolar para baixo aqui novamente,
e ser como” Oh ótimo, aqui está o link para o meu site”.
Vou clicar nele. Novamente, quando você recebe o erro 404,
geralmente há duas razões: ou você soletrou
algo errado, o que não é o caso aqui porque
clicamos nele, não digitamos nada.
Ou você precisa dar ao GitHub mais alguns minutos para
carregar tudo ou o terceiro é às vezes,
não tenho exatamente certeza do porquê, mas às vezes, o
GitHub parece quase esquecer de procurar o arquivo index.html.
Então, eu aperto “Enter”, e lá vamos nós.
Então, o GitHub Pages é uma ótima maneira gratuita para você hospedar
seu código e compartilhá-lo com
todos que você acha que ficarão impressionados com seu incrível trabalho.