---
title: "How to Build a Chrome Extension"
url: https://daily.dev/posts/how-to-build-a-chrome-extension-uycgwnbh
source_url: https://blog.sunilaleti.dev/chromeextension
type: article
source: "Hashnode"
published: 2020-10-30T23:28:45.234Z
updated: 2022-10-09T11:01:44.307Z
tags: ["webdev", "google-chrome"]
reading_time: 4
upvotes: 13
comments: 5
language: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# How to Build a Chrome Extension

**[Hashnode](https://daily.dev/sources/hashnode)** · 4 min read · 13 upvotes · 5 comments

## Summary

Chrome extensions are small HTML, CSS and JavaScript apps that we can install in the chrome browser. In this tutorial, we are going to build an extension that allows users to get covid19 case details based on the country selected.Step 1: Create a new directory "dist" and create files under that directory as shown in the picture.Step 2: Create an HTML file and a js file to handle API calls.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://blog.sunilaleti.dev/chromeextension>

## Community discussion

Top comments from developers on daily.dev.

**@kmhmubin** · 3 upvotes

> Easy to understand and very well explained

**@renis** · 1 upvotes

> Bueno, anteriormente tambien hice una extencion.. Pero tuve que buscar bastaaaante para encontrar algun tutorial bueno.. XD
>
> Buen material.. Sencillo de comprender.. ^^

**@dev4s** · 1 upvotes

> Nice and fast article on how to make first Chrome extension.

## Similar posts on daily.dev

- [Don’t just attend KubeCon \+ CloudNativeCon, Merge Forward your experience\!](https://daily.dev/posts/don-t-just-attend-kubecon-cloudnativecon-merge-forward-your-experience--l0rpp73x8) · CNCF · 0 upvotes · 0 comments
- [Announcing H2 2026 KCDs](https://daily.dev/posts/announcing-h2-2026-kcds-m96goajm1) · CNCF · 1 upvotes · 0 comments
- [Two months of Open Community Groups](https://daily.dev/posts/two-months-of-open-community-groups-asf52zhbs) · CNCF · 0 upvotes · 0 comments
- [CNCF Unveils Schedule for KubeCon \+ CloudNativeCon Europe 2026](https://daily.dev/posts/cncf-unveils-schedule-for-kubecon-cloudnativecon-europe-2026-ikhcoa5cb) · CNCF · 2 upvotes · 0 comments
- [CNCF Debuts KubeCon \+ CloudNativeCon Japan 2026 Schedule](https://daily.dev/posts/cncf-debuts-kubecon-cloudnativecon-japan-2026-schedule-xp5pyudub) · CNCF · 1 upvotes · 0 comments

---

Tags: [#webdev](https://daily.dev/tags/webdev), [#google-chrome](https://daily.dev/tags/google-chrome)

[View this post on daily.dev](https://daily.dev/posts/how-to-build-a-chrome-extension-uycgwnbh)