Faz algum tempo que venho usando o plano gratuito do Heroku para hospedar páginas estáticas, embora você consiga ir muito além disso. De qualquer modo, é uma maneira muito prática de ter sites estáticos com o poder do deploy de aplicações através de um simples push do Git.

O processo em si é bastante simples. Primeiro, você deve organizar todos os seus arquivos em algum diretório, por exemplo, some_site/public. Este diretório pode conter arquivos HTML, JavaScript e CSS. Na prática, você pode servir qualquer tipo de arquivo.

Crie o arquivo some_site/config.ru. Nós iremos servir os arquivos estáticos com Rack. Primeiro, nós vamos criar um aplicativo usando o Rack::Builder. Este aplicativo usará um middleware que redirecionará a requisição na raíz do site para o arquivo some_site/public/index.html.

Todos os outros arquivos do diretório some_site/public serão servidos com o Rack::Directory.

app = Rack::Builder.new do
  use Rack::Static, urls: {"/" => "index.html"}, root: "public"
  run Rack::URLMap.new({
    "/" => Rack::Directory.new("public")
  })
end
 
run app

Crie também um arquivo Gemfile, que terá como única dependência o próprio Rack. Este arquivo Gemfile deve estar na raíz do seu projeto e será algo como isto.

source :rubygems
gem "rack", "~> 1.3"

Execute o comando bundle install para instalar a dependência e gerar o arquivo Gemfile.lock.

Na raíz do projeto, inicie um novo repositório Git e faça o commit inicial.

$ cd some_site
$ git init
Initialized empty Git repository in /Users/fnando/Sites/some_site/.git/
$ git add .
$ git ci -am "Initial commit"
[master (root-commit) 54e37c9] Initial commit
 4 files changed, 31 insertions(+), 0 deletions(-)
 create mode 100644 Gemfile
 create mode 100644 Gemfile.lock
 create mode 100644 config.ru
 create mode 100644 public/index.html

Agora, basta criar seu aplicativo no Heroku. Se você ainda não possui uma conta configurada, veja o que é preciso fazer. Se tudo estiver certo, você pode criar um novo aplicativo com o comando heroku apps:create <seu-app>. O stack padrão é baseado no Ruby 1.9, então estamos muito bem acompanhados.

$ heroku apps:create some-site
Creating some-site... done, stack is bamboo-mri-1.9.2
http://some-site.heroku.com/ | git@heroku.com:some-site.git
Git remote heroku added

Para fazer o deploy, execute o comando git push heroku.

$ git push heroku 
Counting objects: 7, done.
Delta compression using up to 2 threads.
Compressing objects: 100% (5/5), done.
Writing objects: 100% (7/7), 768 bytes, done.
Total 7 (delta 0), reused 0 (delta 0)
 
-----> Heroku receiving push
-----> Ruby/Rack app detected
-----> Gemfile detected, running Bundler version 1.0.7
       Unresolved dependencies detected; Installing...
       Using --without development:test
       Fetching source index for http://rubygems.org/
       Installing rack (1.3.5) 
       Using bundler (1.0.7) 
       Your bundle is complete! It was installed into ./.bundle/gems/
-----> Compiled slug size is 152K
-----> Launching... done, v3
       http://some-site.heroku.com deployed to Heroku
 
To git@heroku.com:some-site.git
 * [new branch]      HEAD -> master

Certifique-se que está tudo funcionando. Basta acessar a URL exibida após o deploy que, neste caso, é http://some-site.heroku.com.

Obviamente, usar esta URL não é nada profissional. Você pode configurar seu próprio domínio, sem gastar nada (se não me engano, você precisa adicionar o seu cartão de crédito, mesmo sendo funcionalidades gratuitas). Adicione a extensão "Custom Domains".

$ heroku addons:add custom_domains:basic
-----> Adding custom_domains:basic to some-site... done, (free)

Adicione também a extensão "Zerigo DNS".

$ heroku addons:add zerigo_dns:basic
-----> Adding zerigo_dns:basic to some-site... done, (free)

Finalmente, você pode adicionar seu domínio com o comando heroku domains:add <seu domínio>.

$ heroku domains:add somesite.com
Added somesite.com as a custom domain name for some-site

Você precisará adicionar o registro de DNS que irá redirecionar www.somesite.com para somesite.com no site da Zerigo. Para acessar este painel de controle, execute o comando heroku addons:open zerigo_dns:basic.

$ heroku addons:open zerigo_dns:basic
Opening zerigo_dns:basic for some-site...

Clique no botão "Configure".

Painel do Zerigo DNS no Heroku

Você será redirecionado para uma tela como esta:

Zerigo DNS

Clique no link "Host > Add" para adicionar um novo registro. No campo "Host", digite "www", defina o tipo do registro como sendo "Redirect" e, por último, digite a URL de destino no campo "Data".

Zerigo DNS - Adicionando redirecionamento

O Zerigo DNS funciona bem para poucos acessos, mas você pode rapidamente ultrapassar o limite do plano básico. Neste caso, sugiro que dê uma olhada no serviço oferecido pela DNSimple, que custa apenas US$3 para 10 domínios e é extremamente simples de configurar; existe até uma opção de configuração com apenas um clique para aplicativos hospedados no Heroku.

Comentários #

#1 Luis Cipriani disse:
28 Dez 11, 03:04PM

Outra alternativa é usar o github pages também (http://pages.github.com/)

#2 Henriquegeek disse:
28 Dez 11, 04:19PM

Muito legal o post, hj eu uso o iwantmyname para fazer tudo para mim alem de registrar meus dominios .com

http://iwantmyname.com/services/developer/heroku-cloud-hosting-custom-domain

#3 Nando Vieira disse:
28 Dez 11, 05:00PM

Para usar o Github Pages com seu próprio domínio é preciso ter uma conta paga. :/

#4 Nando Vieira disse:
28 Dez 11, 05:01PM

Para usar o Github Pages com seu próprio domínio é preciso ter uma conta paga. :/

#5 Nando Vieira disse:
28 Dez 11, 05:01PM

Legal! Não conhecia! :)

#6 Valério Farias disse:
02 Jan 12, 07:21PM

Tudo bem Nando Vieira.
Se possível, configure seu RSS para mostrar o post completo.
Tentei acessar o RSS do seu site pelo smartphone e consigo ler o parágrafo do post. Depois clico no link que vai para a página e aí a usabilidade cai bastante. Tenho que diminuir o tamanho da fonte. Tento clicar o lik sair do anuncio javascript que aparece mostrando o curso howtocode. Enfim acabei desistindo de acessar pelo celular.

Sei que você tem suas pretensões com esse modelo, por isso só estou perguntando se é possível.

Grande abraço.

#7 Leonardo Faria disse:
01 Abr 12, 02:53PM

Para usar o custom domains de fato é necessário validar a conta com um cartão de crédito

Deixe um comentário





Não é aceito código HTML: adicione-o no pastie.org ou paste.milk-it.net e poste apenas o link.

Se este é seu primeiro comentário, ele terá que ser aprovado antes de ser exibido.

jQuery: Dominando o framework

Você quer aprender a usar jQuery de verdade? Então chegou a hora! Neste workshop você verá como funciona este framework de JavaScript, entendendo todos os aspectos que fazem do jQuery uma das melhores ferramentas para desenvolvimento de interfaces.

Saiba mais Fechar

Conheça também o HOWTO