Publicando seu site

Quais são as opções?

Publicar um site não é um tópico simples, principalmente porque há muitas maneiras diferentes de fazê-lo. Nesse artigo, nós não miramos em documentar todos os métodos possíveis. Antes, nós vamos discutir os prós e contras de três grandes estratégias do ponto de vista de um iniciante, e então guiá-lo em um método que vai funcionar por enquanto.

Conseguindo uma hospedagem e um nome de domínio

Se você quer total controle sobre seu site publicado, então você provavelmente vai precisar gastar dinheiro para comprar:

• Hospedagem — espaço alugado de arquivos no servidor de uma compania de hospedagem. Você coloca os arquivos do seu site no espaço, e o servidor dispõe o conteúdo para os usuários que o requerem.
• Um nome de domínio — o endereço único onde pessoas encontram seu site, como https://www.mozilla.org, ou https://www.bbc.co.uk. Você aluga seu nome de domínio por anos de um registrador de domínio.

Muitos sites profissionais ficam online dessa maneira.

Você vai precisar ainda de um programa de File Transfer Protocol (FTP) (veja How much does it cost: software para mais detalhes) para transferir os arquivos do site ao servidor. Programas FTP variam, mas geralmente você tem que logar no servidor usando detalhes providos por sua compania de hospedagem (ex. username, password, host name). Então, o programa mostra para você os arquivos locais e do servidor em duas janelas, para que você possa transferí-los ao servidor e de volta para o computador:

Dicas para encontrar hospedagem e domínios

• Nós não promovemos companias de hospedagem comercial aqui. Para encontrar companias de hospedagem e registradores de nomes de domínio, basta procurar "web hosting" e "nomes de domínio" para encontra uma companhia vendendo registros de nomes de domínios. Todas essas companias possuem uma ferramenta que te permite procurar pelo nome de domínio desejado.
• Seu provedor de Internet local ou empresarial pode prover alguma hospedagem limitada para um site pequeno. Essa ferramenta disponíveis será limitada, mas pode ser perfeita para seus primeiros experimentos — entre em contato com eles e pergunte!
• Há alguns serviços disponíveis gratuitamente, como Neocities, Blogspot e Wordpress. De novo, você tem pelo que você é pago, mas eles são ideais para seus experimentos iniciais. Serviços gratuitos muitas vezes não requerem software FTP para uploads — você pode apenas arrastar e soltar dentro da interface web.
• Às vezes, companias provem hospedagem e domínio em um pacote.

Usando uma ferramenta online como Github ou Dropbox

Algumas ferramentas permitem que você publique seu site online:

• Github é um site de "social coding". Ele permite que você faça upload de repositórios de código no sistema de controle de versão Git. Você pode então colaborar em projetos de código, e o sistema é open-source por padrão, o que significa que todo mundo pode encontrar seu código Github, usá-lo, aprender com ele e se aprimorar. Você pode fazer isso com o código de outras pessoas também! Essa é uma comunidade muito importante e útil para se envolver, e o Git/Github é um sistema de controle de versão muito popular — muitas companias agora o usam em seus fluxos de trabalho. Github tem uma característica muito útil chamada Github pages, que permite a você expor códigos de sites na Web.
• Dropbox é um sistema de depósito de arquivos que permite que você salve seus arquivos na Web e tenha eles disponíveis em qualquer computador. Todo mundo com uma conexão à Internet pode acessar qualquer pasta de Dropbox que você permita o acesso público. Se essa pasta tiver arquivos de site, eles automaticamente serão tratados como um site. Veja Host websites With Dropbox para mais informação.

Diferente da maioria das hospedagens, essas ferramentas são grátis para uso, mas você tem um limite de ferramentas para uso.

Usando uma IDE web-based como o Thimble

Há um número grande de web apps que emulam um ambiente de desenvolvimento de site, te permitindo entrar HTML, CSS e JavaScript e então expor o resultado em um site — tudo em uma tab de browser! Falando de forma genérica, essas ferramentas são fáceis e grátis (para características básicas), e elas geralmente hospedam sua página em um endereço único na web. No entanto, as características básicas são muito limitadas e os apps não provem espaço para elementos mais elaborados (como imagens).

Tente brincar com alguns desses exemplos, e veja qual se encaixa melhor com você:

