Merge pull requests; typoe fixes

build/404.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/ajax.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/class-components.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/client-side-development.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/client-side-routing.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/code-style-guide.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/css-frameworks.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />
@@ -600,7 +600,7 @@ <h4>Linking to a CDN</h4>
 </p>
 <p>In addition to being simple, CDNs also provide a distinct speed benefit: CDNs replicate their content to machines in several regions of the world, and use dynamic Domain Name Service (DNS) resolution to steer users to the machine nearest them. So a user in Australia might download the Bootstrap CSS from a server located in Singapore, while a user in France might get the same CSS file from a server located in Ireland. This helps increase the speed that the files are downloaded.</p>
 <p>Additionally, CDNs allow a site to take advantage of <strong>browser caching</strong>: browsers will save previously downloaded versions of a file to avoid downloading it again. If multiple sites all use the CDN version of Bootstrap, then the browser only has to download that file the first time you visit one of those sites. With popular frameworks like Bootstrap, it’s highly likely that your user has already visited a site that links to Bootstrap’s CDN version, and thus the Bootstrap files are already in the user’s browser cache.</p>
-<p>Finally, CDNs allow the frameworks to be accessed <a href="https://en.wikipedia.org/wiki/Software_as_a_service">as a service</a>, meaning that developers may be able to quickly patch bugs (if the fix doesn’t break existing code) without the developer having to do anything. (This feature can also be seen as a drawback, as you need to trust the library developer not to break anything or accidentally include malicious code).</p>
+<p>Finally, CDNs allow the frameworks to be accessed <a href="https://en.wikipedia.org/wiki/Software_as_a_service">as a service</a>, meaning that framework developers may be able to quickly patch bugs (if the fix doesn’t break existing code) without the web developer (<em>i.e.</em>, the user of the framework) having to do anything. (This feature can also be seen as a drawback, as you need to trust the library developer not to break anything or accidentally include malicious code).</p>
 <p>The only real disadvantage to linking to a CDN is that it won’t work when you are offline. If you commonly do your development offline, or if you are building a web application that is meant to run offline, you’ll need to utilize a different method.</p>
 </div>
 <div id="downloading-the-source" class="section level4 unnumbered">
@@ -737,7 +737,7 @@ <h3>Responsive Design</h3>
 <ul>
 <li><p>See <a href="https://codepen.io/drstearns/pen/brKKBK">this Code Pen</a> for an example. If you slowly resize the browser, you’ll see the text “jump” to a smaller width as you pass each responsive breakpoint.</p></li>
 <li><p><code>.container</code> elements are often direct children of the <code>&lt;body&gt;</code> (e.g., <code>&lt;header&gt;</code>, <code>&lt;main&gt;</code>). However, if you want a background color or image to “full bleed” to the edges of the viewport, you can put the <code>.container</code> inside the another element that is styled with the background, as in the CodePen example.</p></li>
-<li><p>Do not put one <code>.container</code> instead of another! This will also multiple layers of padding that are almost certainly not what you expect. Similarly, because the class name <code>.container</code> is fairly generic, be careful when naming your own classes so they don’t overlap—for example, a flexbox container should probably be called something like <code>.flexbox-container</code>.</p></li>
+<li><p>Do not put one <code>.container</code> inside of another! This will add multiple layers of padding that are almost certainly not what you expect. Similarly, because the class name <code>.container</code> is fairly generic, be careful when naming your own classes so they don’t overlap—for example, a flexbox container should probably be called something like <code>.flexbox-container</code>.</p></li>
 <li><p>Bootstrap also provides an alternate <code>container-fluid</code> class that always has the same amount of padding around the content, with the content “reflowing” based on the browser size.</p></li>
 </ul>
 <p>In general, every page you style with Bootstrap will have a Container (usually a <code>.container</code>) to hold the content.</p>
