Skip to content

모바일 헤더를 처리하는 방식 변경 #70

Open

Description

@constmoon

Why

  • 웹사이트 상단 헤더바의 메뉴를 클릭하여 페이지 이동을 할 때마다 헤더가 깜빡이는 경험을 받았다.

Todo

  • 현재 웹사이트에서는 window width에 따라 데스크탑 헤더와 모바일 헤더를 분기처리하여 보여주고 있다.
  • Header component 로드시 브라우저 너비를 계산하는 방식이 원인이므로 다른 방식으로 모바일 기기를 인지할 수 있으면 좋겠다.

Activity

  1. Climier-code commented on Jan 2, 2022

    @Climier-code
    Contributor

    헤더가 깜빡거리는 현상은 모든 page들에 Header, PyconLogo, Footer 컴포넌트가 추가되어있어 페이지가 이동하면서 이것들 또한 새로 그려지게 되므로 깜빡거리는 현상이 발생하였습니다.

    Resolve

    • _app.tsx를 제외한 나머지 컴포넌트에서 Header, PyconLogo, Footer 컴포넌트를 삭제하여 DefaultLayout으로 변경하였습니다.

    Result

    • 바뀌지 않는 것들에 대한 깜빡거리는 이슈 해결
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions