Create Google Contacts Clone with HTML5, CSS3, Javascript, Node.js, Express.js and MySQL | Part 4

This is part 4 of the series about How to build Fullstack Google Contacts Web App Clone by using HTML5, CSS3, SASS, Javascript, Node.js, Express.js, and MySQL.
In this part, you will learn heavy use of javascript. We implemented checkboxes on the contacts table to select one or more contacts.
We also implemented the delete single or multiple rows of contacts table through the checkbox.

Source Code:
https://bit.ly/2ZSvjSR

Chapters:
0:01 - Intro
04:39 - Add an event listener on multiple Checkboxes
13:21 - Highlight table row on contact selection
32:21 - Show and Hide the contacts table header based on selection
37:15 - Hide and show action bar of contacts table
46:24 - Design the action bar of the contacts table
50:19 - Remove the multiple contacts' DOM element selected through checkboxes
1:04:00 - Implement a delete button in every contact row to delete one contact. That button appears on hover over contacts.

This is the complete playlist of this series:
https://www.youtube.com/watch?v=cg1eaPtKHFg&list=PL2NDx92_iOAHs7Ogtl_bUkIGKXHuUoGGd

Other useful Courses:
Create WhatsApp Desktop UI Clone with Angular:
https://www.youtube.com/watch?v=b-obZ8ZloIc&list=PL2NDx92_iOAF9vKwdgC88NuMJpVCVt7oR

Todo App in Angular Material (Angular 8)
https://www.youtube.com/watch?v=FVVlSh8PwtE&list=PL2NDx92_iOAH-yLiGOkJqvG51_SGvpMGQ

Please subscribe to my youtube channel from the link below:

https://www.youtube.com/channel/UCL5nKCmpReJZZMe9_bYR89w?sub_confirmation=1

============

Blog: https://www.ayyaztech.com

The Best Hosting Company I use is Hostinger:
https://www.hostg.xyz/SH71Z

The Payment Platform I like is Payoneer:
https://bit.ly/2HbTXF2

Create Google Contacts Clone with HTML5, CSS3, Javascript, Node.js, Express.js and MySQL | Part 3

#fullstackProject #javascriptCourse #fullStackCourse