• JSFiddle
• Thimble
• JSBin

Publicando via Github

Agora vamos te guiar em como publicar seu site via Github pages. Nós não estamos dizendo que essa é a única (ou mesmo a melhor) maneira de publicar seu site, mas é grátis, simples, e aborda algumas habilidades que serão úteis no futuro.

Configuração Básica

1. Primeiramente, instale Git na sua máquina. Essa é a versão por baixo dos panos do sistema de controle de versão de software que o Github trabalha no topo.
2. Agora, crie uma conta no Github. É simples e fácil.
3. Uma vez que você criou a conta, logue no Github.com com seu username e password.
4. Agora, você precisa criar um novo repositório para seus arquivos. Clique em Mais (+) no topo à direita no site do Github, e escolha New Repository.
5. Nessa página, na caixa Repository name, entre username.github.io, onde username é seu nome de usuário. Então por exemplo, nosso amigo bobsmith digitaria bobsmith.github.io.
6. Clique Create repository; isso deve te levar a essa página:

Subindo seus arquivos no Github

Aqui nós teremos que usar linhas de código para colocar nossa pasta no Github. Uma linha de comando é uma janela onde você digita comandos para fazer coisas como criar arquivos e rodar programas, em vez de clicar em uma interface de usuário. Isso parecerá algo do tipo:

Todo sistema de operação vem com uma ferramenta de linha de comando:

• Windows: Command Prompt pode ser acessado ao pressionar o botão do Windows, digitar Command Prompt, e escolhê-lo na lista que aparecer. Note que o Windows tem suas próprias convenções de comando, diferente do Linux e Mac OS X, então os comandos vão variar conforme a máquina.
• Mac OS X: Terminal pode ser encontrado em Applications > Utilities.
• Linux: Geralmente você pode abrir o terminal com Ctrl + Alt + T. Se isso não funcionar, procure por Terminal em um app bar ou menu.

Isso pode parecer assustador no começo, mas não se preocupe — em breve você estará fera nos básicos. Você diz ao computador como fazer algo ao digitar uma linha de comando e digitar Enter.

1. Aponte a linha de comando para o seu diretório test-site (ou como você quiser chamar o diretório que contem seu site). Para isso, use o comando cd (isso é, "change directory"). Isso é o que você vai digitar se você colocar seu site em um diretório chamado test-site do seu desktop:

   cd Desktop/test-site

2. Quando a linha de comando é direcionada para o diretório do seu site, digite o seguinte código, que diz à ferramenta git para transformar o diretório em um repositório git:

   git init

3. Agora, volte ao site do Github. Na página atual, você está interessado na parte …or push an existing repository from the command line. Você deve ver duas linhas de código listadas nessa parte. Copie tudo da primeira linha, cole na linha de comando e pressione Enter. O comando deve parecer algo do tipo:

   git remote add origin https://github.com/bobsmith/bobsmith.github.io.git

4. Agora, digite os seguintes comandos e pressione Enter depois de cada um. Prepare o código para subir para o Github, e peça ao Git para gerenciar esses arquivos.

   git add --all
   git commit -m 'adding my files to my repository'

5. Finalmente, suba o código para a sua página do Github e entre no terminal o segundo comando que vimos no step 3:

   git push -u origin master

6. Agora quando você for para o endereço web de sua página no Github em uma nova tab de browser (username.github.io), você deve ver seu site online! Mande um email para seus amigos e demonstre sua maestria.

Mais conhecimentos de Github

Se você quiser fazer mais mudanças em seu site teste e subí-las para o Github, você só precisa fazer a mudança nos arquivos que você fez antes. Então, você precisa digitar o seguinte comando (aperte Enter depois de cada um) para subir essas páginas para o Github:

git add --all
git commit -m 'another commit'
git push

Você pode substituir another commit com outra mensagem que descreva a mudança que você fez.

Nós só arranhamos a superfície de Git. Para saber mais, comece com a página de ajuda do Github.

Conclusão

Nesse ponto, você deve ter sua página em um endereço web único. Muito bom!

Mais leituras

• What is a web server
• Understanding domain names
• How much does it cost to do something on the web?
• Cheap or free static web hosting por Scott Murray tem ideias úteis sobre serviços disponíveis.