thomasfshannon / etsy-search-page Goto Github PK

After completing this assignment, you should:

• Have a deep understanding of layout
• Understand how to use string interpolation
• Understand DOM Manipulation
• Demonstrate strong ability to navigate through a large block of JSON data

Re-Create An Etsy Page - https://www.etsy.com/search?q=whiskey

1. Utilize the data for whatever search term you use using the items.js file
2. Everything should be styled as closely as possible, including the navigation bar, grid of items, and footer. (IGNORE: "Recently viewed" and "Similar to recently viewed". Don't worry about getting the background of the footer. Feel free to do whatever you want.)
3. You are free to change the search term to whatever you'd like.
4. You should implement hover events and link the items to their proper Etsy product pages (items only, other links can be just linked to #)
5. No need to make any of the form elements work, just style them properly

Pro Tip, worry about the structure first, the JS second, and the fine details of the design last

Note: Use font-awesome for all the icons https://fontawesome.com/icons?d=gallery

Put this in your HTML head to import font-awesome:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />

How to incorporate an icon into your code:

<i class="fa fa-times"></i>

** MAKE SURE TO REMOVE THE s in fas or it will not work properly. **

1. Etsy API Documentation
2. Etsy Page Example