#01 User Story 1: List of all Art Pieces

[StephMode]

Value Proposition

As an art enthusiast

I want to see a list of all art pieces

so that I can get an overview of all art pieces.

Acceptance Criteria

[ ] All art pieces are displayed as a list [ ] Each art piece's image is displayed [ ] Each art piece's title is displayed [ ] Each art piece's artist is displayed

Tasks

• [x] Fetch all art pieces with SWR in pages/index.js
• [x] Create the component ArtPieces to render a list
• [x] ArtPieces props: pieces
• [ ] Create the component ArtPiecePreview
• [ ] ArtPiecePreview props: image, title, artist

[StephMode]

Task 1 Fetch all art pieces with SWR in pages/index.js ./pages/index.js

Completion Time: 0,5 h

• [x] install SWR hook
• [x] import SWR hook into pages/index.js
• [x] intialize SWR var
• [x] declare fn for fetch
• [x] declare if statements to handle error and isLoading cases
• [x] console.log to check fetched data

[StephMode]

Task 2 Create the component ArtPieces to render a list ./components/ArtPieces

Completion Time: 0,25 h

• [x] Create Comp folder
• [x] Create Component
• [x] Implement a ul to render in ArtPieces

[StephMode]

Task 3 ArtPieces props: pieces ./index.js ./comps/ArtPieces/index.js

• [x] 3.1. call prop "pieces" in ArtPieces
• [x] 3.2. build logic to hand down image data using the prop
• [x] 3.3 Hard-code 1 element to render several api data points as first iteration
• [x] 3.4. 🚨 FIX: LIFT FETCH UP TO APP Issue with fetch being implemented in HomePage - found out doing 3.3.
• [x] 3.5. 🚨 FIX: PASS DATA DOWN FROM APPS TO HOMEPAGE USING PROPS
• [x] 3.6. build map function to map over api for image, title and artist