Is it possible to upload a simple html and javascript file structure to heroku?

Question

I'm trying to deploy an open source project of mine to heroku, it is by necessity very simple with just static html and javascript. But do they not support static sites? I'd rather not make it a Sinatra project if I don't plan on ever using anything but html and javascript.

~/sites/d4-site $ heroku create --stack cedar
Creating quiet-ice-4769... done, stack is cedar
http://quiet-ice-4769.herokuapp.com/ | git@heroku.com:quiet-ice-4769.git
Git remote heroku added


~/sites/d4-site $ git remote -v
heroku  git@heroku.com:quiet-ice-4769.git (fetch)
heroku  git@heroku.com:quiet-ice-4769.git (push)


~/sites/d4-site $ git push heroku master
Counting objects: 53, done.
Delta compression using up to 2 threads.
Compressing objects: 100% (49/49), done.
Writing objects: 100% (53/53), 206.08 KiB, done.
Total 53 (delta 4), reused 0 (delta 0)

-----> Heroku receiving push
-----> Removing .DS_Store files
 !     Heroku push rejected, no Cedar-supported app detected

pkanane · Answer 1 · 2014-09-29T14:00:40.417

216

A simple way is to masquerade the HTML app as a PHP App. Heroku properly identifies PHP apps.

Rename your index.html file to home.html.
Create an index.php file and include your entry html file. If your HTML entry file is named home.html as recommended, your index.php should look like:

<?php include_once("home.html"); ?>
In your command line on the machine you are pushing from, type:

git add . git commit -m 'your commit message' git push heroku master

Heroku should properly detect your app now as a php app:

-----> PHP app detected
-----> Bundling Apache version 2.2.22
-----> Bundling PHP version 5.3.10
-----> Discovering process types
       Procfile declares types -> (none)
       Default types for PHP   -> web

-----> Compiled slug size: 9.9MB
-----> Launching... done, v3
...

Mad Thanks to lemiffe for his blog post: http://www.lemiffe.com/how-to-deploy-a-static-page-to-heroku-the-easy-way/

edited Sep 29 '14 at 14:00

answered Jul 08 '13 at 16:46

pkanane

2,545
2
18
17

28

This is WAY simpler, and should be accepted as the correct answer – Glenn Bech Jan 31 '14 at 06:43
3

note: I needed to add composer.json first to get this to work. https://devcenter.heroku.com/articles/getting-started-with-php#a-hello-world-application – happygilmore Jul 02 '14 at 12:32
Really, really good. Saved me a lot of messing around with Node.js, thanks a lot! – davidkelleher Nov 05 '14 at 23:08
You may need to do a ```git init``` to get the git commands and a ```heroku create``` to get the heroku command to work – joncodo May 15 '15 at 14:07
5

To make it even simpler you can just rename the index.html to a index.php – ChairmanMeow Dec 25 '15 at 07:38
I was struggling to host a bunch of doxygen generated documentation as static html pages in rails. This is a much more direct approach than what I was trying. – arthropod Mar 11 '16 at 15:40
There is a simpler way to do it, which does not require renaming any files. I've added it as an answer below: http://stackoverflow.com/a/40051598/1533892 – Harlan T Wood Oct 14 '16 at 20:39

score 39 · Answer 2 · edited Dec 30 '16 at 22:09

39

Here is a more elegant method: Just add a file called package.json which tells Heroku to use harp as your server:

{
  "name": "my-static-site",
  "version": "1.0.0",
  "description": "This will load any static html site",
  "scripts": {
    "start": "harp server --port $PORT"
  },
  "dependencies": {
    "harp": "*"
  }
}

and then deploy to Heroku. Done!

Further information: https://harpjs.com/docs/deployment/heroku

edited Dec 30 '16 at 22:09

eebbesen

5,070
8
48
70

answered Oct 14 '16 at 20:36

Harlan T Wood

2,064
21
19

3

Of all the answers, this is the working one as of Nov 2016 – Sergio Majluf Nov 27 '16 at 04:32
2

yeah this one is quick and simple – user2431114 Dec 31 '16 at 21:20
`harp server`, for some reason, was not able to load the `less file`. Tried with the `php answer` above and that worked. Though, this solution is really simple. Thanks... – Aakash May 29 '18 at 02:23

score 13 · Accepted Answer · answered May 11 '12 at 12:36

