Hosting Static Web Application Resources on OpenWhisk

The tutorial Serverless Web Application and API describes how to develop serverless APIs and web applications via IBM Functions, the IBM Functions API Gateway and a No-SQL database. The static web resources are hosted via GitHub Pages. I’ve open sourced an extension to the tutorial that allows hosting web resources directly via Apache OpenWhisk.

Get the code from GitHub.

The repo contains an Apache OpenWhisk function to host static resources of web applications. The function has been implemented as Docker image so that web resources can be handled which are bigger than 48 MB.

After the deployment of the function, the web application is accessible via URLs like this one: https://service.us.apiconnect.ibmcloud.com/gws/apigateway/api/xxx/web/resources/index.html. In order to use a custom domain, check out the documentation.

The project contains a sample Angular application, but the same mechanism works for other client-side web frameworks like React and Vue.js. Simply replace the files in the docker/resources directory.

Here is a screenshot:

serverless-web

If you want to try this functionality yourself, run these commands (change the Docker image name):

$ git clone https://github.com/nheidloff/openwhisk-web-app-resources.git
$ cd openwhisk-web-app-resources
$ npm install
$ cd docker
$ docker build -t nheidloff/openwhisk-web-app:1 .
$ docker push nheidloff/openwhisk-web-app:1
$ ibmcloud login
$ ibmcloud fn action create openwhisk-web-app --docker nheidloff/openwhisk-web-app:1 --web true
$ ibmcloud fn api create -n "angular-web-app" /web /resources get openwhisk-web-app --response-type http