@@ -765,7 +765,7 @@ <h3>The Grid</h3>
 <li>Notice that “Item 1” takes up half (6/12) of the grid, “Item 2” takes up a third (4/12), and “Item 3” takes up the remainder (2/12).</li>
 </ul>
 <p>You can also make this grid layout responsive by using responsive utility versions of the <code>col-#</code> classes. For example, a <code>.col-md-4</code> would take up 4 columns <em>only on medium or larger</em> screens, while a <code>.col-lg-6</code> would take up 6 columns <em>only on large or larger</em> screens. Note that a child of the <code>.row</code> that doesn’t have a column size will effectively act as its own row (on its own line).</p>
-<p>Finally, note that you can specify <em>multiple responsive utilities</em> on each grid item! For example, you can specify that items should take up 6 columns on small or larger screens (<code>col-6-sm</code>), only but 3 columns on medium or larger screens (<code>col-3-sm</code>):</p>
+<p>Finally, note that you can specify <em>multiple responsive utilities</em> on each grid item! For example, you can specify that items should take up 6 columns on small or larger screens (<code>col-sm-6</code>), only but 3 columns on medium or larger screens (<code>col-md-3</code>):</p>
 <pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>row<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-sm-6 col-md-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Item 1<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>
     <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>col-sm-6 col-md-3<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Item 2<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">></span></span>

build/css-in-js.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/css-layouts.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/css-options.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/css.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/dom.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/es6.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/firebase.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/functional-programming.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/html-fundamentals.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/index.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />
@@ -542,7 +542,7 @@ <h1>
 <div id="header">
 <h1 class="title">Client-Side Web Development</h1>
 <p class="author"><em><a href="http://faculty.washington.edu/joelross/">Joel Ross</a> and <a href="http://mfviz.com/#/">Mike Freeman</a></em></p>
-<p class="date"><em>January 19, 2023</em></p>
+<p class="date"><em>February 09, 2023</em></p>
 </div>
 <div id="about-the-book" class="section level1 unnumbered">
 <h1>About the Book</h1>

build/interactive-react.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/javascript-libraries.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/javascript.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/jest.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/machine-setup.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/react-native.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/react.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />
@@ -814,7 +814,7 @@ <h2><span class="header-section-number">15.3</span> React Components</h2>
 <span class="token punctuation">}</span></code></pre>
 <p>This provides some benefits in terms of scoping (because of the arrow function), but otherwise makes components even harder to read—its not as readily obviously that this is a function and a component. You should stick to defining component functions using the <code>function</code> keyword (and not arrow functions) for readability, but be aware of the alternate approach which is used in some libraries and examples.</p></li>
 </ul></li>
-<li><p>Component functions take in a single argument representing the <a href="react.html#props">props</a> (discussed below), which is conventionally named as such. As with all JavaScript functions, if you don’t want to use the argument value you can omit giving it a name (e.g., <code>function UserInfo() { ... }</code>).</p></li>
+<li><p>Component functions take in a single argument representing the <a href="react.html#props">props</a> (discussed below), which is conventionally named as such. While it’s possible to omit this argument if it isn’t used (as you can with all JavaScript functions), best practice is to always include it.</p></li>
 <li><p>A component function is a regular function like any other that you’ve written. That means that it can and often does do more than just return a single value! You can include additional code statements (variable declarations, if statements, loops, etc) in order to calculate the values you’d like to include in inline expressions in the returned JSX.</p>
 <div class="alert alert-warning">
 <strong>Style requirement</strong>: perform any complex logic—including functional looping such as with <code>map()</code> or <code>filter()</code>—outside of the <code>return</code> statement. Keep the <code>return</code> statement as simple as possible so it remains readable—and more importantly <em>debuggable</em> (so you can use things like <code>console.log</code> statements to check intermediate values before they are returned). <strong>NEVER</strong> include an inline callback function so that you have a <code>return</code> statement inside of a <code>return</code> statement!

build/redux.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/responsive-css.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/standards-and-accessibility.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />

build/webpack.html

@@ -24,7 +24,7 @@
 <meta name="author" content="Joel Ross and Mike Freeman" />
 
 
-<meta name="date" content="2023-01-19" />
+<meta name="date" content="2023-02-09" />
 
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="apple-mobile-web-app-capable" content="yes" />