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

로그인(Oauth) 페이지 레이아웃 완성 #55

Merged
merged 2 commits into from
Oct 22, 2024

Conversation

rhehfl
Copy link
Collaborator

@rhehfl rhehfl commented Oct 20, 2024

🔗 관련 이슈

54

📝작업 내용

image
간단하게 소셜로그인 화면 레이아웃을 생성했습니다
kakao_login_medium_wide
각 디벨로퍼 사이트에서 이런식으로 이미지파일을 제공해줘서 나중에 s3에 업로드 후 각 로그인버튼에 넣으면 좋을 것 같습니다!
링크는 일단 우선순위가 높은 카카오 소셜로그인 링크를 달아놓았습니다. (아직 인증을 못받아서 에러가 뜨긴 합니다)

🔍 변경 사항

  • 로그인페이지 생성
  • 카카오 로그인 링크

💬리뷰 요구사항 (선택사항)

@rhehfl rhehfl added the 🎨 Publish 마크업 & 스타일링 label Oct 20, 2024
@rhehfl rhehfl self-assigned this Oct 20, 2024
Comment on lines +5 to +9
const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${
import.meta.env.VITE_KAKAO_REST_API_KEY
}&redirect_uri=${import.meta.env.VITE_KAKAO_REDIRECT_URL}&response_type=code`;
return (
<>
Copy link
Collaborator

Choose a reason for hiding this comment

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

oauth할 때 형식이 다 동일해서 util함수로 만들어서 관리하면 좋을 것 같습니다.

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

넵 컴포넌트에 저런식으로 나열해놓는건 별로인거같긴 합니다 개인적으로는 api key와 redirect url 모두 고정적인 자원이니 카카오 url 전체를 그냥 env로 관리해도 괜찮을 것 같습니다

@zzzRYT
Copy link
Collaborator

zzzRYT commented Oct 20, 2024

참고로 OAuth사용 시 이미지에 대한 가리드라인을 준수해여 합니다. (그거 준수안하면 OAuth못씀)크기에 따라서 다운받은 이미지는 깨질 수 있으니. 가이드라인에 맞게 디자이너분에게 디자인을 요청하거나, 외부에 존재하는 이미지 큰 배율로 받아와서 사용하면 좋을 것 같습니다.

@rhehfl
Copy link
Collaborator Author

rhehfl commented Oct 20, 2024

image
그러네네요 이런 룰이 있는줄 몰랐습니다 리뷰 감사합니다!

@rhehfl rhehfl requested a review from ssi02014 October 21, 2024 03:50
@rhehfl rhehfl linked an issue Oct 21, 2024 that may be closed by this pull request
2 tasks
@@ -14,6 +15,7 @@ export default function Router() {
<Route path="/quest" element={<Quest />}></Route>
<Route path="/ranking" element={<Ranking />}></Route>
<Route path="/quiz/:section/:part" element={<Quiz />}></Route>
<Route path="/login" element={<Login />}></Route>
{/*어드민 페이지 부분 문제조회/추가 이외에 규모 확장 시 레포 분리 */}
<Route path="/admin" element={<Admin />} />
<Route path="/admin/create-quiz" element={<CreateQuiz />}></Route>
Copy link
Collaborator

Choose a reason for hiding this comment

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

이 부분 아까 같이 말씀 나눠봤지만 대문자든 소문자든 index든 해서 맞춰주면 좋을 것 같네용

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

확인했습니다 폴더명이 Quiz, login등등으로 코드 컨밴션을 정할때 같이 정했어야 했는데 이런 부분을 체크하지 못한 것 같습니다. 이 부분은 따로 노션에 정리 후 이슈 생성해서 고치도록 하겠습니다

@rhehfl rhehfl merged commit 6dab4af into develop Oct 22, 2024
@rhehfl rhehfl deleted the publish/#54/login_page branch October 22, 2024 03:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🎨 Publish 마크업 & 스타일링
Projects
None yet
Development

Successfully merging this pull request may close these issues.

login page
3 participants