Sean's i/o Stream

Musings-as-a-Service

Hosting static content in Bluemix

  • February 21, 2015
  •   category: ibm
  • tags: ibm, bluemix


The goal is to provide a simple way to host static content, the current out of the box buildpacks, as of Feb 2015, do not include any BoilerPlates or build packs to select. However these buildpacks do exist1 so it is possible to Bring your Own BuildPack and use these.

Here is the really short version of how to do this, click here: Deploy to Bluemix

CloudFoundry provides a public buildpack for just this purpose github.com - static-buildpack so let’s go through a quick example of how to set this up and use it. Taking a look at the github README you see there is a very simple way to do this adhoc, if you go into a directory with your content:

cf push my-site -m 64M -b https://github.com/cloudfoundry-community/staticfile-buildpack.git

If you want to simplify the process you can add this information to a manifest.yml file and simplify your management. I’ve created a simple git repository to start with on jazzhub, so we can clone that to start with.

sgwilbur@gura:~/workspaces/tmp$ git clone https://hub.jazz.net/git/swilbur/bluemix-static-hosting
Cloning into 'bluemix-static-hosting'...
remote: Counting objects: 12, done
remote: Finding sources: 100% (12/12)
remote: Total 12 (delta 0), reused 12 (delta 0)
Unpacking objects: 100% (12/12), done.
Checking connectivity... done.
sgwilbur@gura:~/workspaces/$ cd bluemix-static-hosting
sgwilbur@gura:~/workspaces/bluemix-static-hosting$ cf api api.ng.bluemix.net
Setting api endpoint to api.ng.bluemix.net...
OK

                   
API endpoint:   https://api.ng.bluemix.net (API version: 2.19.0)   
Not logged in. Use 'cf login' to log in.
sgwilbur@gura:~/workspaces/bluemix-static-hosting$ cf login -u swilbur@us.ibm.com -o swilbur@us.ibm.com -s dev
API endpoint: https://api.ng.bluemix.net

Password> 
Authenticating...
OK

Targeted org swilbur@us.ibm.com

Targeted space dev


                   
API endpoint:   https://api.ng.bluemix.net (API version: 2.19.0)   
User:           swilbur@us.ibm.com   
Org:            swilbur@us.ibm.com   
Space:          dev   

Now that you are logged in with your organization and space set, we just need to update one more thing in our manifest.yml file to ensure multiple people can deploy this same application against the mybluemix.net domain, then we need to ensure that each application has a unique host attribute.

sgwilbur@gura:~/workspaces/bluemix-static-hosting$ vim manifest.yml 
sgwilbur@gura:~/workspaces/bluemix-static-hosting$ git diff manifest.yml 
diff --git a/manifest.yml b/manifest.yml
index 9434d8a..993f846 100644
--- a/manifest.yml
+++ b/manifest.yml
@@ -3,6 +3,6 @@
  - name: bluemix-static-hosting
    memory: 64M
    instances: 1
-   host: bluemix-static-hosting
+   host: swilbur-bluemix-static-hosting
    path: www
-   buildpack: https://github.com/cloudfoundry-incubator/staticfile-buildpack   
\ No newline at end of file
+   buildpack: https://github.com/cloudfoundry-incubator/staticfile-buildpack   
sgwilbur@gura:~/workspaces/bluemix-static-hosting$

With this change in place, we are ready to push our simple static hosted site to Bluemix.

sgwilbur@gura:~/workspaces/bluemix-static-hosting$ cf push
Using manifest file /Users/sgwilbur/workspaces/bluemix-static-hosting/manifest.yml

Updating app bluemix-static-hosting in org swilbur@us.ibm.com / space dev as swilbur@us.ibm.com...
OK

Creating route swilbur-bluemix-static-hosting.mybluemix.net...
OK

Binding swilbur-bluemix-static-hosting.mybluemix.net to bluemix-static-hosting...
OK

Uploading bluemix-static-hosting...
Uploading app files from: /Users/sgwilbur/workspaces/bluemix-static-hosting/www
Uploading 1K, 1 files
Done uploading               
OK

Stopping app bluemix-static-hosting in org swilbur@us.ibm.com / space dev as swilbur@us.ibm.com...
OK

Starting app bluemix-static-hosting in org swilbur@us.ibm.com / space dev as swilbur@us.ibm.com...
-----> Downloaded app package (4.0K)
-----> Downloaded app buildpack cache (4.0K)
Cloning into '/tmp/buildpacks/staticfile-buildpack'...
grep: Staticfile: No such file or directory
-----> Using root folder
-----> Copying project files into public/
-----> Setting up nginx
grep: Staticfile: No such file or directory
-----> Uploading droplet (3.0M)

0 of 1 instances running, 1 starting
1 of 1 instances running

App started


OK

App bluemix-static-hosting was started using this command `sh boot.sh`

Showing health and status for app bluemix-static-hosting in org swilbur@us.ibm.com / space dev as swilbur@us.ibm.com...
OK

requested state: started
instances: 1/1
usage: 64M x 1 instances
urls: bluemix-static-hosting.mybluemix.net, swilbur-bluemix-static-hosting.mybluemix.net
last uploaded: Sat Feb 21 16:14:31 +0000 2015

     state     since                    cpu    memory        disk   
#0   running   2015-02-21 10:15:16 AM   0.0%   4.6M of 64M   8M of 1G   

Now you can go ahead and access your URL and you should see something similar to this.

Simple Bluemix hosted static site

Now that we know the static hosting is working you are free to add your desired content to the www folder, this is the specific directory I chose for simplicity but you can customize this based on the contents of the manifest.yml file you use.

Check the github README for what parameters can be added to customize the behavior and have fun hosting away your static and demo sites on Bluemix!

Deploy to Bluemix

Reference:
Footnotes
Back to Top