How-to : Hosting Your Static Sites On Heroku

Once i've done with migrating this blog, next task that i need to resolve is to find a good place to host it. As you might notice, i don't need anything but a simple web server will do. I can just pick any free hosting, point my domain into it and call it a day.

But that's definitely not blogging like a hacker my friend.

I was looking for something more subtle than conventional hosting. I've spent quite amount of time trying to find some good hosting. If you're looking for good free hosting with no ads, there is only one that i can recommend - serversfree.com . They're so good that almost sounds good to be truth, and they gave a lot more features than what paid hosting could offer. I did looked into few offers from local hosting in Malaysia and for 1GB storage with 1GB bandwidth, they're asking for about RM50 per year. Triple that and you'll get 2GB of storage with 10GB of bandwidth. Like that's going to happen.

I could always rent a Virtual Private Server (VPS), but that's definitely overkill just to host a bunch of static files. I don't think its an effective investment since i didn't blog that much, and there are too many things i need to think of and having to manage my vps isn't one of them.

At this point, i guess i don't really have any choices. Well, Maybe Not.

While serversfree.com works fine and ridiculously better than any local paid hosting, let me just list down few other things that kept me worried :

1. I do skeptical about free stuff.
2. I am more concern about speed and availability than point 1.
3. Above all, i don't wanna use FTP app to publish my blog.

LFTP might solve point number 3, but i don't think i wanna do it. Plus, it did not solve point number 2. Right now i'm ready to spend some fortune, but :

Giving away a dollar effectively is harder than to make a dollar. - Steve Jobs

So i took a look around again this time, and although i heard about Heroku for some time now, i didn't realize that you can use it to host your blog for free (with some exception, of course) until i read a post from some developers.

What is Heroku?

Its a cloud Platform as a Service (PaaS). In simple words possible, its an app hosting platform where you don't have to worry about managing the underlying hardware (server) and software (operating system). But you know what, let me just quote their philosophy for you :

Developer productivity is our battle cry, at the core of everything we do. Why require three steps when one will do? Why require any action at all when zero steps will do?

Paling manang. I'm buying.

Welcome to PaaS.

First thing first, sign up for Heroku account. And then, download the toolbet. Required to use Heroku.

Fire up the terminal, and type :

heroku login

You'll be asked for password and Heroku will take care of everything. Now it's time to create your app, web app or anything you would like to call it :

heroku create (app name)

Done. Since Heroku use Git for deployment, so you might wanna learn one or two things about Git.

git init /* to initialize git repository, 1 time only */
git add . /* fastest 'way' to adds a change to staging area */
git commit -m "First commit." /* commit to repository */
git push heroku master /* deploy to Heroku */

Its just simple as that. But we're not done yet. We can't view the web app yet since it did not recognize our app and won't be able to assign proper framework for it. Since Nanoc is based on Ruby and i can use Rack (A Ruby Webserver) to serve my blog, i just need to create a Gemfile and Heroku will automatically pick it up and instantly recognize it's a Ruby app.

Aside from Gemfile, Rack requires its own configuration interface. Just create config.ru and put both of them in your site's root.

Fill the Gemfile with this :

source 'https://rubygems.org'

gem 'rack-contrib'
gem 'heroku'
gem 'shotgun'
gem 'adsf'
gem 'nanoc'
gem 'kramdown'

If you know what you're doing, you don't even need all the gems.

and config.ru with this :

require 'bundler'
Bundler.setup
Bundler.require
require 'rack/contrib/try_static'

use Rack::TryStatic,
:root => "output", # static files root dir
:urls => %w[/], # match all requests
:try => ['', 'index', '/index']
run lambda { [404, {'Content-Type' => 'text/html'}, ['Not Found']]}

Now we can push our webapp alive.

git push heroku master

That will do it. Now let's view our webapp :

heroku open

But we're not done yet. Since i bought my domain for blogging, let's use it.

heroku domains:add pali7x.com

and its should appear on your Heroku's dashboard.

Now its just a matter of pointing your domain to Heroku. This might sound easy enough, but unfortunately i ended up submitting a ticket for technical support of my domain hosting because their A records won't accept duplicate domain with different IPs. I solved this problem by switching to third-party DNS. Maybe i'll switch my domain hosting as well in future.

You should be able to browse using three surfix - yourdomain.com, www.yourdomain.com and yourapp.herokuapp.com. That's good. Using rack-rewrite, we'll have that fixed and pointing to one domain.

Modify Gemfile and add this :

gem 'rack-rewrite'

and config.ru as well :

require 'rack/rewrite'

use Rack::Rewrite do
r301 %r{.*}, 'http://domain.com$&', :if => Proc.new {|rack_env|
rack_env['SERVER_NAME'] == 'www.domain.com' ||
rack_env['SERVER_NAME'].include?('herokuapp')
}
end

Add, commit, and push it. Done.

So What's Next?

As i mention early of this post, it's free to host this blog on Heroku as long as you don't need to scale with the demands. Heroku's pricing is based on resources you use and they have nice calculator to calculate estimated monthly cost for you. However, even with their free plan i found it's more than adequate to serve few static files with moderate visitors.

Still, it might not everyone cup of tea, but if you can embrace it, i am pretty certain it could save you a lot of money. Now, i need a bucket to host all my images. And perhaps, i could spend some time to optimize this blog as well.

Posted August 20, 2013

Tweet this