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.

Sign up for GitHub

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

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

Open

constmoon opened this issue Oct 1, 2021 · 1 comment

Contributor

constmoon commented Oct 1, 2021

Why

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

Todo

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

Member

Climier-code commented Jan 2, 2022 •

edited

Loading

헤더가 깜빡거리는 현상은 모든 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