Wibbly Stuff

How to Create a Simple Chrome Web App

Shiney web apps for chrome add bit of extra functionality than just a bookmark in your browser. If you want to create a simple web app for your blog or site, then fear not, it is extremely easy. The things you need are,
  • A text editor like Notepad++
  • A high quality icon with 128x128 resolution for your app
  • Google Chrome already installed

The Manifest

First thing you need to create is a manifest.json file. Let's make a folder for your web app and place the manifest.json file in it. If you look at the manifest.json file of our blog's app, then the code would be like this,
{
"name": "Funsurf",
"description": "Tips & Tutorials, Linux, Web Designing, Mobile and More",
"version": "1.0",
"icons": {
"128": "128.png"
},
"app": {
"urls": [
"http://funsurf-blog.blogspot.com/"
],
"launch": {
"web_url": "http://funsurf-blog.blogspot.com/"
}
},
"permissions": [
"unlimitedStorage"
]
}
You can customize the above file to match your needs. Put the display name of the web app in the "name:" field, description in the "description:" field and the URL to open in the "web_url:" field. Now put the 128x128 icon in that folder and rename it to 128.png.


Now open the extensions page in Google Chrome and enter the developer mode by expanding "Developer Mode" present on the right side. To try your app first, click on "Load Unpacked Extension" and then browse and choose the root directory of the app. If you are satisfied, click on "Pack Extension" and select the folder. now you'll get your new .crx file ready.


Drag the extension into the Chrome window to install.