search

YU-Quiz / web

front(react)
2 stars 0 forks source link

feat: 모든 페이지 공통 상단바 구현 #65

Closed sernan96 closed 1 week ago

sernan96 commented 1 week ago

개요

공통 상단바 컴포넌트를 정식 구현하고, 카카오 로그인 콜백 처리 코드를 간소화했습니다.

구현 사항

  1. 공통 상단바(Header.jsx) 구현

    • 기존 상단바 구조를 개선하고, styled-components를 사용하여 디자인 통일성 확보
    • 로그인 상태에 따라 "로그아웃🔒"과 사용자 프로필 아이콘이 표시되도록 수정
    • 오른쪽 벽에 프로필과 로그아웃 버튼을 고정 배치

  2. 네비게이션 링크 구성: 홈, 마이페이지, 퀴즈, 커뮤니티, 리더보드, 퀴즈 시리즈, 스터디

    • 스크롤바 숨김 처리를 추가하여 UI 개선

  3. 카카오 로그인 콜백 간소화 (kakaoLoginCallback.jsx)

    • 에러 메시지 표시 및 로그인 페이지로 돌아가는 기능 삭제
    • 로그인 처리 중 메시지만 간단하게 표시

이미지

로그인 상태 image

로그아웃 상태 image

기타

카테고리도 로그인 후에 보이도록 수정할 지 아니면 그정도는 그냥 둘지 고민입니다.