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

[FE] feat#233#210 API 분리 및 함수 구현 & 서비스 전체 예외상황 리스트 체크 #234

Merged
merged 10 commits into from
Nov 21, 2024

Conversation

always97
Copy link
Collaborator

@always97 always97 commented Nov 20, 2024

➕ 이슈 번호


🔎 작업 내용

  • API 분리 및 함수 구현
  • 서비스 전체 예외상황 리스트 체크

🖼 참고 이미지

image

image


🎯 리뷰 요구사항 (선택)

  • 빠진 예외상황이 있거나 하면 알려주세요 !

✅ Check List

  • merge할 브랜치의 위치를 확인했나요?
  • Label을 지정했나요?

Copy link
Collaborator

@DongHoonYu96 DongHoonYu96 left a comment

Choose a reason for hiding this comment

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

LGTM
예외목록 작성까지 수고하셨습니다~
API 명세서 페이지에 예외 명세서도 추가하면 좋을것같아요. BE쪽에서 개발안된것도 많은것 같네요

Copy link
Collaborator

@NewCodes7 NewCodes7 left a comment

Choose a reason for hiding this comment

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

수고하셨습니다!! 에러 목록 정리한 거 좋네요 ㅎㅎ 꼼꼼하게 해주시려 한 게 보이네요!

@@ -14,6 +14,7 @@
"@emotion/styled": "^11.13.0",
"@mui/material": "^6.1.6",
"@tanstack/react-query": "^5.59.19",
"axios": "^1.7.7",
Copy link
Collaborator

Choose a reason for hiding this comment

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

fetch가 아닌 axios를 선택한 이유가 있을까요? (궁금)

Comment on lines +77 to +89
onPermanently<T extends SocketEvent>(
event: T,
callback: (data: SocketDataMap[T]['response']) => void
) {
const handler = () => this.socket.on(event, callback);
this.handlers.push(handler);
if (this.isActive()) handler();
}

emit<T extends SocketEvent>(event: T, data: SocketDataMap[T]['request']) {
this.socket.emit(event, data);
on<T extends SocketEvent>(event: T, callback: (data: SocketDataMap[T]['response']) => void) {
if (this.isActive()) this.socket.on(event, callback);
}

Copy link
Collaborator

Choose a reason for hiding this comment

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

onPermanently와 on의 쓰임새는 어떻게 다른가요? (궁금)

Copy link
Collaborator

Choose a reason for hiding this comment

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

on함수 -> socket이 바뀌면 리스너가 사라짐 -> 등록했다가 지워야 될때 사용 (ui작업)
onPermanently -> socket이 바뀌어도 안사라짐

Copy link
Collaborator

@songbuild00 songbuild00 left a comment

Choose a reason for hiding this comment

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

예외 목록 정리 꼼꼼하시네요! 고생하셨습니다 👍🏻

@always97 always97 merged commit f1c7bdf into boostcampwm-2024:dev-fe Nov 21, 2024
Copy link

@crongro crongro left a comment

Choose a reason for hiding this comment

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

머지되버렸네 ㅎ 리뷰내용 참고하세요~
@always97

Comment on lines +44 to +48
if (axios.isAxiosError(error)) {
console.error('Signup Error:', error.response?.data || error.message);
} else {
console.error('Unexpected Error:', error);
}
Copy link

Choose a reason for hiding this comment

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

이부분이 login과 비슷하게 할거면 통합해서 함수로 만들어도 될 듯.

import axiosInstance from './instance';

type LoginResponse = {
result: string;
Copy link

Choose a reason for hiding this comment

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

result는 좀더 구체적인 이름으로. string말고 더 구체적인 형태도 될 듯? 보통 응답은 객체로 하면 객체타입으로 표현해도 되고요.

if (axios.isAxiosError(error)) {
console.error('Login Error:', error.response?.data || error.message);
} else {
console.error('Unexpected Error:', error);
Copy link

Choose a reason for hiding this comment

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

에러처리의 목적인 개발자에게 보여줄것인가? 사용자에게 다음행동을 유도할것인가? 를 생각해서 처리하면더 좋을듯요.

return response.data;
} catch (error) {
console.error('Error fetching room list:', error);
return null;
Copy link

Choose a reason for hiding this comment

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

null로 반환하며 실제로 받는쪽에서 null을 확인해요?

@@ -0,0 +1,58 @@
export type QuizSet = {
id: string;
Copy link

Choose a reason for hiding this comment

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

id가 UUID 라면 이를 표현하는 방법도 있을거에요.

export type QuizSetDetailResponse = {
id: string;
title: string;
category: string;
Copy link

Choose a reason for hiding this comment

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

category 가 몇 개로 한정되어 있다면, 리터럴타입으로.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants