How to rock your Hello World!

Mat Davis
2 min readAug 13, 2017

--

HTML popup from clicking the extension’s icon.

Fresh out of Op Spark bootcamp, the first thing I set my 4 eyes on was persisting HTML, JS, and CSS on already created websites. I figured being persistent with this persistence would allow me to get more familiar with the Holy 3 because even now, I don’t feel anywhere near familiar enough with these 3 beautiful languages but I do smell their potential. Their potential smells like fresh bread baking or eating fresh cookies after waiting or like waking up to the smell of bacon. I decided my Sous-Chef for all these potential dishes would be CHROME EXTENSIONS.

Here’s how to install your 1st “Hello, it’s (type name here) World!” extension in Chrome.

IMMEDIATE INSTALL
To install the finished app:
1. Go to this box.com link and download the Hello_World_CX.crx file
2. Go to Chrome://extensions
3. Drag and Drop the .crx file on to the Chrome://extensions page

COMPLETED PROJECT FILES
To access and use the completed project files:
1. Create a folder on your desktop called “Hello”
2. Go to this box.com link
3. Download the 4 files then move them to the “Hello” folder from Step# 1.
4. Open Chrome, go to Chrome://extensions, and click developer mode
5. Click Load Unpacked Extension
6. Click browse to select the “Hello” folder on your desktop

CUSTOM CODE
If you want to customize the code:
1. Edit the “hello.html” and the “hello.js” files
2. Refresh the Chrome://extension page
3. Test out your custom code!

NEXT TIME…
we will go into detail on how the app was created from scratch.
Until then, feel free to view, copy and edit the source files provided from the box.com links above.

--

--

Mat Davis

Self taught VBA Coder, Opspark Bootcamp taught Javascript Coder, Creative, innovative imaginator, born to discover my damn self thru my damn self and others.