Week 2

Picking up where we left off

The Setup

Cattitude84 sells custom designed cat t-shirts on Etsy. He loves his Etsy store, but wants to create a website to showcase his portfolio. He tried doing it himself, but it sucked. Let's help!

Create a portfilio site for Cattitude84

  • Create project spec
  • Download images
  • Create index page
  • Style index page with Bootstrap
  • Create a single product page
  • Make product page dynamic
  • Make index page dynamic
  • Extract header and footer
  • Create about page (with navbar link)
  • Create contact page
  • Submit contact form and send email

Deploy to remote server

Related Chapters in the Book

3-5, 8, 13

Lab Time

  • Create a spec for your personal project
    • Project description
      • What are you making?
    • Sitemap
      • What pages/screens does your site/app need?
      • What does each of those pages do?
    • Data
      • What data does your site depend on?
  • Create an array of sample data
  • Create one dynamic page using sample data

Homework

Cattitude84 Project Spec

  • common elements
    • header
      • logo
      • navigation
        • contact
        • about us
    • footer
      • smaller navigation links
  • index page
    • title of website
    • thumbnails
    • title or name of shirts
    • links to product detail pages
  • product detail page
    • larger product photo
    • name of product
    • extended description
    • link to buy the product elsewhere
  • contact page
    • blurb with contact info
    • contact form
      • sends email to site owner
  • about us page
    • photo
    • blurb about site owner

Links from class