Chrome Extension Mastery: Build Full-Stack Extensions with React & Node.js

10h 3m 45s
English
Paid
Learn to build fully-fledged Chrome extensions from scratch to production! Acquire the skills to develop powerful, functional Chrome extensions using a modern technology stack and best practices. In this course, you will create an advanced extension that integrates with a standalone React interface and interacts with an API on Node.js. This is the course I wish I had when I was just starting out with Chrome extensions!

Watch Online Chrome Extension Mastery: Build Full-Stack Extensions with React & Node.js

Join premium to watch
Go to premium
# Title Duration
1 1.1. Welcome & project preview 04:36
2 1.2. Environment & tool setup 05:58
3 1.3. Using the project files 01:55
4 2.1. Creating the React app structure and installing dependencies 06:59
5 2.2. Setting up theming, routes, and context 13:43
6 3.1. Creating the Dockerfile and installing dependencies 15:29
7 3.2. Setting up base app structure 19:59
8 4.1. Creating the registration API endpoint 25:35
9 4.2. Sending emails with nodemailer 10:44
10 4.3. Communicating between the UI and API 09:24
11 4.4. Building reusable base components 19:12
12 4.5. Creating the registration UI 29:39
13 4.6. Creating the email verification API endpoint 08:18
14 4.7. Creating the email verification UI 14:44
15 4.8. Creating the login API endpoint 07:46
16 4.9. Creating the login UI 13:27
17 4.10. Validating and securing API requests 14:34
18 4.11. Persisting users on the UI 13:55
19 4.12. Creating protected routes, handling unverified accounts, and allowing logout 16:08
20 5.1. Creating the UI homepage skeleton 22:03
21 5.2. Creating the link creation API endpoint 17:38
22 5.3. Creating a link via the UI 21:48
23 5.4. Creating the API endpoint to fetch all links 04:00
24 5.5. Retrieving and displaying links in the UI 09:02
25 5.6. Creating the link update API endpoint 06:57
26 5.7. Supporting link updates in the UI 10:35
27 5.8. Creating the link deletion API endpoint 04:13
28 5.9. Deleting a link in the UI 06:42
29 6.1. Creating the TagSelector component 21:50
30 6.2. Supporting tags in the link creation API endpoint 18:25
31 6.3. Adding tags to link creation on the UI 14:17
32 6.4. Supporting tags in the link update API endpoint 06:42
33 6.5. Adding tags to link updates on the UI 04:38
34 7.1. Supporting searching and sorting on the API 03:48
35 7.2. Searching and sorting links within the UI 09:29
36 7.3. Supporting tag filtering on the API 03:04
37 7.4. Filtering links by tags on the UI 08:10
38 8.1. Installing dependencies and creating starter files 04:26
39 8.2. Configuring Webpack for the extension environment 14:20
40 8.3. Creating the extension manifest 07:59
41 9.1. Setting up the base containers 05:14
42 9.2. Injecting a React app using Content Scripts 14:10
43 9.3. Supporting extension authentication on the UI and API 05:58
44 9.4. Requiring authentication in the extension and leveraging the Storage API 12:47
45 9.5. Creating the LinkManager interface 19:54
46 9.6. Connecting the LinkManager to the API 06:42
47 9.7. Supporting tags within the LinkManager 08:00
48 9.8. Deleting saved links and improving the user experience with Context Menus 10:11
49 9.9. Creating an Options page for managing extension settings 21:59
50 10.1. Deploying the UI 05:30
51 10.2. Deploying the API 06:58
52 10.3. Preparing and publishing the Chrome Extension 10:54
53 11.1. Next steps and enhancement ideas 02:25
54 11.2. Wrap up 00:52

Similar courses to Chrome Extension Mastery: Build Full-Stack Extensions with React & Node.js

Mastering Node.js Streams with Erick Wendel

Mastering Node.js Streams with Erick WendelErick Wendel

Category: Node.js
Duration 11 hours 39 minutes 5 seconds
Full Stack Spring Boot & React

Full Stack Spring Boot & Reactamigoscode (Nelson Djalo)

Category: React.js, Spring Boot
Duration 10 hours 1 minute 23 seconds
The System Design Masterclass

The System Design MasterclassArpit Bhayani

Category: Others, Preparing for an interview
Duration 43 hours 13 minutes 49 seconds
Create a Discord Bot with Node.js

Create a Discord Bot with Node.jszerotomastery.io

Category: Node.js
Duration 2 hours 20 minutes 37 seconds
OpenSSL Training

OpenSSL TrainingPractical Networking (practicalnetworking.net)

Category: Others
Duration 1 hour 46 minutes 2 seconds
Ethical Hacking: Penetration Testing

Ethical Hacking: Penetration Testingpluralsight

Category: Others
Duration 4 hours 43 minutes 59 seconds
Redux Saga

Redux Sagapluralsight

Category: React.js, Redux
Duration 2 hours 54 minutes 54 seconds
MERN Stack From Scratch

MERN Stack From ScratchBrad Traversy

Category: React.js, Node.js, MongoDB
Duration 13 hours 32 minutes 38 seconds
Build a Shopping Cart App

Build a Shopping Cart AppReed Barger

Category: React.js, Node.js
Duration 1 hour 41 minutes 52 seconds
The Joy of React

The Joy of ReactJosh Comeau

Category: React.js, Next.js
Duration 25 hours 35 minutes 33 seconds