Back to Setup Page

Extension Challenge

Now that we have finished our FAQ page, we will work in teams to extend our learning. You will take the FAQ page you designed and update the page to build an informative webpage for a topic of interest. To prepare for this challenge when we return from lunch, please complete this survey.

Goals

  • Update the content in the HTML
  • Update the CSS colors or fonts to change the design
  • Implement a new feature using event listeners

Update Content

In your HTML file, update the question and answer content to reflect your new topic of choice.

Update Styles

In your CSS file, change the colors to reflect the content you chose. You can also play with other CSS properties to achieve a look that you like! If you want some guidance on color combinations, coolors.co is a great tool. This article from canva also has color combinations that work well together.

Implement A New Feature

In your JavaScript file, try to add another feature.

  • Can you show the answer section on hover instead of on click?
  • Can you use another event listener to change something else on your page?
  • How would you change your app to be a true or false mini-quiz instead of FAQ?

Presentations

When we return to the main room, one person from each group will share what they built, including:

  • The topic
  • A challenge you encountered while completing the project
  • A win you experienced during the work time

Congratulations on your hard work today! We covered a lot of information and now you have an awesome web page to share with friends and family. Maybe you even discovered a hidden talent for coding today! 😉

Wrap Up