Skip to content

[Feat/#184]: 초반 플로우 개선#190

Merged
JIMIN1020 merged 17 commits intodevfrom
feat/#184
Aug 4, 2025
Merged

[Feat/#184]: 초반 플로우 개선#190
JIMIN1020 merged 17 commits intodevfrom
feat/#184

Conversation

@JIMIN1020
Copy link
Contributor

📍 작업 내용

초반 플로우 개선

유저가 프롤로그에 처음 가입하여 책을 쌓아가는 초반 플로우를 개선했습니다.

기존의 경우 책을 2권 쌓은 경우 새로운 캐릭터가 지급되고, 새로운 우물을 생성하도록 유도합니다.
개선된 버전에서는 책을 1권 쌓은 경우 기본 캐릭터 중 하나의 캐릭터를 자율 선택으로 지급하고, 2권 쌓은 경우 기본 캐릭터를 모두 지급합니다.


📍 구현 결과 (선택)

스크린샷 2025-07-29 오후 10 20 38

📍 기타 사항


@JIMIN1020 JIMIN1020 requested a review from SebellKo July 29, 2025 13:21
@JIMIN1020 JIMIN1020 self-assigned this Jul 29, 2025
@JIMIN1020 JIMIN1020 added the feat 기능 구현 label Jul 29, 2025
@vercel
Copy link

vercel bot commented Jul 29, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
frolog ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 4, 2025 2:11pm

Copy link
Contributor

@SebellKo SebellKo left a comment

Choose a reason for hiding this comment

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

고생하셨습니다 ~ 👏👏

const [isOpenGuideSheet, setIsOpenGuideSheet] = useState(false);

const { mutate: handleAcquireFrog } = useMutation({
mutationFn: (key: string) => getFirstFrog(key, session?.user.id),
Copy link
Contributor

Choose a reason for hiding this comment

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

mutationFn에 get으로 시작하는 함수명은 조금 헷갈릴수도 있겠다 생각됨니다

Copy link
Contributor Author

Choose a reason for hiding this comment

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

흠 그럴 수도 있겠네요

setIsAcquired(true);
setOwnedFrog(key);
},
});
Copy link
Contributor

Choose a reason for hiding this comment

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

이 mutation은 왜 별도 훅으로 분리 안하셨어요 ? 상태 관리를 컴포넌트 내부에서 하는게 덜 복잡해서 ?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

  1. 우선 로직이 길지 않습니다.
  2. 총 3단계로 이어지는 흐름이 있는 컴포넌트라서 로직을 분리하기보단 한눈에 보는 것이 직관적이라고 생각했습니다.
  3. mutation을 꼭 별도로 분리해야하는 이유가 없다고 생각합니다.

type='button'
onClick={() => handleClick('yes')}
className={`${buttonStyle} ${watch('recommend') === 'yes' || typeof window === 'undefined' ? selected : ''}`}
>
Copy link
Contributor

Choose a reason for hiding this comment

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

왜 얘만 갑자기 typeof window ?
서버 렌더링이에요 ?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

클라이언트 컴포넌트라고 해도 next.js의 모든 컴포넌트들은 기본적으로 서버에서 초기 렌더가 일어나는 걸로 알고 있어요. 이게 hydration mismatch 같은 에러가 발생하는 이유기도 하고요. 위 조건은 ssr 환경에서 초기 렌더될 때 초기값을 설정하는 용입니다~

@JIMIN1020 JIMIN1020 merged commit f980cab into dev Aug 4, 2025
3 checks passed
@sentry
Copy link

sentry bot commented Aug 10, 2025

Suspect Issues

This pull request was deployed and Sentry observed the following issues:

Did you find this useful? React with a 👍 or 👎

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feat 기능 구현

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants