Musings of a computer science student
How to build a Chrome extension, Part 1: Basics
Building Chrome extensions is super-easy. I’ve already made two: ChromeMilk and Postponer. I wanted so share my method of building extensions, so I’m going to write a series of posts. This one will cover the basics on how to set up a good development environment and how to begin writing the extensions.
1. Install Chrome dev channel
The Chrome dev channel has the latest technologies and the best developing tools. Install it and use it to debug extensions.
2. Get a text editor to write the code in
If you’re really Spartan you can use regular Notepad. I use Notepad2 because it’s light but has syntax highlighting and other features. There are many available, so take your pick.
3. Learn HTML, CSS and JavaScript
Chrome extensions are made using the same techniques used to make web pages. HTML for content, CSS for presentation and JavaScript for behavior and interaction. I highly recommend the tutorials at W3Schools if you are just starting out. If you’ve been building web pages for a while, you can probably skip this step.
4. Follow the official Getting Started tutorial
Google has a very good tutorial for writing your first extension. This tutorial shows you how to build a simple extension and test in on your browser. After this, you should be ready to build your own extension!
5. Now what?
Now that you know how to build a basic Chrome extension, it’s time to let your imagination run wild! Read the extension documentation and see what you can build with it. Start small and don’t be afraid to be wrong. When your extension is ready, you can submit it to the Chrome Extensions Gallery so that everyone can use it!
I’ll be writing more posts on this, so stay tuned.
Do you have any tips for building Chrome extensions? Have your made an extension after following these steps? What other resources do you use to make extensions? Leave a comment and tell us all about it!
| Print article | This entry was posted by Juliana Peña on January 3, 2010 at 11:21 am, and is filed under Chrome, Programming. Follow any responses to this post through RSS 2.0. You can leave a response or trackback from your own site. |
Comments are closed.


about 7 months ago
I love Chrome… Thanks for the tutorial.. I've made up my mind to be good at programming…
Learning JAVA right now..
about 3 months ago
Good articel …
I want to try first!
about 3 months ago
I have a problem with step 4, when i try to upload the manifest.json (notepad-file) Google Chrome always shows a message with the text:
“Could not load extension from C:UsersLorryDesktopgooglechromeextension. Manifest-file is missing
or unreadable.”
Can you tell me a solution to my problem?
Thank You
about 3 months ago
I have a problem with step 4, when i try to upload the manifest.json (notepad-file) Google Chrome always shows a message with the text:
“Could not load extension from C:UsersLorryDesktopgooglechromeextension. Manifest-file is missing
or unreadable.”
Can you tell me a solution to my problem?
Thank You
about 2 weeks ago
What made you choose disgus over say intensedebate or echo for comment systems?