inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

한 입 크기로 잘라먹는 React.js 실전 프로젝트 - SNS 편

(9.5) 프로필 테이블 인가 설정하기

안녕하세요 9.3 프로필 수정 기능 구현하기 질문드립니다.

87

작성자 없음

작성한 질문수 0

0

image.png

마지막 부분인 9.5 프로필 인가부분까지 수업을 들으면서 코드를 작성했는데, ProfileDetailPage가 제대로 렌더링 되지 않아서 질문드립니다. 코드가 혹시 잘못되었을까해서 깃허브 보고 다시 확인했는데, 코드는 강의 내용이랑 맞는 것 같습니다. 뭐가 문제인지 잘모르겠어요

react typescript react-query supabase zustand

답변 3

0

이정환 Winterlood

안녕하세요 김예은님 보내주신 코드 확인해봤습니다.

해당 코드에는 아래 그림과 같이 ProfileDetailPage에 div 하나만 렌더링 하도록 작성되어 있습니다. 따라서 질문에 첨부해주신 그림과 같은 결과가 나타나는게 정상인데 ... 혹시 구체적으로 어떤 부분에 문제가 있으신걸까요?

image.png

 

0

이정환 Winterlood

안녕하세요 김예은님 이정환입니다.

보내주신 사진만으로는 정확한 원인 파악이 어렵습니다. 이에 전체 프로젝트 코드를 깃허브 또는 구글 드라이브를 통해 링크 형태로 전달해주시면 감사하겠습니다.

0

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다. 김예은님.

프로필 수정 기능을 구현 중에 ProfileDetailPage가 제대로 렌더링되지 않는 이슈를 겪고 계시는군요. 이러한 문제는 여러 가지 원인에 의해 발생할 수 있으니, 몇 가지 체크 포인트를 안내드리겠습니다.

1. 네트워크 요청 확인

먼저, DevTools의 Network 탭에서 모든 요청이 정상적으로 이루어지는지 확인하세요. Supabase에서 데이터를 가져오는 요청이 성공(Status 200)을 반환하는지 그리고 기대하는 데이터 구조를 반환하는지 중요합니다.

2. 데이터 유효성 검사

  • React Query 설정: React Query 또는 TanStack에서의 설정을 검토해 보세요. 데이터 페칭에 문제가 있으면, 데이터가 제대로 불러와지지 않을 수 있습니다.
  • 데이터 매핑: 반환된 프로필 정보가 컴포넌트가 기대하는 형태로 매핑되는지 확인하세요.

3. 상태 관리 및 오류 핸들링

  • 에러 핸들링: console에 에러 로그가 있는지 확인하고, 개발자 도구에서 콘솔을 확인하여 오류를 잡으세요.
  • 상태 여부: 만약 Zustand나 Context API 등 상태 관리 라이브러리를 사용 중이라면, 각 상태가 올바르게 설정되고 있는지 점검하세요.

4. ProfileDetail 컴포넌트 구조

  • 렌더링 조건: ProfileDetailPage 컴포넌트가 조건부 렌더링이 설정되어 있는지 확인해주세요. 예를 들어, 데이터가 없을 때 렌더링하지 않는 로직이 있지는 않은지 살펴보세요.

추가적으로 확인할 리소스

이 정보를 바탕으로 문제 해결에 도움이 되기를 바랍니다. 문제가 지속될 경우에는 코드의 특정 부분을 공유해 주시거나, 강의자나 커뮤니티에 추가적으로 질문을 남기는 것도 좋습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

회원가입 구현 (구현 후 최종 화면 출력 X)

0

64

2

(6.11) 회원가입시 프로필 정보 자동 생성하기 Q. 호출 순서 문의

0

56

1

명시적 타입 선언(콜론 타입 선언)과 as 타입 단언 차이

0

55

2

useMutation 적용 후 새로운 글 등록시 content가 안보여요

0

69

2

6.8 zustand 세션 질문입니다.

0

109

2

next.js 강의에서도 리액트 라이브러리들을 다뤄주시나요?

0

92

2

shadcn에서 radix ui와 base ui 차이는 뭔가요?

1

403

2

updateTodo 함수 생성시 화살표 함수 사용 안하는 이유

0

84

2

4.11 바로 투두 삭제가 안됨 질문

0

102

3

매개변수 updatedTodo 관련 질문

0

79

3

인증 정보가 만료되었을 때 라우트 가드 처리가 궁금합니다!

0

91

2

supabase를 사용하지 않을 경우 세션 데이터의 변경을 감지하고 스토어에 보관하는 방법이 궁금합니다!

0

85

2

4.6 id를 string으로 변경시 오류

0

74

2

리액트 타입스크립트 관련 질문있습니다.

0

71

1

소셜 로그인 구현하기 관련하여 질문이 있습니다!

0

108

2

ui 파일 질문드립니다.

0

90

1

tanstack query devtools에서 질문있습니다!

0

75

2

댓글 삭제 시 isPending 질문

0

72

2

두번째 예외상황에 대해 질문있습니다!

0

69

1

리액트 쿼리 질문입니다

1

83

2

개발자도구에서 components 가 안보입니다.

0

108

3

state 관리에 대한 정리

0

88

3

[(2.4) Shadcn/ui를 소개합니다] 강의 Shadcn 세팅 관련 질문 있습니다.

0

210

3

like 테이블에서 왜 create_at이 필요한지 궁금합니다.

0

87

1