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.

Sign up for GitHub

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

Jump to bottom

Auth client/#62 #75

Merged
merged 6 commits into from
Apr 15, 2024
Merged

Auth client/#62 #75

merged 6 commits into from
Apr 15, 2024

Conversation

seonghunYang
Copy link
Collaborator

@seonghunYang seonghunYang commented Apr 13, 2024 •
edited
Loading

πŸ“Œ μž‘μ—… λ‚΄μš©

κ΅¬ν˜„ λ‚΄μš© 및 μž‘μ—… ν–ˆλ˜ λ‚΄μ—­

  • ν΄λΌμ΄μ–ΈνŠΈ μˆ˜μ€€ λ°œμƒν•˜λŠ” μ—λŸ¬ 처리 둜직 μž‘μ„±
  • μ—λŸ¬ λ°”μš΄λ”λ¦¬ μ»΄ν¬λ„ŒνŠΈ 개발
  • λΉŒλ“œ κΉ¨μ§€λŠ” 버그듀을 일뢀 μˆ˜μ •ν–ˆμŠ΅λ‹ˆλ‹€.

πŸ€” κ³ λ―Ό ν–ˆλ˜ λΆ€λΆ„

  • μ—λŸ¬ λ°”μš΄λ”λ¦¬μ˜ λ™μž‘ κ³Όμ •

    • μ²˜μŒμ—λŠ” 이벀트 ν•Έλ“€λŸ¬ λ‚΄λΆ€μ˜ μ„œλ²„ μ•‘μ…˜μ΄ 인증 κ΄€λ ¨ μ—λŸ¬λ₯Ό λ°œμƒμ‹œν‚¬ λ•Œ, μ—λŸ¬ λ°”μš΄λ”λ¦¬μ—μ„œ μΌκ΄€λ˜κ²Œ μ²˜λ¦¬ν•˜λ €κ³  ν–ˆμŠ΅λ‹ˆλ‹€.
    • κ·ΈλŸ¬λ‚˜ 이벀트 ν•Έλ“€λŸ¬μ—μ„œ μ—λŸ¬κ°€ λ°œμƒν•˜λ”λΌλ„ μ—λŸ¬ λ°”μš΄λ”λ¦¬κ°€ μž‘λ™ν•˜μ§€ μ•Šμ•˜μŠ΅λ‹ˆλ‹€. 이유λ₯Ό μ°Ύμ•„λ³΄λ‹ˆ, 이벀트 ν•Έλ“€λŸ¬μ—μ„œ λ°œμƒν•œ μ—λŸ¬λŠ” μ—λŸ¬ λ°”μš΄λ”λ¦¬κ°€ μž‘μ§€ μ•ŠλŠ”λ‹€κ³  ν•©λ‹ˆλ‹€.
    • μ΄λŠ” μ—λŸ¬ λ°”μš΄λ”λ¦¬μ˜ 쑴재 λͺ©μ μ΄ μ—λŸ¬ λ°œμƒ μ‹œ μ‚¬μš©μžμ—κ²Œ μ΄μƒν•œ 화면을 λ³΄μ—¬μ£ΌλŠ” 것을 λ°©μ§€ν•˜κΈ° μœ„ν•¨μ΄λ©°, 이벀트 ν•Έλ“€λŸ¬μ˜ 경우 λ Œλ”λ§ μžμ²΄μ—λŠ” λ¬Έμ œκ°€ μ—†κΈ° λ•Œλ¬ΈμΈ 것 κ°™μŠ΅λ‹ˆλ‹€.

  • Next Js global error

    global-error.jsΒ is only enabled in production. In development, our error overlay will show instead.

    • 인증 였λ₯˜ λ°œμƒ μ‹œ μΌκ΄€λ˜κ²Œ 둜그인 νŽ˜μ΄μ§€λ‘œ μ΄λ™ν•˜λŠ” λ‘œμ§μ„ μ²˜λ¦¬ν•΄μ•Ό ν–ˆμŠ΅λ‹ˆλ‹€.
    • 둜직이 μΌκ΄€λ˜λ―€λ‘œ, 인증 였λ₯˜λŠ” global-error μ»΄ν¬λ„ŒνŠΈμ—μ„œ μ²˜λ¦¬ν•˜λŠ” 것이 μ μ ˆν•˜λ‹€κ³  νŒλ‹¨ν–ˆμŠ΅λ‹ˆλ‹€.
    • ν•˜μ§€λ§Œ global-errorλŠ” ν”„λ‘œλ•μ…˜ μƒνƒœμ—μ„œλ§Œ μž‘λ™ν•œλ‹€λŠ” 점을 μ•Œκ²Œ λ˜μ—ˆμŠ΅λ‹ˆλ‹€.
    • λ”°λΌμ„œ, 일단은 sub-page ν΄λ”μ˜ error μ»΄ν¬λ„ŒνŠΈμ—μ„œ μ²˜λ¦¬ν•˜λ„λ‘ κ²°μ •ν–ˆμŠ΅λ‹ˆλ‹€.

  • μ„œλ²„μ™€ ν΄λΌμ΄μ–ΈνŠΈμ˜ error μΈμŠ€ν„΄μŠ€

    • μ›λž˜ μ—λŸ¬ λ°”μš΄λ”λ¦¬μ—μ„œ μ„œλΈŒν΄λž˜μ‹±λœ μ—λŸ¬ 객체λ₯Ό error instanceof BadRequestError와 같이 μΈμŠ€ν„΄μŠ€λ‘œ λΆ„κΈ° μ²˜λ¦¬ν•˜λ €κ³  ν–ˆμŠ΅λ‹ˆλ‹€.
    • μ„œλΈŒν΄λž˜μ‹±μ€ 잘 λ˜μ§€λ§Œ, μΈμŠ€ν„΄μŠ€λ‘œ μΈν•œ λΆ„κΈ° μ²˜λ¦¬κ°€ μž‘λ™ν•˜μ§€ μ•Šμ•˜μŠ΅λ‹ˆλ‹€. κ·Έλž˜μ„œ μ°Ύμ•„λ³Έ κ²°κ³Ό, μ„œλ²„ μ»΄ν¬λ„ŒνŠΈμ—μ„œ λ°œμƒν•œ 였λ₯˜λŠ” μ„œλ²„ μ½”λ“œμ—μ„œ μž‘λ™ν•˜κ³ , μ—λŸ¬ λ°”μš΄λ”λ¦¬λŠ” ν΄λΌμ΄μ–ΈνŠΈ μ½”λ“œμ—μ„œ μž‘λ™ν•΄μ„œ μΈμŠ€ν„΄μŠ€κ°€ λ‹€λ₯Έ 것 κ°™μŠ΅λ‹ˆλ‹€.
    • React 곡식 λ¬Έμ„œλ₯Ό λ³΄λ‹ˆ, μ—λŸ¬ λ°”μš΄λ”λ¦¬λŠ” μ›λž˜ μ„œλ²„ μΈ‘ λ Œλ”λ§μ—μ„œ λ°œμƒν•œ 였λ₯˜λ₯Ό ν¬μ°©ν•˜μ§€ μ•ŠλŠ”λ‹€κ³  ν•©λ‹ˆλ‹€. κ·Έλž˜μ„œ Nextκ°€ 자체적으둜 μ„œλ²„ μΈ‘μ—μ„œ λ°œμƒν•œ 였λ₯˜λ₯Ό ν΄λΌμ΄μ–ΈνŠΈ μ»΄ν¬λ„ŒνŠΈμΈ μ—λŸ¬ λ°”μš΄λ”λ¦¬μ— μ—°κ²°ν•΄μ£ΌλŠ” μž‘μ—…μ„ ν•˜λŠ” 것 같은데, μΈμŠ€ν„΄μŠ€κΉŒμ§€ λ³΅μ œλŠ” μ•ˆλ˜κ³ , λ‚΄μš©λ§Œ κ°™κ²Œ ν•΄μ£ΌλŠ” 것 κ°™μŠ΅λ‹ˆλ‹€.
    • κ·Έλž˜μ„œ message둜 λΆ„κΈ° μ²˜λ¦¬ν•΄μ„œ λ‘œμ§μ„ μž‘μ„±ν–ˆμŠ΅λ‹ˆλ‹€. codeλ‚˜ name이 μ•„λ‹ˆλΌ message둜 μ²˜λ¦¬ν•œ μ΄μœ λŠ” λ¬Έμ„œμ— μ„œλ²„ μΈ‘μ—μ„œ λ°œμƒν•œ 였λ₯˜λŠ” message 와 digest만 ν¬ν•¨λœλ‹€κ³  λ˜μ–΄ 있기 λ•Œλ¬Έμž…λ‹ˆλ‹€.

