2015-01-22

[jacobthemyth]

Etsy Recreation

Description

Create an Etsy listing page using data from the API.

Objectives

Learning Objectives

After completing this assignment, you should:

• Understand how and when to use jQuery DOM traversal and manipulation

  Performance Objectives

After completing this assignment, you should be able to:

• Install 3rd party packages with bower

  Details

  Deliverables

• A repo containing at least:
  • data.js
  • main.js
  • index.html

    Requirements

• No JSHint warnings or errors

  Normal Mode

• Choose a search term to recreate a page for. E.g. "tacos"
• Visit the URL for the Etsy API for that search term. For example, if you wanted to create a listing page about tacos, use the URL https://api.etsy.com/v2/listings/active?api_key=cdwxq4soa7q4zuavbtynj8wx&keywords=tacos&includes=Images,Shop
• Create a file named data.js and copy the JSON data from the API into it
• Using jQuery and CSS, create a pages that looks like the Etsy listing page for your search term, not including the header, footer, sidebar, etc.

  Hard Mode

• Implement the sorting dropdown.
• Pull the categories from the data to create the sidebar, with links that filter the listings.
• Register for your own Etsy developer account and use your own API key.
• Play around with adding more advanced hover effects to the images, like these.

[ATMartin]

https://github.com/ATMartin/TIY-HW-11-EtsyListings

[ATMartin]

I'm proud of the functionality but not so proud of the code here - I feel like a lot of the filtering could be much more elegant.

Thanks!