Conversation
…ithub-actions [Fix] delete merged branch github action
…d/11-Sprint-Mission into Next-김태완 "start"
| font-weight: 700; | ||
| font-size: 20px; | ||
| line-height: 24px; | ||
| color: #111827; |
There was a problem hiding this comment.
컬러 변수를 사용해서 색상을 관리해보시는 것도 추천드립니다.
| @@ -0,0 +1,177 @@ | |||
| .bestContainer { | |||
There was a problem hiding this comment.
class 이름에는 보통 카멜케이스를 잘 사용하진 않습니다. 이미 작성하신 부분은 어쩔 수 없지만, css 명명 방법에 대해 한번 알아보셔도 좋을 것 같습니다.
| color: #9ca3af; | ||
| } | ||
|
|
||
| @media screen and (max-width: 744px) { |
There was a problem hiding this comment.
저는 개인적으로 각 class 내부에 반응형 css를 작성해주는 편 입니다. 추후에 하나의 클래스 디자인이 바뀔때 해당 클래스 부분의 css만 수정하면 되거든요.
| import { FormatDate } from "@/lib/formatDate"; | ||
|
|
||
| interface BestBoardListProps { | ||
| bestArticles: Array<any>; |
There was a problem hiding this comment.
any는 지양하는 것이 좋기 때문에 bestArticles의 타입을 any가 아니라 api에서 응답으로 주는 값들을 타입으로 지정해보시면 좋을 것 같습니다. 또, Array는 [] 표시로 대체할 수도 있습니다.
| <img | ||
| className={styles.bestImg} | ||
| src="/images/bestIcon.png" | ||
| alt="베스트 아이콘 이미지" | ||
| /> |
There was a problem hiding this comment.
아이콘은 svg 태그를 사용하시는 것도 좋습니다.
| return ( | ||
| <div className={styles.navContainer}> | ||
| <div className={styles.navBox}> | ||
| <img |
There was a problem hiding this comment.
next/image를 사용하시면 img 태그 대신에 next/image를 사용해보시면 좋을 것 같아요.
| import axios from "axios"; | ||
|
|
||
| const instance = axios.create({ | ||
| baseURL: "https://panda-market-api.vercel.app", |
There was a problem hiding this comment.
baseURL은 .env 파일로 관리하시고 깃허브에 안올라오게 해주시는 것도 좋습니다.
| @@ -0,0 +1,8 @@ | |||
| export const FormatDate = (dateString: string): string => { | |||
There was a problem hiding this comment.
이 함수는 날짜 형태를 변환하는 함수인 것 같은데 함수 이름은 보통 카멜케이스를 사용해서 작성 합니다.
| const Article = () => { | ||
| const [bestArticles, setBestArticles] = useState([]); | ||
| const [articles, setArticles] = useState([]); | ||
| const [orderBy, setOrderBy] = useState("recent"); |
There was a problem hiding this comment.
recent 같은 상수 값들은 따로 상수로 관리해주셔도 좋습니다.
요구사항
기본
심화
주요 변경사항
멘토에게