@github-actions GitHub Actions
Copy link

πŸš€storybook: https://65ccb85d5afe55a024495bc0-lehsyckfah.chromatic.com/

yougyung
yougyung reviewed Apr 13, 2024
View reviewed changes
Copy link
Member

@yougyung yougyung left a comment •
edited
Loading

Choose a reason for hiding this comment

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

app/ui/view/molecule/table/table.stories.tsx
app/ui/view/molecule/list/swipeable-custom-list.tsx
ν•΄λ‹Ή νŒŒμΌμ€ PRμ—μ„œ 말씀해주신 build해결을 μœ„ν•΄μ„œ λ³€κ²½λœ 사항인 것 κ°™λ„€μš”.
개발 과정을 μžμ„Ένžˆ μ μ–΄μ£Όμ…”μ„œ 이해가 μˆ˜μ›”ν–ˆλ˜ 것 κ°™μ•„μš”. κ°μ‚¬ν•©λ‹ˆλ‹€. μˆ˜κ³ ν•˜μ…¨μ–΄μš”!

app/global-error.tsx
Copy link
Member

Choose a reason for hiding this comment

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

global-errorλŠ” ν”„λ‘œλ•μ…˜μ—μ„œλ§Œ ν™œμ„±ν™”λ˜μ–΄ sub-page의 errorμ—μ„œ ν•΄λ‹Ή 처리λ₯Ό μ§„ν–‰ν•˜λŠ” κ²ƒμœΌλ‘œ μ΄ν•΄ν–ˆλŠ”λ°, ν•΄λ‹Ή νŒŒμΌμ€ μ–΄λ–»κ²Œ μ‚¬μš©λ  μ˜ˆμ •μΈκ°€μš”? μΆ”ν›„ 변경을 μ˜ˆμƒν•˜μ‹œλ‚˜μš”?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

  • ν”„λ‘œλ•μ…˜μ—μ„œλŠ” global-errorμ—μ„œ μ—λŸ¬λ₯Ό μ²˜λ¦¬ν•˜λŠ” 것이 μ’‹κ² λ‹€λŠ” 생각이 μžˆμŠ΅λ‹ˆλ‹€. λ§μ”€ν•˜μ‹ λŒ€λ‘œ 개발 κ³Όμ •μ—μ„œλŠ” sub-pageμ—μ„œ μ—λŸ¬ 처리λ₯Ό μ§„ν–‰ν•˜μ§€λ§Œ, 배포 직전에 인증관련 μ—λŸ¬ μ²˜λ¦¬λŠ” global-errorμ—μ„œ μž‘λ™ν•˜λ„λ‘ μˆ˜μ •ν•  κ³„νšμž…λ‹ˆλ‹€.

