Skip Navigation
Show nav
Dev Center
  • Get Started
  • Documentation
  • Changelog
  • Search
  • Get Started
    • Node.js
    • Ruby on Rails
    • Ruby
    • Python
    • Java
    • PHP
    • Go
    • Scala
    • Clojure
    • .NET
  • Documentation
  • Changelog
  • More
    Additional Resources
    • Home
    • Elements
    • Products
    • Pricing
    • Careers
    • Help
    • Status
    • Events
    • Podcasts
    • Compliance Center
    Heroku Blog

    Heroku Blog

    Find out what's new with Heroku on our blog.

    Visit Blog
  • Log inorSign up
Hide categories

Categories

  • Heroku Architecture
    • Compute (Dynos)
      • Dyno Management
      • Dyno Concepts
      • Dyno Behavior
      • Dyno Reference
      • Dyno Troubleshooting
    • Stacks (operating system images)
    • Networking & DNS
    • Platform Policies
    • Platform Principles
  • Developer Tools
    • Command Line
    • Heroku VS Code Extension
  • Deployment
    • Deploying with Git
    • Deploying with Docker
    • Deployment Integrations
  • Continuous Delivery & Integration (Heroku Flow)
    • Continuous Integration
  • Language Support
    • Node.js
      • Working with Node.js
      • Troubleshooting Node.js Apps
      • Node.js Behavior in Heroku
    • Ruby
      • Rails Support
      • Working with Bundler
      • Working with Ruby
      • Ruby Behavior in Heroku
      • Troubleshooting Ruby Apps
    • Python
      • Working with Python
      • Background Jobs in Python
      • Python Behavior in Heroku
      • Working with Django
    • Java
      • Java Behavior in Heroku
      • Working with Java
      • Working with Maven
      • Working with Spring Boot
      • Troubleshooting Java Apps
    • PHP
      • PHP Behavior in Heroku
      • Working with PHP
    • Go
      • Go Dependency Management
    • Scala
    • Clojure
    • .NET
      • Working with .NET
  • Databases & Data Management
    • Heroku Postgres
      • Postgres Basics
      • Postgres Getting Started
      • Postgres Performance
      • Postgres Data Transfer & Preservation
      • Postgres Availability
      • Postgres Special Topics
      • Migrating to Heroku Postgres
    • Heroku Key-Value Store
    • Apache Kafka on Heroku
    • Other Data Stores
  • AI
    • Model Context Protocol
    • Vector Database
    • Working with AI
    • Heroku Inference
      • Quick Start Guides
      • Inference API
      • Inference Essentials
      • AI Models
  • Monitoring & Metrics
    • Logging
  • App Performance
  • Add-ons
    • All Add-ons
  • Collaboration
  • Security
    • App Security
    • Identities & Authentication
      • Single Sign-on (SSO)
    • Private Spaces
      • Infrastructure Networking
    • Compliance
  • Heroku Enterprise
    • Enterprise Accounts
    • Enterprise Teams
    • Heroku Connect (Salesforce sync)
      • Heroku Connect Administration
      • Heroku Connect Reference
      • Heroku Connect Troubleshooting
  • Patterns & Best Practices
  • Extending Heroku
    • Platform API
    • App Webhooks
    • Heroku Labs
    • Building Add-ons
      • Add-on Development Tasks
      • Add-on APIs
      • Add-on Guidelines & Requirements
    • Building CLI Plugins
    • Developing Buildpacks
    • Dev Center
  • Accounts & Billing
  • Troubleshooting & Support
  • Integrating with Salesforce
  • Language Support
  • Ruby
  • Working with Ruby
  • Creating Static Sites in Ruby with Rack

This article was contributed by a member of the Heroku community

Its contents might not always reflect updates to the Heroku platform.

Creating Static Sites in Ruby with Rack

English — 日本語に切り替える

Last updated December 02, 2024

Table of Contents

  • Prerequisites
  • Create directory structure
  • Specify dependencies
  • File server configuration
  • Running locally
  • Deploy to Heroku
  • Updating

This article was written by Marshall Huss and includes contributions from Lee Reilly. Lee is a toolsmith hacking on GitHub Enterprise.

Static sites are sites that don’t contain any dynamic server-side functionality or application logic. Examples include brochure sites made up completely of HTML and CSS or even interactive client-side games built in Flash that don’t interact with a server component. Though these sites only require a web-server to deliver their content to users it’s still useful to use a platform like Heroku to quickly provision and deploy to such infrastructure.

