[FEAT] Top-Nav 구현

[AAminha]

1️⃣ 요약

• Top-Nav(헤더바)를 구현합니다.
• resolved [FEAT] Top-Nav 구현 #3

3️⃣ 참고사항

• 로고를 클릭하면 메인페이지로 이동하도록 구현했습니다.
• TopNavigation은 fixed로 구현하여 스크롤할 때도 고정적으로 보이도록 구현했습니다.
• PlainButton 컴포넌트(피그마에서는 button이라고 되어있음)를 구현했습니다.
  • 모바일 버전에서의 SideNavigation의 '로그인', '마이페이지', '로그아웃' 버튼에 사용되었습니다.

• SmallButton 컴포넌트(피그마에서는 button-s라고 되어있음)를 구현했습니다.
  • TopNavigation의 메뉴 목록과 로그인 버튼에 사용되었습니다.

구현 화면

Vite.+.React.+.TS.-.Chrome.2024-04-29.19-28-20.mp4

Vite.+.React.+.TS.-.Chrome.2024-04-29.19-26-31.mp4

4️⃣ 추후 작업

• 마이페이지, 로그인, 로그아웃 버튼의 기능을 추가해야 합니다.
  • 로그인, 마이페이지 path가 정해지면 navigate(path)로 추가하면 될 것 같습니다.
  • 로그아웃 기능을 추가해야 합니다.
• 로그인 여부에 따라 버튼이 다르게 보여지도록 구현해야 합니다.
  • 로그인 로직이 완성되면 작업해야 할 것 같습니다.

[mungjin01]

LGTM 수고하셨습니다!!