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

[팀 서비스 클론 코딩] 윤생(이윤성) 미션 제출합니다. #15

Merged
merged 21 commits into from
Oct 16, 2023

Conversation

2yunseong
Copy link

🎨 1단계 - 팀 서비스의 일부 페이지 클론 코딩

우디 안녕하세요!! 마지막 미션으로 만나 영광입니다 잘 부탁드립니다 :)

🚀 구현한 페이지의 주소와 방식

  • 주소: 링크
  • 렌더링 방식: SSR

✅ 체크리스트

선택한 렌더링 방식의 이유

  • 선택한 렌더링 방식이 어떤 페이지에 적합한지, 왜 선택했는지 이유 설명
    현재 고객이 적립된 쿠폰을 보여주는 기능인데, 그렇게 갱신이 필요없고 사용자가 요청할 때만 그려주면 된다고 생각해 SSR로 구현하였습니다.
    재 생각에는 ISR로 해도 될 것 같다는 생각인데 우디는 어떻게 생각하시나욥??

코드 재사용

  • 기존 서비스에서 구현한 리액트 컴포넌트의 재사용 여부와 활용 방식에 대해 설명
    코드는 거의 그대로 재사용 하였고, 서버에서 데이터를 불러오는 부분만 변경하였습니다.
    기존 코드에 있는 다양한 기능은 배제하고 next.js학습에 중점적으로 연습해보기 위해 불러온 coupon을 보여주는 부분만 구현하였습니다!

@2yunseong 2yunseong requested a review from jw-r October 11, 2023 04:35
@2yunseong 2yunseong self-assigned this Oct 11, 2023
Copy link

@jw-r jw-r left a comment

Choose a reason for hiding this comment

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

윤생 안녕하세요~!
저야말로 윤생의 마지막 미션의 리뷰어가 될 수 있어서 영광입니다🥹

코드가 정말 깔끔하네요🤩

  • 사용성
    매우 잘 동작하는 것을 확인했습니다
    특히 자바스크립트를 비활성화 한 상태에서도 사용자에게 모든 요소를 보여줄 수 있어서 좋네요!

  • 데이터 요청
    SSR과 ISR 중에서 고민하시다 SSR 방식을 선택하셨네요!
    저도 SSR 방식을 택했을 것 같아요! 이유는 다음과 같습니다

  • 실시간성
    사용자의 쿠폰은 돈과 직접 연결되는 민감한 정보라고 생각해요
    때문에 변동사항이 생겼다면 바로바로 업데이트 할 수 있다는 측면에서 페이지에 접근할 때마다 요청을 보내는 SSR 방식이 적절하다고 생각합니다👍

  • 사용자 고유의 데이터
    쿠폰은 사용자의 고유의 데이터이기 때문에 정적 페이지를 미리 빌드하여 제공하기에도 어려움이 있을 것 같아요

  • 파일 기반 라우팅
    코맨트 확인 부탁드립니다🤩

  • 에러 핸들링
    잘못 된 url로 접근했을 때 404 페이지로 리다이렉트 되는 것을 확인할 수 있었어요
    다만 실제 stamp crush의 404 페이지가 아닌, NextJS에서 기본으로 제공하는 페이지였는데요!
    이 부분을 수정해보면 어떨까요?🤩

Copy link

Choose a reason for hiding this comment

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

제 기억이 맞다면 NextJS 12버전의 라우팅 방식을 사용하신 것 같아요
그 이유가 궁금합니다!!

Copy link
Author

Choose a reason for hiding this comment

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

기존의 튜토리얼을 따라가면서 진행해, 한정된 시간안에 구현해 낼 수 있는게 page router라고 판단하였습니다!
또한 흘려들은 이야기지만 아직 13보다는 12버전이 실무에서 많이 쓰인다고 들어서요..! (이 부분은 틀릴수도 있습니다)
그래서 일단 이번 미션은 page router로 진행하였습니다! 물론 13버전에서는 두 라우팅 모두 호환되므로 버전은 가장 최신버전을 사용하였습니다~~!

Copy link

@jw-r jw-r left a comment

Choose a reason for hiding this comment

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

윤생 너무 고생하셨어요!!

404 페이지 잘 동작하는 거 확인했습니다!
이번 미션은 여기서 머지하도록 할게요🤩

step2에서 만나용!!

@jw-r jw-r merged commit 62ab40f into woowacourse:2yunseong Oct 16, 2023
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.

2 participants