form#quiz8(data-quiz='8')

  fieldset
    legend What's inefficient about the 
      q brute force
      |  method of updating all HTML pages when a fragment is updated?
    p
      label
        input(type="radio" name="q1" value="0")
        |  It may rebuild pages which don't feature the fragment and don't need to be updated
    p
      label
        input(type="radio" name="q1" value="1")
        |  It requires lots of writing to the hard drive
    p
      label
        input(type="radio" name="q1" value="2")
        |  It won't scale well

    p
      label
        input(type="radio" name="q1" value="3")
        |  All of the above

  fieldset
    legend What's a good example of a benefit of converting 
      code generate-all-html.js
      |  to a module?
    p
      label
        input(type="radio" name="q2" value="0")
        |  All the scripts should be modules because it's the modern way to write JavaScript
    p
      label
        input(type="radio" name="q2" value="1")
        |  It means we don't need to write it again inside 
        code html-update.js
        |  when a developer updates a fragment
    p
      label
        input(type="radio" name="q2" value="2")
        |  We can import the module client-side so that users of the website have the power to rebuild the site

    p
      label
        input(type="radio" name="q2" value="3")
        |  We can call it to generate the images as well

  fieldset
    legend What happens when we call 
      code html-update.js
      |  with no arguments?
    p
      label
        input(type="radio" name="q3" value="0") 
        |  The script silently fails and the background process continues
    p
      label
        input(type="radio" name="q3" value="1") 
        |  The script rebuilds all HTML files
    p
      label
        input(type="radio" name="q3" value="2") 
        |  The script returns an error message and stops all running commands

    p
      label
        input(type="radio" name="q3" value="3")
        |  All image files are rebuilt

  fieldset
    legend Why might you want to pass data to a fragment inside the tag, rather than as part of the
      code locals
      |  JSON object?
    p
      label
        input(type="radio" name="q4" value="0") 
        |  It means that if the fragment is not found, the HTML content will be displayed instead
    p
      label
        input(type="radio" name="q4" value="1") 
        |  It means that if end users have older web browsers, they will still see some content, rather than nothing
    p
      label
        input(type="radio" name="q4" value="2") 
        |  It allows us to pass multiple lines of rich HTML formatted text, rather than just a string

    p
      label
        input(type="radio" name="q4" value="3")
        |  You should not use this technique

  p
    input(type="submit" value="Submit answers")


details.shop
  summary Emoji shop
  h2.h5 Current NodeBucks™ balance:
  p.h1
    span(data-js="balance") | 0
  p Earn NodeBucks™ by answering questions correctly
  p.items(data-js="emoji-shop")


details.inventory
  summary Inventory
  h2.h5 Current NodeBucks™ balance:
  p.h1
    span(data-js="balance") | 0
  p
    button(data-js="emoji-test") Test out emojis
  p ℹ️ Click on emojis in your intentory to toggle them on and off when you complete a quiz
  p.items(data-js="inventory")

footer
  p Curious about this quiz? Why not check out the 
    a(href='https://dev.to/rossangus/nodejs-for-developers-course-chapter-0-installing-and-updating-node-2kim') free Node.js for Developers course
    |  on dev.to.

output
View Compiled

External CSS

  1. https://codepen.io/ross-angus/pen/ZEgvwwy

External JavaScript

  1. https://codepen.io/ross-angus/pen/ZEgvwwy