Create your own Google Chrome App using JSON

In this article I will explain how to create your own custom chrome app and upload to Google Chrome Web Store. We are creating this app using JSON data, and using Google chrome extension we can compress it to a extension pack. You need a notepad or any text editor and Google Chrome browser installed in your machine.

JSON (an acronym for JavaScript Object Notation) is a lightweight text-based open standard designed for human-readable data interchange. t is derived from the JavaScript scripting language for representing simple data structures and associative arrays, called objects. Despite its relationship to JavaScript, it is language-independent, with parsers available for many languages.

 So, let’s get started

1. Create a folder called Chrome Addon, all of the files must be included in this folder.
2. Create and place your app icon.png inside the folder. You should always provide a 128×128 icon, you can use png,gif and jpg files for icon.
3. Create a file and save it as manifest.json. The JSON object will contain the details for your Chrome App (Extension) like below. Copy and paste below:
   {
//name - name of your application
"name": "My personal Website",
//description - description of your application
"description": "Demo and example how to create a Chrome App extension",
//version - of you APP
"version": "1.0",
//manifest version (No need to change)
"manifest_version": 2,
//Image of your app. Image should be 128 X 128 px
"icons": {
"128": "icon.png"
},"app": {
"urls": [
//URL of your website/Blog etc..
"http://www.panayiotisgeorgiou.net/"
],
"launch": {
//URL of my website etc..This URL will open once the user clik on the icon
"web_url": "http://www.panayiotisgeorgiou.net/"
}
},
"permissions": [
"unlimitedStorage",
"notifications"
]
}
4. Open your Google Chrome. From the options open Tools–> Extensions. The new tab will open.At the top you can find the menu called Load Unpacked Extension. If not, check the Developer Mode at the top right of the window. Now you can see Load Unpacked Extension button. Click and select the directory where you have saved the above JSON file and Image of your App. Now you can see your app installed in Chrome. Open a new window and check.
5. Now we can pack the extension using Chrome to send anybody or to upload in Chrome Store. Open Extension Manager (Tools -> Extensions) and click on Load Extension. Open the Extension root directory, click Pack Extension. You can find a file with your app name having .crx extension. You can upload this Packed Extension to Chrome Store or share on internet to make you app popular.

Download the example here.

Hope that you like this article. If any doubts means send me a message below.