app/(sub-page)/protected/page.tsx
Copy link
Member

Choose a reason for hiding this comment

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

ν•΄λ‹Ή νŽ˜μ΄μ§€λŠ” μ–Έμ œ 호좜이 되고 μ–΄λŠ 역할을 ν•˜λŠ”μ§€ μΆ”κ°€λ‘œ μ„€λͺ…을 ν•΄μ£Όμ‹€ 수 μžˆμ„κΉŒμš”?

Copy link
Member

Choose a reason for hiding this comment

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

저도 κΆκΈˆν•©λ‹ˆλ‹€ !
μ œκ°€ μ˜ˆμƒν•˜κΈ°μ—λŠ” protected νŽ˜μ΄μ§€λ‘œ κ°€κ²Œλ˜λ©΄ 무쑰건 401을 λ°˜ν™˜ν•˜λ‹ˆκΉŒ error.tsxκ°€ ν˜ΈμΆœν•˜κ³  이 λ‘œμ§μ„ 보기 μœ„ν•΄μ„œ protected νŽ˜μ΄μ§€λ₯Ό λ§Œλ“  것 같은데 λ§žμ„κΉŒμš”?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

  • 이 νŽ˜μ΄μ§€λŠ” 인증 κ΄€λ ¨ μ—λŸ¬ 처리 둜직이 μ •μƒμ μœΌλ‘œ μž‘λ™ν•˜λŠ”μ§€ ν…ŒμŠ€νŠΈν•˜κΈ° μœ„ν•΄ λ§Œλ“  κ°œλ°œμš©μž…λ‹ˆλ‹€. 주석에 기둝해두어야 ν–ˆλŠ”λ°, λΉ νŠΈλ Έλ„€μš”. λ―Έμ•ˆν•©λ‹ˆλ‹€

