Skip to content

Conversation

@leeunduck
Copy link
Collaborator

요구사항

기본

  • 아래로 스크롤 해도 상단 네비게이션 바(Global Navigation Bar)가 최상단에 고정됩니다
  • “판다마켓" 클릭 시 루트 페이지(“/”)로 이동합니다. (새로고침)
  • SNS 아이콘들은 클릭시 각각 아래 페이지로 이동합니다.
- “https://www.google.com/”,
-https://www.kakaocorp.com/page/”
  • 로그인 페이지, 회원가입 페이지 모두 로고 위 상단 여백이 동일합니다.
  • “회원 가입”버튼 클릭 시 “/signup” 페이지로 이동합니다.
  • “로그인”버튼 클릭 시 (“/login”) 페이지로 이동합니다.

심화

  • palette에 있는 color값들을 css 변수로 등록하고 사용합니다.
  • 비밀번호 input 요소 오른쪽에 눈모양 아이콘을 추가합니다.
(추후 클릭으로 비밀번호를 보거나 가릴 수 있도록 기능을 만들어 갈 예정입니다.)

주요 변경사항

  • 멘토님의 리뷰를 반영했습니다!
  • 로그인페이지 & 회원가입 페이지를 완성했습니다!
  • 네비게이션이 상단에 고정됩니다!

스크린샷

스크린샷 2025-05-16 00 51 34
스크린샷 2025-05-16 00 51 47

멘토에게

  • 다행히 이미지를 모두 교체해서 다시 랜딩페이지를 구축했습니다 ☺️ (힘들었어요 ㅠ)
  • 이전 5번 6번을 제대로 구현못했었는데 제가 제대로 이해했는지 다시한번 봐주시면 감사하겠습니다!
  • CSS적인 면에서 뭔가 class나 id가 너무 많아지는 것 같아 css파일 안에서 구조의사클래스로 진행하였습니다.
    이런 판단은 어떻게 하면 좋을지 궁금합니다!

Copy link
Collaborator

@dongqui dongqui left a comment

Choose a reason for hiding this comment

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

현석님.. 거의 두 가지 미션을 한 번에 처리하신 격이네요 🤣 고생 많으셨습니다!!
시멘틱, 표준HTML에 조금만 더 신경 써주시면 더욱 좋을 거 같습니다 :)

이전 5번 6번을 제대로 구현못했었는데 제가 제대로 이해했는지 다시한번 봐주시면 감사하겠습니다!
-> 헤더 로고와 로그인 버튼의 경우 처음부터 패딩이 들어가는 것이 아니라 1920px 보다 작아질 때 부터 간격을 유지하는 것이 요구 사항입니다 :) (우선은 그냥 두셔도 괜찮을 거 같아요~!)

CSS적인 면에서 뭔가 class나 id가 너무 많아지는 것 같아 css파일 안에서 구조의사클래스로 진행하였습니다.
이런 판단은 어떻게 하면 좋을지 궁금합니다!

-> 프로젝트 성격에 따라 다를 거 같습니다! 간단하게 뚝딱뚝딱 만든다면 지금 처럼 작성하셔도 괜찮지만, 프로젝트가 계속 커진다면 재사용하기가 어려워 지겠죠!

공통 UI스타일, 혹은 유틸리티 클래스를 따로 정의하거나 컴포넌트화를 한다면, 처음에는 작성 코드가 많겠지만 이후 부터는 계속 재사용 가능합니다. 자연스레 새로 정의하는 클래스 수도 줄어들게 됩니다 :)

</a>
</div>
</nav>

Copy link
Collaborator

Choose a reason for hiding this comment

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

로그인 버튼 weight이 안 맞네요 🤣

<p class="section-content">상품을 검색하세요</p>
</span>
<span>
<p class="section-subtext">구매하고 싶은 물품은 검색해서</p>
Copy link
Collaborator

Choose a reason for hiding this comment

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

image
디자인 시안을 다시 확인해 주세요 :)

@dongqui dongqui merged commit b87e093 into codeit-bootcamp-frontend:Basic-이현석 May 19, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants