Lesson 20: Project - Website for a Purpose

Your teams have been working hard for these past few lessons, so we're going to take a bit of time to celebrate. You have five minutes to think of a great cheer for your team.

Share: Give students some time to come up with a cheer for themselves, then allow them to share with the class if they'd like.

Depending on your classroom, you may want to alter the activity. Any activity that gets students in a good mood to persist through coding out this project will work well.

Now that we're ready to get going, it is time to begin implementing the plans that you've made.

Distribute: Return the "Prepare" project guide to groups.

Transition: Teams log onto Code Studio and begin finalizing their websites.

New Code and Previous Challenge Levels: Throughout the unit, students may have learned additional code in the challenge levels of different lessons. As students approach this project, they may want to revisit the code they learned in these levels or visit them for the first time to learn new codes to use in this project. To help guide students back to previous levels, you can use the Extra Code in Challenge Levels as a resource to quickly find where new codes were introduced in earlier challenge levels.

Debugging Strategies: As students design and implement their own project ideas, they may find themselves with new bugs that they need to untangle and you may find yourself looking at completely unfamiliar code as students look for help troubleshooting their errors. To help smooth out the debugging experience, consider the following strategies:

• Review the Teacher Guide to Debugging for some common questions and strategies to help support students in debugging their code
• Have students follow the steps in the Student Guide to Debugging and use the Bug Report Quarter-Sheets as an initial step in the debugging process. This helps students prepare and communicate their issue before asking for help.
• If students haven't seen it yet, consider showing the Debugging Video to the class to reinforce debugging best practices.

Digging Deeper: Consider supplying students with an object to talk to as part of the debugging process. This is sometimes known as Rubber Duck Debugging - you can learn more on the website https://rubberduckdebugging.com/

How Students Will Share Their HTML: Due to the functionality of Web Lab, in order to share webpages to create a completed project, students will need to do some copy and pasting of teammates' code into their own project.

This will require students to complete the following steps:

1. Click the "Share" button on their page, and give the link to teammates in a shared document, by email or however you have students collaborate and share with one another.
2. Get the "Share" link of each teammate's webpage
3. On each teammate's webpage click the "View Code" link at the bottom of the screen.
4. Copy the HTML from each teammates' page into a new webpage in their project.
5. Copy and paste the correct navigation bar onto each page.
6. Check that all of the links and images work correctly.

Students will repeat steps 3-4 to get teammate's CSS code

Rubric and Checklist: Students have two resources they can use for self-reflection and making sure they are on the right track: the rubric and the student checklist. We recommend having students use the checklist for their own self-assessment and reflection, since it may be easier to digest and understand when reviewing their own project. However, we recommend teachers use the full rubric for evaluating projects to give more accurate feedback to students. You can see examples of this with the Sample Marked Rubrics resource at the top of the lesson plan (only visible to verified teachers)

Use the project rubric attached to this lesson to assess student mastery of learning goals.

Prompt: Your team just worked really hard! Give one shout-out to each person on the team about something that they did especially well.