Hospedando sites estáticos no Heroku

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 middleware Rack::Static. Caso uma página não seja encontrada, iremos retornar o status 404. Para referenciar os arquivos disponíveis dentro do diretório public, basta usar algo como /style.css ou /script.js. Se existirem diretórios, basta fazer algo como /styles/main.css.

app = Rack::Builder.new do
  use Rack::Static, urls: [""], root: "public", index: "index.html"
  run proc {|env| [404, {"Content-Type" => "text/html"}, ["Page not found"]] }
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 "https://rubygems.org"
gem "rack"
gem "puma"

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

Agora, vamos criar o arquivo Procfile, responsável por gerenciar os processos no Heroku.

web: bundle exec puma -p $PORT -e $RACK_ENV config.ru

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 create <seu-app>.

$ heroku apps:create some-site
Creating some-site... done, stack is cedar-14
https://some-site.herokuapp.com/ | https://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: 13, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (11/11), done.
Writing objects: 100% (13/13), 1.47 KiB | 0 bytes/s, done.
Total 13 (delta 2), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Ruby app detected
remote: -----> Compiling Ruby/Rack
remote: -----> Using Ruby version: ruby-2.3.0
remote: -----> Installing dependencies using bundler 1.9.7
remote:        Running: bundle install --without development:test --path vendor/bundle --binstubs vendor/bundle/bin -j4 --deployment
remote:        Fetching gem metadata from https://rubygems.org/..........
remote:        Fetching version metadata from https://rubygems.org/..
remote:        Using bundler 1.9.7
remote:        Installing rack 1.6.4
remote:        Installing puma 2.15.3
remote:        Bundle complete! 2 Gemfile dependencies, 3 gems now installed.
remote:        Gems in the groups development and test were not installed.
remote:        Bundled gems are installed into ./vendor/bundle.
remote:        Bundle completed (2.43s)
remote:        Cleaning up the bundler cache.
remote:
remote: -----> Discovering process types
remote:        Procfile declares types     -> web
remote:        Default types for buildpack -> console, rake
remote:
remote: -----> Compressing... done, 18.1MB
remote: -----> Launching... done, v4
remote:        https://some-site.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/some-site.git
 * [new branch]      master -> 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”.

Você será redirecionado para uma tela como esta:

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”.

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.