Free Hosting with Google Scripts

The Problem…

I have some projects that I work periodically and wanted to be able to host examples of on the web, but don’t want to pay for hosting (https://github.com/Will-Smelser/openProjects).

So the hosting needed the following

  • Insert my own javascript (So blogger, wordpress, etc… will not work)
  • Dynamically load content from external host (my source code on github)

The Solution…

I was playing around with google looking for a way to host content and came across Google Scripts.  The documentation can be a little bit of a mess, but after a couple hours of playing around I was able to figure out the basics.  A more detailed version of this will come later.

So for this I wanted to host my documentation for https://github.com/Will-Smelser/openProjects/tree/master/jquerySelect project.  I know I could have done this with github wiki, but this has limitation as I cannot actually insert example javascript.

Steps Taken…

1. Setup a project (http://script.google.com).

2. Create an HTML template file
Create HTML

3. Save this into the HTML template

<html>
<head></head>
<body>
<?  //dynamically load the html body
var response = UrlFetchApp.fetch(“https://raw.github.com/Will-Smelser/openProjects/master/jquerySelect/body.htm”);
output.append(response.getContentText());
?>
</body>
</html>

4. This uses the scripts API to grab the content. Then it uses the default global variable “output” to insert the loaded content.

5. Edit the Code.js and insert this content

// Script-as-app template.
function doGet() {
return HtmlService.createTemplateFromFile(‘selectbox2′).evaluate();
}

6.  Publish your project
deploy_webapp

Here is my example.

Conclusions

There are some downsides…
1.  The anchor tags dont work correctly.  I’ll look into fixing this.
2.  How I currently did this I would have to setup a template for each page.

Comments (0)

› No comments yet.

Leave a Reply

Allowed Tags - You may use these HTML tags and attributes in your comment.

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>