gahyuun
gahyuun approved these changes Apr 13, 2024
View reviewed changes
Copy link
Member

@gahyuun gahyuun left a comment

Choose a reason for hiding this comment

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

κ³ μƒν•˜μ…¨μŠ΅λ‹ˆλ‹€

  • error.js와 global-error.js에 λŒ€ν•΄ 배우고 κ°‘λ‹ˆλ‹€!

app/(sub-page)/protected/page.tsx
Copy link
Member

Choose a reason for hiding this comment

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

저도 κΆκΈˆν•©λ‹ˆλ‹€ !
μ œκ°€ μ˜ˆμƒν•˜κΈ°μ—λŠ” protected νŽ˜μ΄μ§€λ‘œ κ°€κ²Œλ˜λ©΄ 무쑰건 401을 λ°˜ν™˜ν•˜λ‹ˆκΉŒ error.tsxκ°€ ν˜ΈμΆœν•˜κ³  이 λ‘œμ§μ„ 보기 μœ„ν•΄μ„œ protected νŽ˜μ΄μ§€λ₯Ό λ§Œλ“  것 같은데 λ§žμ„κΉŒμš”?

app/(sub-page)/error.tsx
console.error(error);
}, [error]);

if (error.message === 'Unauthorized') {
Copy link
Member

Choose a reason for hiding this comment

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

message둜 ꡬ뢄을 ν•˜λŠ”λ°, λ°±μ—”λ“œμ—μ„œ μ—λŸ¬ μ‹œ messageλ₯Ό 보내주고 μžˆμ§€ μ•Šμ€ μƒνƒœμž…λ‹ˆλ‹€.
이에 λŒ€ν•΄μ„œ λ°±μ—”λ“œν•œν…Œ μž¬μš”μ²­μ„ ν• κΉŒμš”?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

  • μ—¬κΈ°μ„œ μ–ΈκΈ‰ν•˜λŠ” 'message'λŠ” httpErrorHandler ν•¨μˆ˜λ₯Ό 톡해 μž‘λŠ” μ„œλΈŒν΄λž˜μŠ€ν™”λœ μ—λŸ¬λ₯Ό μ˜λ―Έν•˜λ©°, μ΄λŠ” λ°±μ—”λ“œμ—μ„œ λ³΄λ‚΄λŠ” 'message'와 차이가 μžˆμŠ΅λ‹ˆλ‹€.
  • λ°±μ—”λ“œμ˜ μƒνƒœ μ½”λ“œλ₯Ό μ‚¬μš©ν•˜μ—¬ μ—λŸ¬λ₯Ό 각 κ²½μš°μ— 맞게 μ„œλΈŒν΄λž˜μŠ€ν™”ν•˜λ©°, 이 κ³Όμ •μ—μ„œ 'message'λ₯Ό μž…λ ₯ν•˜λ―€λ‘œ λ°±μ—”λ“œμ— μž¬μš”μ²­ν•  ν•„μš”κ°€ μ—†μŠ΅λ‹ˆλ‹€.
  • λ²ˆμ™Έλ‘œ λ°±μ—”λ“œμ—μ„œ μ—λŸ¬ μ½”λ“œκ°€ 생긴닀면, μœ„μ—μ„œ λ§ν•œ 이슈 떄문에 message에 ν•΄λ‹Ή μ—λŸ¬ μ½”λ“œλ₯Ό λ„£μ–΄μ•Ό κ² λ‹€λŠ” 생각이 λ“œλ„€μš”.

@seonghunYang seonghunYang merged commit 636c35b into main Apr 15, 2024
2 of 3 checks passed
@seonghunYang seonghunYang deleted the auth-client/#62 branch April 15, 2024 11:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@yougyung yougyung yougyung approved these changes

@gahyuun gahyuun gahyuun approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@seonghunYang @yougyung @gahyuun