Skip to content
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

[김주은] sprint10 #305

Conversation

marie1016
Copy link
Collaborator

요구사항

  • Github에 PR(Pull Request)을 만들어서 미션을 제출합니다.
  • 피그마 디자인에 맞게 페이지를 만들어 주세요.
  • 기존의 React, Typescript로 구현한 프로젝트와 별도로 진행합니다.
  • Next.js를 사용합니다.

기본

상품 등록 페이지

  • 상품 등록 페이지 주소는 “/addboard” 입니다.
  • 게시판 이미지는 최대 한개 업로드가 가능합니다.
  • 각 input의 placeholder 값을 정확히 입력해주세요.
  • 이미지를 제외하고 input 에 모든 값을 입력하면 ‘등록' 버튼이 활성화 됩니다.
  • 회원가입, 로그인 api를 사용하여 받은accessToken을 사용하여 게시물 등록을 합니다.
  • ‘등록’ 버튼을 누르면 게시물 상세 페이지로 이동합니다.
    상품 상세 페이지
  • 상품 상세 페이지 주소는 “/board/{id}” 입니다.
  • 댓글 input 값을 입력하면 ‘등록' 버튼이 활성화 됩니다.
  • 활성화된 ‘등록' 버튼을 누르면 댓글이 등록됩니다

주요 변경사항

  • 코드리뷰를 반영하였습니다.
  • 스프린트 미션 10을 진행하였습니다.

스크린샷

멘토에게

  • 셀프 코드 리뷰를 통해 질문 이어가겠습니다.

@marie1016 marie1016 added the 매운맛🔥 뒤는 없습니다. 그냥 필터 없이 말해주세요. 책임은 제가 집니다. label Aug 17, 2024
@marie1016 marie1016 self-assigned this Aug 17, 2024
Copy link
Collaborator

@lisarnjs lisarnjs left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

좋습니다 주은님!
언제나 주은님 코드 보면 놀래요 자신감을 가져도 좋을 거 같아요 ㅎㅎ!
이번 한주도 화이팅이에요 👍

<>
<section className={styles.contentWrapper}>
<p className={styles.content}>{comment.content}</p>
<Image src="/ic_modify.png" alt="수정 아이콘" width={24} height={24} />
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

alt 속성은 습관적으로 사용하기! 👍

@@ -12,7 +12,7 @@ const Dropdown = ({ options, selectedValue, onSelect }: DropdownProps) => {
const [isOpen, setIsOpen] = useState(false);

const toggleDropdown = () => {
setIsOpen(!isOpen);
setIsOpen((prev) => !prev);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

우왕 굿굿!!


const nextPreviewImg = URL.createObjectURL(value);
setPreviewImg(nextPreviewImg);
setShowPreview(true);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

shopPreview 상태는 previewImg 상태로부터 유도될 수 있을 것 같아서 굳이 필요 없는 state 같다 라는 생각이 드는데 한번 고민해보시면 좋을 것 같네요!

};

useEffect(() => {
if (!value) return;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

얼리 리턴 굿이에요!

setPreviewImg(nextPreviewImg);
setShowPreview(true);

return () => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

클린업까지 굿굿이이에요!!

/>
</div>
<div>
{showPreview ? (
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

조건 결과 하나가 null일 경우에는 &&연산자를 사용해주시는 것이 가독성 면에서도 좋습니다!

];

async function getArticles(orderBy: string, keyword: string) {
const nextArticles: Article[] = await fetchAllArticles(orderBy, keyword);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

try catch 로 api 호출하는 함수를 감싸주면 더 안전하고 좋을 것 같아요!

export default instance;

export const fetchArticles = async () => {
try {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

오! 여기는 에러 핸들링을 아주 잘해주셨어요!

let article = null;
try {
const res = await instance.get(`/articles/${id}`);
article = res.data;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

여기서 성공했다면 필요한 props들 바로 return 해줘도 좋을듯!

@lisarnjs lisarnjs merged commit ff97fd6 into codeit-bootcamp-frontend:Next-김주은 Aug 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
매운맛🔥 뒤는 없습니다. 그냥 필터 없이 말해주세요. 책임은 제가 집니다.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants