Serving static files with Sinatra

Question

I have one page website only using HTML, CSS and JavaScript. I want to deploy the app to Heroku, but I cannot find a way to do it. I am now trying to make the app working wi

Answer 1

Sinatra should let you serve static files from the public directory as explained in the docs:

Static Files

Static files are served from the ./public directory. You can specify a different location by setting the :public option:

Note that the public directory name is not included in the URL. A file ./public/css/style.css is made available as example.com/css/style.css.

Answer 2

the sinatra-assetpack gem offers a whole bunch of features. syntax is sweet:

serve '/js', from: '/app/javascripts'

while i am still having issues with rails assets pipeline i feel like i have much more control using sinatra-assetpack - but most of the times it just works with a few lines of code.

Answer 3

require 'rubygems'
require 'sinatra'

set :public_folder, File.dirname(__FILE__) + '/../client'
#client - it's folder with all your file, including myapp.rb

get "/" do
  File.read('index.html')
end

Answer 4

UPDATED ANSWER: I tied all the above with no luck of being ablle to load css, js....etc contents the only thing that was loading is index.html... and the rest were going =>> 404 error

My solution: app folder looks like this .

index.rb ==>> Sinatra code goes .

require 'rubygems'
require 'sinatra'

get '/' do
  html :index
end

def html(view)
  File.read(File.join('public', "#{view.to_s}.html"))
end

public folder==>> contains everything else ...css , js , blah blah..etc.

user@user-SVE1411EGXB:~/sintra1$ ls
index.rb  public
user@user-SVE1411EGXB:~/sintra1$ find public/
public/
public/index.html
public/about_us.html
public/contact.html
public/fonts
public/fonts/fontawesome-webfont.svg
public/fonts/fontawesome-webfont.ttf
public/img
public/img/drink_ZIDO.jpg
public/js
public/js/bootstrap.min.js
public/js/jquery.min.js
public/js/bootstrap.js
public/carsoul2.html
public/css
public/css/font-awesome-ie7.css
public/css/bootstrap.min.css
public/css/font-awesome.min.css
public/css/bootstrap.css
public/css/font-awesome.css
public/css/style.css
user@user-SVE1411EGXB:~/sintra1$

Now start server and you will be able to navigate through static pages with no problem.

user@user-SVE1411EGXB:~/sintra1$ ruby index.rb 
== Sinatra/1.4.5 has taken the stage on 4567 for development with backup from Thin
>> Thin web server (v1.5.1 codename Straight Razor)
>> Maximum connections set to 1024
>> Listening on localhost:4567, CTRL+C to stop

Answer 5

You might consider moving the index.html file to views/index.erb, and defining an endpoint like:

get '/' do
  erb :index
end

Answer 6

http://sinatrarb.com/configuration.html#static---enabledisable-static-file-routes

This would be the correct way of doing it.

set :public_folder, 'public'

I used the static setting because it's setting can affect the public_folder usage.