Build a Full-Stack Chrome Extension with NodeJS and MongoDB

6h 15m 12s
English
Paid

Course description

In this course, we'll be developing a new Full-Stack Chrome Extension that Scrapes Amazon, and automatically saves Product Data within a MongoDB Database. Our finished product (which you'll be able to publish to the Chrome Store) will be a Chrome Extension that enables any user to Scrape their own Amazon Purchase History, the results of any Amazon Search URL, or the results of multiple Amazon Search Keywords - one after the next.

Read more about the course

*Code Samples Included All Along Your Path To Mastering Chrome Extension Development*

The Technology Stack you'll be dealing with in this course:

- Chrome Extension

- AngularJS (for the Chrome Extension Popup)

- jQuery *(for interacting with the Amazon DOM)

- NodeJS Server

- Mongo Database

The Functionality For the Chrome Extension:

  1. Signup and Login via the Popup View

  2. Select Elements From The DOM with the Content.js Page

  3. Scrape Your Own Amazon Purchase History

  4. Scrape Amazon Search Results of a Given Page

  5. Scrape Amazon Search Results of Multiple Keywords (one after the next automatically)

  6. Save The Amazon Product Title

  7. Save The Amazon Product Description

  8. Save The Amazon Product Image

  9. Save The Amazon Product Reviews

  10. Save The Product Rating

  11. Save The Amount of Ratings of a Given Product

  12. Make The Chrome Extension Automatically Navigate Through All Pages of Search Results

While developing this awesome sample project, you'll learn:

a) How To Scrape Any Data From The Web Programatically via the Power of Chrome Extensions

b) The Manifest.json File

c) The Popup.js File

c) The Background.js File

d) The Content.js File

e) How To Debug Your Chrome Extension

Getting the architecture of your Chrome Extension right is super crucial to keeping your code clean and structured! We'll be covering lots of considerations when building a Full-Stack Chrome Extension.

I built this course because all of the other Chrome Extension courses on Udemy don't go quite as deep (compare the Amount of Hours this course provides relative to the competitors), and because Chrome Extensions are like the surf-suit for websurfers - users can take them with them anywhere they go on the web.

If you're excited about the Awesome Power of Chrome Extensions and Web Scraping, then I hope you get a lot out of this course.

The Architecture is meant to be re-usable no matter what type of Chrome Extension / Web Scraper you'd like to build, so feel to reach out if you need help taking the codebase in your own direction, or if you have any questions along the way.

Watch Online

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 52 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing

Watch Online Build a Full-Stack Chrome Extension with NodeJS and MongoDB

0:00
/
#1: About The Course

All Course Lessons (52)

#Lesson TitleDurationAccess
1
About The Course Demo
02:55
2
Why Web Automation?
04:35
3
War Stories From Scraping The Web
02:28
4
My Latest App
03:04
5
Why Make / Take This Course?
03:38
6
Project Tutorial with Screenshots
08:57
7
High-Level Project Architecture
14:37
8
Setting up the Manifest.json - your App HQ
09:38
9
Setting Up the Popup
02:45
10
Adding AngularJS and Angular UI Router within the Popup HTML
06:28
11
Adding Bootswatch and Custom Styling in Popup
03:33
12
Setting up Angular UI-Router and our Home View
09:00
13
Setting Up Your NodeJS Server
14:28
14
Setting up Background.js with jQuery
09:22
15
Chatting Between Background.js and Server
07:20
16
Setting Up the Login view and Main Controller in the Popup
07:56
17
Setting Up a Mongo Database with mLab
07:52
18
UPDATE: MongoDB with Atlas: PART 1
05:45
19
UPDATE: MongoDB with Atlas: PART 2
02:23
20
Logging the Form Data in the Controller
04:25
21
Authentication Game Plan - Understanding How The Pieces Fit (Architecture Recap)
04:37
22
Setting Up Signup View and Connecting to UI-Router
04:21
23
Passing Signup Form Data from Popup to Background
08:20
24
Setting Up Authentication Logic on Background and Server
12:20
25
Successfully Creating User and Trying to Login
13:54
26
Successfully Logging In and Sending Server Response back to the Popup
09:59
27
Redirecting Logged-In User to the Welcome View
09:07
28
Saving User Token in LocalStorage
05:38
29
NodeJS Middleware
08:44
30
High-Level Architecture of Saving Product Data
02:37
31
Setting Up the Product API
09:01
32
Grab Purchase Years
07:55
33
Passing Purchase Years to Background Script
09:06
34
Handling Purchase Years Array within Background Script
08:12
35
Sending orderDetails from Content to Background
07:55
36
Successfully Saving Product and Page Records
08:29
37
Successfully saving more than 1 product on a given page
08:03
38
Logic of Navigating to the Next Page
15:02
39
Helper Functions to Select Data and From the DOM and URL
04:36
40
Section Overview - Game Plan for Saving Product Reviews and Summaries
08:13
41
Helper Functions for Fetching & Parsing Product Data
05:39
42
Handling JavaScript Race Conditions
07:53
43
Adding View in Popup to Enable Users to Fetch Their Purchase History
07:05
44
Backend API for Saving Products from Search Results
06:15
45
Content Script Code for Fetching Search Results Data
05:50
46
Grabbing Product Summaries and Reviews for Search Page Results
04:21
47
Sending Product Reviews and Search Page Data to the Server
07:25
48
Successfully Saving Products and Sending Next Steps to Content Script
06:02
49
Successfully Looping from Page to Page of Search Results
05:55
50
Setting Up Views for Scraping Search Results
06:29
51
Successfully Scraping Current Search and Multiple Search Keywords
06:56
52
New Course: How To Scale Your Chrome Extension Growth
08:04

Unlock unlimited learning

Get instant access to all 51 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Node.js Secure Coding (All 3 Node.js security training books)

Node.js Secure Coding (All 3 Node.js security training books)

Sources: Liran Tal
Master and apply secure programming techniques that I use every day in development with JavaScript and Node.js. In these practical...
Database Mastery: MongoDB

Database Mastery: MongoDB

Sources: jsmastery.pro, Adrian Hajdin
Enhance your backend development skills with the intensive Database Mastery: MongoDB course! This course is perfect for beginners and developers who...
11 minutes 58 seconds
Microservices with Node JS and React

Microservices with Node JS and React

Sources: udemy, Stephen Grider
Event-Based Architecture? Covered! Server side rendering with React? Yep. Scalable, production-ready code? Its here! Microservices are the number one solution for building and ...
54 hours 13 minutes 19 seconds
Serverless Framework Bootcamp: Node.js, AWS & Microservices

Serverless Framework Bootcamp: Node.js, AWS & Microservices

Sources: udemy
Ever felt like you would like to build a back-end application that can handle millions of users, but you were terrified by the idea of managing (or learning how
5 hours 24 minutes 21 seconds
MERN Stack - React Node from Scratch Building Social Network

MERN Stack - React Node from Scratch Building Social Network

Sources: udemy
Welcome to Become a FullStack / MERN Stack JavaScript Developer from Scratch with React, Node JS and MongoDB. In this course you will Learn React with Node JS f
20 hours 49 minutes 20 seconds