In this project, let's build an App Store by applying the concepts we have learned till now.

Refer to the image below:

Design Files

Click to view

• Extra Small (Size < 576px) and Small (Size >= 576px)
• Medium (Size >= 768px), Large (Size >= 992px) and Extra Large (Size >= 1200px)

Set Up Instructions

Click to view

• Download dependencies by running npm install
• Start up the app using npm start

Components Structure

Implementation Files

Use these files to complete the implementation:

• src/components/AppStore/index.js
• src/components/AppStore/index.css
• src/components/TabItem/index.js
• src/components/TabItem/index.css
• src/components/AppItem/index.js
• src/components/AppItem/index.css

Quick Tips

Click to view

• You can use the cursor CSS property to specify the mouse cursor to be displayed when pointing over an element

    cursor: pointer;
  

  
  

• You can use the below outline CSS property for buttons and input elements to remove the highlighting when the elements are clicked

    outline: none;
  

Resources

Image URLs

• https://assets.ccbp.in/frontend/react-js/app-store/app-store-search-img.png alt should be search icon

Colors

Hex: #fff1eb

Hex: #ace0f9

Hex: #1e293b

Hex: #7b8794

Hex: #dfe2e5

Hex: #2563eb

Hex: #ffffff

Font-families

• Bree Serif