In the beginning I was skeptical about the use of AI either to write articles or in coding. Because whenever I used AI to create articles, it felt like just paraphrasing the existing articles on the web.

So the use of generative AI for me was limited to summarizing and quick research.

But one day I saw a video about the success story of Chrome Web Extension and developers earning millions.

The idea felt so compelling that I wanted to try making one.
And when I researched, I found out that Chrome Web Extensions are built using JavaScript but I was not so good at it.

So I learned the basics of JavaScript and also the anatomy (file and folder structure) of Chrome Web Extensions.

Since I just wanted to validate the idea of creating an extension and publishing it on the official Chrome Webstore, I planned to use AI tools to create it.

So I wrote my first prompt (instruction) on Gemini (AI by Google) and it wrote the code, but when I tried it, it didn’t work. I tried multiple variations but none worked. So I took a rest for a couple of days without writing a code for the extension.

Simply, I wanted to create an extension which would display the list of upcoming 5 festivals with the remaining number of days. First one should be in larger font size and the remaining on smaller font size.

After a couple of days, I wanted to give it a last chance and wrote the prompt.
And the Gemini generated the code which when I tried worked. Then I published it on the Chrome Web Store and it’s called “Nepali Festivals Tracker”. You can try it.

Using AI to Write Code

To create this “Festivals Tracker” chrome extension I’ve used Gemini by Google which is free and accessible to anyone.
And here’s how I used it to create a working Chrome Extension in a few minutes.

But if you’re new to creating chrome extensions, JavaScript and HTML/CSS, then I first recommend you watch a few videos on them. Especially understanding the file and folder structure to create a Chrome Extension.

Now I assume you are familiar with HTML/CSS, JavaScript and Chrome Web Extension Development.

The Prompt

Here’s the prompt I gave to gemini in order to make the Chrome Web Extension.

Generated Code

As per the file structure of Chrome Web Extension, it generated following codes.

1. Manifest File (manifest.json)
This file defines the basic structure and permissions for the extension.

2. Popup HTML (popup.html)
This HTML file will display the festival information.

3. Popup JavaScript (popup.js)
This JavaScript file will handle the logic for tracking festivals.

4. Background Script (background.js)
This script runs in the background and can handle tasks like periodically checking for updates.
Since my extension was simple, it did not need to run in the background.

Testing Locally

Once the code is generated you can test it locally to check whether it works or not. To do that you need to open your Chrome Web Browser on your computer and enable “Developer Mode”, then upload a folder including all the code files.

You can follow the instructions below

1. Create a new folder for the Chrome Extension.
2. Place all the files (manifest.json, popup.html, popup.js, & background.js) in that folder.
3. Load the extension into Chrome by going to chrome://extensions/, enabling “Developer Mode”, and clicking “Load unpacked”.

After testing, I found out that the extension was working as I wanted, so in the next step I tried to make it more beautiful by adding some CSS (Like any other web app) on it.
And of course I asked Gemini to do it as I wanted this project to be done by AI and test its capabilities. To my surprise, it added CSS and made the UI modern and beautiful. Here’s the final design after I added a few tweaks on it.

After I was satisfied with the design of the extension, I wanted to take it further and check whether it can be published on the official Chrome Web Store or not.

So I created a Chrome Developer account by paying a $5 one time fee and submitted it to the Store.

And in a couple of hours it was accepted and now it’s available on the Official Chrome Web Store for anyone to try it for FREE.

Now Create Your Own

There are hundreds of tribes or groups with their own unique festivals where may not be listed on the official National Calendar.

And the apps (extensions) like these can be helpful to share awareness to people all around the world or simply to track your festival when you’re away from home.

The festival might not be important to everyone but for the minorities, it’s their identity.

And apps/extensions like Festivals Tracker can be a step towards conservation of the identity (Culture, Tradition and Festivals).

So, I’ve shared all the information and also proved that it’s possible, now it’s your turn to try and make something useful with AI.

But if you just want the source code and publish your own extension, then CLICK HERE
(Discount for the month of January. Code - 3525C)

At last, I’ve felt that AI can be an assistant that you never thought you needed.

If you can give a clear prompt (instructions), it can help you to complete any tasks quicker. It can be useful either to generate ideas, research and create MVP as fast as possible.

So, Be good at prompting and AI will be the best assistant you can have.