,Professional
JavaScript
Fast-track your web development career using the
powerful features of advanced JavaScript
Hugo Di Francesco
Siyuan Gao
Vinicius Isola
Philip Kirkbride
,Table of Contents
Preface i
Chapter 1: JavaScript, HTML, and the DOM 1
Introduction ..................................................................................................... 2
HTML and the DOM ........................................................................................ 2
Exercise 1: Iterating over Nodes in a Document ............................................... 4
Developer Tools .............................................................................................. 6
Exercise 2: Manipulating the DOM from the Elements Tab ............................. 9
Exercise 3: Debugging Code from the Sources Tab ........................................ 12
The Console Tab .................................................................................................. 17
Activity 1: Extracting Data from a Page ............................................................ 20
Nodes and Elements ........................................................................................... 21
Exercise 4: Traversing the DOM Tree ............................................................... 24
Special Objects .................................................................................................... 29
Using JavaScript to Query the DOM .................................................................. 30
Exercise 5: Querying the DOM Using querySelector ...................................... 32
Manipulating the DOM ....................................................................................... 37
Exercise 6: Filtering and Searching Products .................................................. 42
Shadow DOM and Web Components ............................................................... 48
Exercise 7: Replacing a Search Box with a Web Component ......................... 58
Activity 2: Replacing the Tag Filter with a Web Component .......................... 61
Summary ........................................................................................................ 62
, Chapter 2: Node.js and npm 65
Introduction ................................................................................................... 66
What is Node.js? ............................................................................................ 66
Exercise 8: Running Your First Node.js Commands ........................................ 71
Node Version Manager (nvm) ..................................................................... 75
Exercise 9: Using nvm to Manage Versions ..................................................... 79
Node Package Manager (npm) .................................................................... 82
Exercise 10: Creating a Command-Line HTML Generator .............................. 87
Dependencies ...................................................................................................... 91
npm Scripts .......................................................................................................... 93
Activity 3: Creating an npm Package to Parse HTML ...................................... 97
Summary ........................................................................................................ 99
Chapter 3: Node.js APIs and Web Scraping 101
Introduction ................................................................................................. 102
Globals .......................................................................................................... 102
Exercise 11: Creating a Task Reminder Application .................................... 112
FileSystem APIs ........................................................................................... 116
Exercise 12: Searching for a File through a Directory
Using Glob Pattern ........................................................................................... 126
HTTP APIs ..................................................................................................... 130
Exercise 13: Serving Static Files ...................................................................... 134
Exercise 14: Serving Dynamic Content .......................................................... 142
What is Scraping? ........................................................................................ 148
Downloading and Parsing Web Pages ........................................................... 150
Exercise 15: Scraping Medium Articles .......................................................... 152
Activity 4: Scraping Products and Prices from Storefront .......................... 157
Summary ...................................................................................................... 159
JavaScript
Fast-track your web development career using the
powerful features of advanced JavaScript
Hugo Di Francesco
Siyuan Gao
Vinicius Isola
Philip Kirkbride
,Table of Contents
Preface i
Chapter 1: JavaScript, HTML, and the DOM 1
Introduction ..................................................................................................... 2
HTML and the DOM ........................................................................................ 2
Exercise 1: Iterating over Nodes in a Document ............................................... 4
Developer Tools .............................................................................................. 6
Exercise 2: Manipulating the DOM from the Elements Tab ............................. 9
Exercise 3: Debugging Code from the Sources Tab ........................................ 12
The Console Tab .................................................................................................. 17
Activity 1: Extracting Data from a Page ............................................................ 20
Nodes and Elements ........................................................................................... 21
Exercise 4: Traversing the DOM Tree ............................................................... 24
Special Objects .................................................................................................... 29
Using JavaScript to Query the DOM .................................................................. 30
Exercise 5: Querying the DOM Using querySelector ...................................... 32
Manipulating the DOM ....................................................................................... 37
Exercise 6: Filtering and Searching Products .................................................. 42
Shadow DOM and Web Components ............................................................... 48
Exercise 7: Replacing a Search Box with a Web Component ......................... 58
Activity 2: Replacing the Tag Filter with a Web Component .......................... 61
Summary ........................................................................................................ 62
, Chapter 2: Node.js and npm 65
Introduction ................................................................................................... 66
What is Node.js? ............................................................................................ 66
Exercise 8: Running Your First Node.js Commands ........................................ 71
Node Version Manager (nvm) ..................................................................... 75
Exercise 9: Using nvm to Manage Versions ..................................................... 79
Node Package Manager (npm) .................................................................... 82
Exercise 10: Creating a Command-Line HTML Generator .............................. 87
Dependencies ...................................................................................................... 91
npm Scripts .......................................................................................................... 93
Activity 3: Creating an npm Package to Parse HTML ...................................... 97
Summary ........................................................................................................ 99
Chapter 3: Node.js APIs and Web Scraping 101
Introduction ................................................................................................. 102
Globals .......................................................................................................... 102
Exercise 11: Creating a Task Reminder Application .................................... 112
FileSystem APIs ........................................................................................... 116
Exercise 12: Searching for a File through a Directory
Using Glob Pattern ........................................................................................... 126
HTTP APIs ..................................................................................................... 130
Exercise 13: Serving Static Files ...................................................................... 134
Exercise 14: Serving Dynamic Content .......................................................... 142
What is Scraping? ........................................................................................ 148
Downloading and Parsing Web Pages ........................................................... 150
Exercise 15: Scraping Medium Articles .......................................................... 152
Activity 4: Scraping Products and Prices from Storefront .......................... 157
Summary ...................................................................................................... 159
