-
Notifications
You must be signed in to change notification settings - Fork 24
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[배진한] Sprint6 #106
The head ref may contain hidden characters: "react-\uBC30\uC9C4\uD55C-sprint6"
[배진한] Sprint6 #106
Changes from all commits
b18bea8
1158054
60663f2
d5edfb1
cdaa889
e640883
dc93760
8abd02f
d0a5435
e529c9b
aba7054
613f1e4
ae1e1f3
cfb9281
fef668b
69d3100
c3e1cf4
4a21f72
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
{ | ||
"name": "sprint5", | ||
"version": "0.1.0", | ||
"private": true, | ||
"dependencies": { | ||
"@testing-library/jest-dom": "^5.17.0", | ||
"@testing-library/react": "^13.4.0", | ||
"@testing-library/user-event": "^13.5.0", | ||
"axios": "^1.7.7", | ||
"react": "^18.3.1", | ||
"react-dom": "^18.3.1", | ||
"react-router-dom": "^6.27.0", | ||
"react-scripts": "5.0.1", | ||
"web-vitals": "^2.1.4" | ||
}, | ||
"scripts": { | ||
"start": "react-scripts start", | ||
"build": "react-scripts build", | ||
"test": "react-scripts test", | ||
"eject": "react-scripts eject" | ||
}, | ||
"eslintConfig": { | ||
"extends": [ | ||
"react-app", | ||
"react-app/jest" | ||
] | ||
}, | ||
"browserslist": { | ||
"production": [ | ||
">0.2%", | ||
"not dead", | ||
"not op_mini all" | ||
], | ||
"development": [ | ||
"last 1 chrome version", | ||
"last 1 firefox version", | ||
"last 1 safari version" | ||
] | ||
} | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
<!DOCTYPE html> | ||
<html lang="ko"> | ||
|
||
<head> | ||
<meta charset="utf-8" /> | ||
<link rel="icon" href="../src/img/icons/favicon.ico" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
<title>중고마켓</title> | ||
</head> | ||
|
||
<body> | ||
<div id="root" class="dk"></div> | ||
</body> | ||
|
||
</html> |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
{ | ||
"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" | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
# https://www.robotstxt.org/robotstxt.html | ||
User-agent: * | ||
Disallow: |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
import { BrowserRouter, Route, Routes } from 'react-router-dom'; | ||
import ItemsPage from './pages/ItemsPage/index.jsx'; | ||
import HomePage from './pages/HomePage/index.jsx'; | ||
import LoginPage from './pages/LoginPage/index.jsx'; | ||
import RegisterItemPage from './pages/RegisterItemPage/index.jsx'; | ||
import ItemDetailPage from './pages/ItemDetailPage/index.jsx'; | ||
|
||
function App() { | ||
return ( | ||
<BrowserRouter > | ||
<Routes> | ||
<Route path='/' element={<HomePage />} /> | ||
<Route path='/items' element={<ItemsPage />} /> | ||
<Route path='/login' element={<LoginPage />} /> | ||
<Route path='/register' element={<RegisterItemPage />} /> | ||
<Route path='/itemDetail' element={<ItemDetailPage />} /> | ||
{/* <Route path='/community' element={<CommunityFeedPage />} /> */} | ||
</Routes> | ||
</BrowserRouter> | ||
); | ||
} | ||
|
||
export default App; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
export const url = new URL('https://panda-market-api.vercel.app/products'); | ||
// export const url = new URL('http://localhost:8000/products'); | ||
export const postUrl = 'http://localhost:8000/products'; | ||
orlein marked this conversation as resolved.
Show resolved
Hide resolved
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
import { url } from './endpoint.js'; | ||
|
||
async function getProducts(params = "") { | ||
const query = new URLSearchParams(params).toString(); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
설명이 상당히 어려워보이지만, 간단합니다. 그저 sprint6/src/pages/ItemsPage/index.jsx의 PRODS_LIST는 string입니다. 물론, string이 query로 파싱 가능한 형태이기 때문에 잘 동작은 합니다만, 그렇다면 jsdoc으로 예제를 몇개 달아두는것도 좋습니다. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. params가 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 네 일단 차선책으로 수정 해 놓겠습니다! |
||
// 파라미터를 자동으로 정리해서 인코딩 | ||
|
||
try { | ||
const response = await fetch(`${url}?${query}`); | ||
const data = await response.json(); | ||
return data | ||
} catch (err) { | ||
console.error('Fetch error:', err); | ||
} | ||
} | ||
|
||
export default getProducts; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import axios from 'axios'; | ||
import { postUrl } from './endpoint.js'; | ||
|
||
const postProduct = async (surveyData) => { | ||
if (typeof surveyData === 'object') { | ||
const res = await axios.post(postUrl, surveyData); | ||
return res.data; | ||
} else { | ||
console.error('Post error:'); | ||
return; | ||
} | ||
} | ||
|
||
export default postProduct; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,81 @@ | ||
footer { | ||
width: 100%; | ||
height: 16rem; | ||
background-color: #111827; | ||
display: flex; | ||
justify-content: center; | ||
padding-top: 3.2rem; | ||
} | ||
|
||
#footerContent { | ||
width: 152rem; | ||
height: 2rem; | ||
display: flex; | ||
justify-content: space-between; | ||
margin-left: 20rem; | ||
margin-right: 20rem; | ||
} | ||
|
||
#copyright { | ||
width: 12.2rem; | ||
height: 1.9rem; | ||
font-size: 1.6rem; | ||
font-weight: 400; | ||
line-height: 1.909rem; | ||
display: flex; | ||
text-align: center; | ||
color: #9CA3AF; | ||
} | ||
|
||
#info { | ||
width: 16.9rem; | ||
height: 1.9rem; | ||
gap: 3rem; | ||
opacity: 0rem; | ||
font-size: 1.6rem; | ||
font-weight: 400; | ||
line-height: 1.909rem; | ||
text-align: center; | ||
color: #E5E7EB; | ||
display: flex; | ||
justify-content: space-between; | ||
} | ||
|
||
#info a { | ||
text-decoration: none; | ||
color: #E5E7EB; | ||
} | ||
Comment on lines
+10
to
+47
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. css에 id를 쓰셔야만 하는 이유가 있으셨을까요 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 그렇게 큰 이유는 없습니다..ㅎ There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 아 네 다음부터는 인식해서 쓰겠습니다! |
||
|
||
#socialIcons { | ||
list-style: none; | ||
padding-left: 0rem; | ||
margin-left: 1.6rem; | ||
display: flex; | ||
justify-content: space-between; | ||
} | ||
|
||
#socialIcons img { | ||
width: 2rem; | ||
height: 2rem; | ||
margin-right: 1.2rem; | ||
filter: drop-shadow(0 0 0.75rem rgba(0, 0, 0, 15%)); | ||
} | ||
|
||
@media (max-width: 474px) { | ||
|
||
#copyright { | ||
position: relative; | ||
bottom: -40px; | ||
} | ||
|
||
#footerContent { | ||
margin-left: 21px; | ||
margin-right: 0rem; | ||
} | ||
|
||
#info { | ||
width: 156.9px; | ||
position: relative; | ||
left: -127px; | ||
} | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
import faceBookImg from '../../img/social/ic_facebook.png'; | ||
import twitterImg from '../../img/social/ic_twitter.png'; | ||
import youtubeImg from '../../img/social/ic_youtube.png'; | ||
import instagramImg from '../../img/social/ic_instargram.png'; | ||
import './index.css'; | ||
|
||
function Footer() { | ||
return ( | ||
<footer> | ||
<div id="footerContent"> | ||
<div id="copyright">© Codeit 2024</div> | ||
|
||
<div id="info"> | ||
<div><a href="/privacy">Privacy Policy</a></div> | ||
<div id='faq'><a href="/faq">FAQ</a></div> | ||
</div> | ||
|
||
<div id="socialIcons"> | ||
<a href="https://www.facebook.com/?locale=ko_KR"><img src={faceBookImg} alt="Facebook" /></a> | ||
<a href="https://x.com/?lang=ko"><img src={twitterImg} alt="Twitter" /></a> | ||
<a href="https://www.youtube.com/"><img src={youtubeImg} alt="YouTube" /></a> | ||
<a href="https://www.instagram.com/sem/campaign/emailsignup"><img src={instagramImg} alt="Instagram" /></a> | ||
</div> | ||
</div> | ||
</footer> | ||
) | ||
} | ||
|
||
export default Footer; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
로컬 전용으로 만드셨네요, 좋습니다. 그런데 이걸 배포해야 할때는 어떻게 해야할까요? 한번 생각해보세요
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
아 배포 할 때 제 백엔드 서버를 배포했다면 그 url을 적용 시켜야 할 것 같습니다.
localhost는 배포를 해도 다른 컴퓨터에서 응답을 안 하겠네요
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
맞습니다. 우선 그 부분 인지하고 있으시다면 문제 없겠습니다.
복잡하실테니 대표적으로 두가지 경우를 미리 알려드릴게요
이렇게 하는 방법들이 있습니다.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
네 일단 확인만 하고 넘어가겠습니다.