13

You can use rack to do this:

https://devcenter.heroku.com/articles/static-sites-on-heroku

or you can use something like Octopress/Jekyll who uses sinatra.

But you need a minimum stack to serve html static content

answered May 11 '12 at 12:36

Tiago Peczenyj

4,387
2
22
35

17

The OP did not ask for a Ruby solution. – Adam Arold Mar 06 '15 at 14:45
23

Read my sentence again. – Adam Arold May 13 '15 at 16:35

score 13 · Answer 4 · edited Jul 09 '16 at 22:35

Here is what worked for me:

cd myProject 
git init
heroku create myApp 
heroku git:remote -a myApp

If the entry point is main.html, create index.php with this single line of content:

<?php include_once("main.html"); ?>

and then perform the following steps:

echo '{}' > composer.json 
git add . 
git commit -am "first commit" 
git push heroku master

Go to http://myApp.herokuapp.com/ and your app should be online now.

sbrk · Answer 5 · 2021-10-15T03:02:37.447

There's a much easier way to do it just in case anyone finds the other answers hard to follow.

Say you have your static website with the root at index.html. Now you want to deploy it to Heroku, how?

# initialise a git repo
git init

# add the files
git add -A

# commit the files
git commit -m "init commit"

# Now add two files at the root, composer.json and index.php
touch composer.json
touch index.php

# add this line to index.php, making a PHP app that simply displays index.html
<?php include_once("index.html"); ?>

# add an empty object to composer.json
{}

Now simply run git push heroku master and you're done!

score 2 · Answer 6 · answered Apr 15 '15 at 13:14

I know this might be a little old but I ended up using Vienna Gemw to deploy this, basically its a small Rack application that will let you serve everything in your public folder (css, images, js, html) with just a couple of lines of Ruby:

require 'vienna'
run Vienna

Also, for deploying this on heroku you need to create a Gemfile:

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

Then run bundle install, in case you don't have the bundle gem installed just run on your terminal:

sudo gem install bundle

And thats pretty much of it, you can have more information on: http://kmikael.com/2013/05/28/creating-static-sites-in-ruby-with-rack/

score 2 · Answer 7 · edited Jan 09 '19 at 08:51

2

Follow this steps

Step 1

Type touch composer.json index.php index.html

Step 2 in the index.php type:

<?php include_once("index.html"); ?>

and in the composer.json type {}

Step 3

git add .

git commit -m "[your message]"

git push ['yourrepo'] ['yourbranch']

edited Jan 09 '19 at 08:51

Urosh T.

3,336
5
34
42

answered Jan 09 '19 at 08:08

user4920718

1,196
1
10
13

score 2 · Answer 8 · answered Jul 03 '20 at 22:14

2020 Update:

If you get a blank page with the PHP answer mentioned here, try this - If your homepage is at index.html :

echo '<?php header( 'Location: /index.html' ) ;  ?>' > index.php
echo '{}' > composer.json

Creating a Git repo and committing after adding files :

git init
git add .
git commit -m "My site ready for deployment."

Heroku deployment -

heroku login
heroku apps:create my-static-site-example
git push heroku master

score 0 · Answer 9 · answered May 11 '12 at 12:44

0

Hmmm... one reason that heroku is rejecting the app could be that it is trying to detect asset pipeline in rails 3.1.x apps i think.

Why not create your app on the default stack Bamboo by running just

heroku create

Then all your js and css can go into public folder in rails app with asset pipeline deactivated.

answered May 11 '12 at 12:44

Hishalv

3,052
3
29
52

5

The thought of using Rails to serve up static content makes me want to hurt someone :) – Jeremy Smith May 11 '12 at 14:23
When you only have js/html/css it looks for a node.js application. It fails when it does not find it, regardless of the stack you are trying to run it with. – fresh5447 Sep 08 '14 at 21:04

score 0 · Answer 10 · answered Mar 29 '16 at 05:56

Well , whenever your Web-page's contain HTML, CSS and JavaScript , so follow just 2 steps :

1) Make one file give name as index.html (keep evreything in it) ex:script,stylesheet & body.

2) Now, change these file, copy and paste these same file but change domain to index.php

Then deploy on a Heroku.

Hence this method will help you to deploy your Web-Pages

Is it possible to upload a simple html and javascript file structure to heroku?

10 Answers10

Linked