[FE-33] feat: 닉네임 중복 기능 구현 #38

sookyeonghwang · 2022-12-28T20:59:06Z

작업 내용

닉네임 중복 기능 구현(useGetDuplicateNickname 쿼리 훅 구현)
useForm 훅 구현
- handleChange, handleRemove, handleSubmit 으로 폼 관리
- error 핸들링 적용

참고 이미지(선택)

어떤 점을 리뷰 받고 싶으신가요?

오타, 함수명, 변수명 등 로직까지 모두 부탁드립니다 :)

vercel · 2022-12-28T20:59:09Z

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

Name	Status	Preview	Updated
recordit	✅ Ready (Inspect)	Visit Preview	Dec 29, 2022 at 9:13AM (UTC)

Seongtaek-H

어제 로직보다 이게 훨씬 어려운데요. 한 번 직접 설명해주시면 좋을 것 같습니다.

Seongtaek-H · 2022-12-29T04:03:21Z

src/apis/auth.ts

+export const login = ({ type, token }: IAuth) => {
+  return baseInstance.post(`/member/oauth/login/${type}`, {
    oauth_token: token,
  })
 }

-export const signUp = async ({ type, tempId, nickname }: ISignUp) => {
-  return await baseInstance.post(`/member/oauth/register/{${type}`, {
+export const signUp = ({ type, tempId, nickname }: ISignUp) => {
+  return baseInstance.post(`/member/oauth/register/{${type}`, {


async await을 밖으로 빼신거죠? 확인했씁니다

Seongtaek-H · 2022-12-29T04:07:21Z

src/hooks/useForm.ts

+    setIsLoading(true)
+    e.preventDefault()
+
+    const newErrors = validate ? validate(values) : {}


validate 가 없는 경우도 있나여

필수로 validate를 넣으면 좋을 것 같지만 혹시 사용하지 않을 수도 있는 확장성을 위해 넣어두겠습니당! :)

Seongtaek-H · 2022-12-29T04:16:22Z

src/pages/SignUp/SignUp.tsx

+    validate: ({ nickname }) => {
+      const error: { nickname?: string } = {}
+      const spacePattern = /\s/g
+      const nicknamePattern = /^.{2,8}$/
+
+      if (nickname.match(spacePattern)) {
+        error.nickname = '공백을 제거해주세요'
+      }
+
+      if (!nickname.match(nicknamePattern)) {
+        error.nickname = '국문, 영문, 숫자로 이루어진 2~8자로 입력해주세요'
+      }
+
+      return error
+    },


여긴 그러니까 통과안될때 에러만 리턴하는 로직인거죠?

넵넵 그렇습니다!

Seongtaek-H · 2022-12-29T04:20:03Z

src/pages/SignUp/SignUp.tsx

  useEffect(() => {
-    if (location.state.tempSessionId) {
-      const tempId = location.state.tempSessionId
-      setUserInfo({ ...userInfo, tempId })
+    if (!location.state.tempSessionId) {
+      nativate('/login')


세션아이디 받아오는거 성공했을때 로직은 어디있어요??

회원가입 성공을 말하시는걸까요??

현재 로직은 로그인 실패했을 경우에 임시세션아이디를 백엔드에서 준 것을 가져오고있습니다!
react-query/hooks/useAuth파일 보시면 될 것 같아요!

endmoseung

코드 잘 봤어요!!!수고하셨습니다 워터

endmoseung · 2022-12-29T04:55:29Z

src/pages/SignUp/SignUp.tsx

  })
+  const { isSuccess } = useGetDuplicateNickname(nickname, checkedNickname)
+
+  const nativate = useNavigate()


Suggested change

const nativate = useNavigate()

const navigate = useNavigate()

오타수정이용

왕 감사합니다

endmoseung · 2022-12-29T05:18:14Z

src/pages/SignUp/SignUp.tsx

+
+      if (!nickname.match(nicknamePattern)) {
+        error.nickname = '국문, 영문, 숫자로 이루어진 2~8자로 입력해주세요'
+      }


validation 정규직 사용 깔끔합니다

endmoseung · 2022-12-29T05:24:48Z

src/pages/SignUp/SignUp.tsx

-    nickname: '',
+  const [nickname, setNickname] = useState('')
+  const [checkedNickname, setCheckedNickname] = useState(false)
+  const [property, setProperty] = useState<PropertyType>('default')


Suggested change

const [property, setProperty] = useState<PropertyType>('default')

const [property, setProperty] = useState<PropertyType>('default')

boolean값을 반환하는 변수이름은 아래에서 그러셨던덕처럼 is를 붙이는게 더 이해가 편할것 같아용

혹시 checkedNickname을 말하시는걸까요? <- 이부분 반영하겠습니다!

- navigate 함수명 수정 - validate 필수가 아니도록 변경

sookyeonghwang added 6 commits December 29, 2022 02:17

[FE-33] feat: useForm 훅 구현

f400bf3

[FE-33] feat: 닉네임 중복 useForm 적용

aa3eba4

[FE-33] feat: 닉네임 Input 내용 초기화 구현

51c673f

[FE-33] feat: 닉네임 중복 에러 디자인 구현

194a700

[FE-33] feat: 닉네임 중복 기능 구현

d23d931

[FE-33] feat: 비동기 적용 (회원가입/로그인)

bf8ba6e

sookyeonghwang added the ✨ Feature 기능 개발 label Dec 28, 2022

sookyeonghwang requested a review from Seongtaek-H as a code owner December 28, 2022 20:59

sookyeonghwang self-assigned this Dec 28, 2022

sookyeonghwang requested a review from endmoseung as a code owner December 28, 2022 20:59

Seongtaek-H reviewed Dec 29, 2022

View reviewed changes

endmoseung approved these changes Dec 29, 2022

View reviewed changes

[FE-33] refactor: 코드 리뷰 반영

eb72bfa

- navigate 함수명 수정 - validate 필수가 아니도록 변경

vercel bot deployed to Preview December 29, 2022 08:29 View deployment

[FE-33] style: isCheckedNickname 변수명 수정

95d7235

vercel bot deployed to Preview December 29, 2022 08:30 View deployment

[FE-33] style: 사용하지 않는 변수 property 제거

0fba716

vercel bot deployed to Preview December 29, 2022 09:13 View deployment

sookyeonghwang merged commit f0977b5 into FE-25 Dec 29, 2022

sookyeonghwang deleted the FE-33 branch December 29, 2022 09:14

	const nativate = useNavigate()
	const navigate = useNavigate()

	const [property, setProperty] = useState<PropertyType>('default')
	const [property, setProperty] = useState<PropertyType>('default')

[FE-33] feat: 닉네임 중복 기능 구현 #38

[FE-33] feat: 닉네임 중복 기능 구현 #38

Uh oh!

Conversation

sookyeonghwang commented Dec 28, 2022

작업 내용

참고 이미지(선택)

어떤 점을 리뷰 받고 싶으신가요?

Uh oh!

vercel bot commented Dec 28, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Seongtaek-H left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

endmoseung left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

vercel bot commented Dec 28, 2022 •

edited

Loading