Final B Home Page

Overview

For this module, you will build out the home page of your site to meet the following criteria.

Objectives

At the end of this module, you should be able to...

• Create a scalable hero image with a call to action botton on top [unit4]
• Present and style information about your chosen store
• Build responsive customer reviews [unit8]

AI Assist

Use AI to generate copy

PROMPT: Describe all the great things about eating a burger haven including taste, fast service, healthy menu choices, variety.

Use AI to generate customer reviews

PROMPT I need 6 customer reviews for Burger Haven restaurant with person name, number of starts out of 5 and review text rendered as a JSON data file

Watch

• Building the Assignment
• Watch 2620_01a Video
• Watch 2620_01b Video
• Watch 2620_01c Video

Assignment Example

• View the small screen version
• View the medium screen version
• View the large screen version

Assignment Checklist

Final B Home Page (10 pts)

Main

The main tag should contain the following

• Add a scalable hero image
• Add a call-to-action button over the hero image
• At least 5 great things about your store styled with tailwind
• At least 6 Customer reviews generated from a JSON file. Each review should contain a name, review and number of stars
• Reviews are dynamically inserted onto the page using JS
• Reviews display in one column for small screens, two columns for medium and three columns for large screens
• Use a ternary operator to color the stars out of 5 stars displayed

Design Principle Requirements

Your page needs to meet these requirements

• Passes the HTML W3C HTML validator
• Passes the WAVE Accessibility test with no contrast errors
• Does not contain any Visual Tangent errors (items touching the screen edge)
• Page is responsive from 320px to 1600px
• Page does not have horizontal scrolling at any page width

Grade

In order to receive a grade for this assignment you must earn 90% of the points listed above.

• Pass
• Fail