diff --git a/.gitignore b/.gitignore deleted file mode 100644 index 4d29575de..000000000 --- a/.gitignore +++ /dev/null @@ -1,23 +0,0 @@ -# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. - -# dependencies -/node_modules -/.pnp -.pnp.js - -# testing -/coverage - -# production -/build - -# misc -.DS_Store -.env.local -.env.development.local -.env.test.local -.env.production.local - -npm-debug.log* -yarn-debug.log* -yarn-error.log* diff --git a/public/favicon.ico b/public/favicon.ico deleted file mode 100644 index a11777cc4..000000000 Binary files a/public/favicon.ico and /dev/null differ diff --git a/public/index.html b/public/index.html index aa069f27c..2a9b5f5b9 100644 --- a/public/index.html +++ b/public/index.html @@ -1,43 +1,10 @@ - + - - - - - - - - - React App + 판다마켓 -
- diff --git a/public/logo192.png b/public/logo192.png deleted file mode 100644 index fc44b0a37..000000000 Binary files a/public/logo192.png and /dev/null differ diff --git a/public/logo512.png b/public/logo512.png deleted file mode 100644 index a4e47a654..000000000 Binary files a/public/logo512.png and /dev/null differ diff --git a/public/manifest.json b/public/manifest.json deleted file mode 100644 index 080d6c77a..000000000 --- a/public/manifest.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "short_name": "React App", - "name": "Create React App Sample", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/public/robots.txt b/public/robots.txt deleted file mode 100644 index e9e57dc4d..000000000 --- a/public/robots.txt +++ /dev/null @@ -1,3 +0,0 @@ -# https://www.robotstxt.org/robotstxt.html -User-agent: * -Disallow: diff --git a/src/App.css b/src/App.css index 74b5e0534..5902e942c 100644 --- a/src/App.css +++ b/src/App.css @@ -1,38 +1,8 @@ -.App { - text-align: center; +.product-lists { + width: 1200px; + margin: 70px auto 0; } -.App-logo { - height: 40vmin; - pointer-events: none; -} - -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } -} - -.App-header { - background-color: #282c34; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: white; -} - -.App-link { - color: #61dafb; -} - -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } +.all-product-list { + padding-top: 40px; } diff --git a/src/App.js b/src/App.js index 378457572..c599b74b2 100644 --- a/src/App.js +++ b/src/App.js @@ -1,24 +1,45 @@ -import logo from './logo.svg'; -import './App.css'; +import { useState, useEffect } from "react"; +import "./App.css"; +import Nav from "./components/Nav"; +import AllProductList from "./components/AllProductList"; + +async function getData() { + const url = "https://panda-market-api.vercel.app/products"; + const response = await fetch(url); + const result = await response.json(); + + const data = result.list.map((items) => ({ + id: items.id, + title: items.name, + description: items.description, + price: items.price, + image: items.images, + favoriteCount: items.favoriteCount, + createAt: items.createAt, + })); + + return data; +} function App() { + const [items, setItems] = useState([]); + + useEffect(() => { + async function fetchData() { + const data = await getData(); + setItems(data); + } + fetchData(); + }, []); + return ( -
-
- logo -

- Edit src/App.js and save to reload. -

- - Learn React - -
-
+ <> +