Using the Rack framework, static sites can be quickly deployed to Heroku.

Source for this article’s sample application is available on GitHub.

Prerequisites

This guide assumes you have the following:

  • A Heroku account. Signup is free and instant.
  • The Heroku CLI installed
  • Ruby and the Bundler gem installed

Create directory structure

Run the following command to create the directory structure for Rack to serve static files:

$ mkdir -p site/public/{images,js,css}
$ touch site/{config.ru,public/index.html}
$ cd site && bundle init

This will create the following directory structure:

- site
  |- config.ru
  |- Gemfile
  |- public
    |- index.html
    |- images
    |- js
    |- css

Specify dependencies

Many dynamic applications require dozens of third-party libraries and frameworks to run. Static sites, however, require very little support from other libraries. In this case only the rack gem is required. In the Gemfile file add the following:

source 'https://rubygems.org'
gem 'rack'

and run the bundle command to download and resolve the rack dependency.

$ bundle install
Using rack (1.4.1)
Your bundle is complete! Use `bundle show [gemname]` to see where a bundled gem is installed.

File server configuration

Rack must be told which files it should serve as static assets. Do this by editing the config.ru file so it contains the following:

use Rack::Static,
  :urls => ["/images", "/js", "/css"],
  :root => "public"

run lambda { |env|
  [
    200,
    {
      'Content-Type'  => 'text/html',
      'Cache-Control' => 'public, max-age=86400'
    },
    File.open('public/index.html', File::RDONLY)
  ]
}

This template assume that you place images, javascript files and css files in the images, css, and js directories, respectively, and use relative references to them in your HTML.

Running locally

To run your site locally and view any modifications before deploying to Heroku run the following command in the site directory:

$ rackup
>> Thin web server (v1.5.0 codename Knife)
>> Maximum connections set to 1024
>> Listening on 0.0.0.0:9292, CTRL+C to stop

Go to your browser and open http://localhost:9292 to see your static site loaded. As you make changes to the site you only need to reload your browser to view the changes – you don’t have to bounce the server.

Deploy to Heroku

Before deploying your site to Heroku you will need to store your code in the Git version control system which was installed for you as part of the Heroku CLI. When inside the site root directory execute the following commands:

$ git init
$ heroku create
$ git add .
$ git commit -m "Initial static site template app"

Use git to deploy to Heroku as well.

$ git push heroku master
Counting objects: 6, done.
Delta compression using up to 4 threads.
...

-----> Heroku receiving push
-----> Ruby app detected
...
-----> Launching... done, v1
       http://blazing-galaxy-997.herokuapp.com deployed to Heroku

At this point your site is deployed to Heroku and has been given an auto-generated URL. Open your site using the heroku open command:

$ heroku open
Opening blazing-galaxy-997... done

Updating

When making changes to your site, edit the necessary files locally, commit them to Git, and push to Heroku to see the changes deployed.

$ git commit -m "Update landing page"
$ git push heroku master

Keep reading

  • Working with Ruby

Feedback

Log in to submit feedback.

Using WebSockets on Heroku with Ruby Deploying a Ruby Project Generated on Windows

Information & Support

  • Getting Started
  • Documentation
  • Changelog
  • Compliance Center
  • Training & Education
  • Blog
  • Support Channels
  • Status

Language Reference

  • Node.js
  • Ruby
  • Java
  • PHP
  • Python
  • Go
  • Scala
  • Clojure
  • .NET

Other Resources

  • Careers
  • Elements
  • Products
  • Pricing
  • RSS
    • Dev Center Articles
    • Dev Center Changelog
    • Heroku Blog
    • Heroku News Blog
    • Heroku Engineering Blog
  • Twitter
    • Dev Center Articles
    • Dev Center Changelog
    • Heroku
    • Heroku Status
  • Github
  • LinkedIn
  • © 2025 Salesforce, Inc. All rights reserved. Various trademarks held by their respective owners. Salesforce Tower, 415 Mission Street, 3rd Floor, San Francisco, CA 94105, United States
  • heroku.com
  • Legal
  • Terms of Service
  • Privacy Information
  • Responsible Disclosure
  • Trust
  • Contact
  • Cookie Preferences
  • Your Privacy Choices