SungJunEun / Mini-Clothes-Shop

Displays the items of the clothes and filters out the items by its categories and colors.

Mini Clothes Shop

Simple & first CSS, HTML, JS Implementation

---

Summary

Displays the items of the clothes and filters out the items by its categories and colors.

• Practicing HTML, CSS
• Learn about Fetch API & Events in JS
• Project based on Online Course from Dream Coding

from 2021.06.28 - 30.

---

Tech

I used..

• HTML -Backbone of the web application
• CSS - Make it prettier
• Javascript - Allow me to play with web
• Replit

with Github.

Key Features

• Display items

  • Write JSON file with the items we wnat to display
  • fetch API to access the JSON data
  • createHTMLstring function to modify JSON body into HTML format

  

• Filtering items

  • addEventListner method to set up a function when the buttons are clicked
  • onButtonClick funciton & filter method to filter items
  • Show new items with 1. Display items

  

Architecture