Udemy

Platform

English

Language

Web Development

Category

Build a Chrome extension like Honey

Learn how to build the next billion dollar Chrome Extension

4.75 (26 reviews)

Students

2 hours

Content

Dec 2020

Last Update
Regular Price

SKILLSHARE
SkillShare
Unlimited access to all SkillShare courses
EXCLUSIVE 30-DAY FREE TRIAL

What you will learn

How to create a chrome extension

How to connect Firebase to a chrome extension


Description

Build a Chrome Extension like Honey (Acquired for $4 Billion!)

In this course, we go through all the steps in creating a Chrome Extension.


We will be using Firebase as a database for our coupon details, users will be able to see the extension in the corner of the page and then click onto the extension to either submit or find a coupon. They can click onto a coupon to copy it to their clipboard.


You will learn how to use the Chrome Extension manifest file, connect a Firebase database into a Chrome Extension (using the chrome.runtime functions). Interact with the database along with publishing this all to the Chrome Web Store.


If you have ever wondered how a Chrome Extension is created then this is the course for you!


This course will run through Creating a Chrome Extension & Using Firebase.


Screenshots

Build a Chrome extension like Honey
Build a Chrome extension like Honey
Build a Chrome extension like Honey
Build a Chrome extension like Honey

Content

Intro Section

Welcome!

Extension First Steps

Create Firebase App & Extension Folders

Security String

Create Files needed for the Extension

Connect Extension to our Database

Setup Chrome message events

Setup Database Structure & Fetch Coupons

Rendering Data

Render coupons onto the page.

Add click event to open coupon list overlay

Design Extension

Create CSS file & populate with styling

CSS Styling File

Submit Coupons

Ensure extension appear if coupons exist for a website or not.

Display form for submitting coupons

New command to submit coupons to Database

Push coupon details to Database

Add styling to button and overlay

Updated CSS

Ready to Publish?

Copy coupon to clipboard & close overlay

How to publish Chrome Extension

Thanks for taking the course!


Related Courses

SKILLSHARE
Google Productivity: How To Accomplish More Using Google Chrome Extensions
Google Productivity: How To Accomplish More Using Google Chrome Extensions
SKILLSHARE
Chrome Extensions for Designers - Speed up your workflow with these extensions
Chrome Extensions for Designers - Speed up your workflow with these extensions
SKILLSHARE
Chrome Extensions: Beginner to Advanced
Chrome Extensions: Beginner to Advanced

2847142

Udemy ID

3/2/2020

Course created date

7/24/2020

Course Indexed date
Bot
Course Submitted by

Twitter
Telegram