찰리의 이야기

Next.js 카카오맵 구현 구현하려는 웹에 카카오맵을 사용하려고 문서를 보고 실행해보았습니다. 그 과정에서 맞딱뜨린 여러 문제들과 해법들을 기록합니다. 닥히 Next.js의 케이스가 아닌 경우도 있습니다. 1. 꽉찬화면 height='100%' 지도의 전체화면이 안먹는 것입니다. width는 100%가 적용되는데, 아무리 부모 엘리먼트들의 높이를 100%로 주더라도 지도가 커지지 않습니다. 그러다가 발견한 해결책 'vh' vh란 viewport height를 말합니다. 그럼 뷰포트(viewport)란 뭘까요. 웹 브라우저의 현재 창에서 볼 수 있는 부분을 말합니다. 뷰포트가 의미있는 이유는 다양한 모바일 기기가 많은 현재, 현재의 모바일 브라우저의 화면 크기를 비율로 설정할 수 있기 때문에 유연하게 대..

Nest.js Script Component 스크립트 컴포넌트 본 글은 Next.js 문서를 번역한 글입니다. 원글 : https://nextjs.org/docs/basic-features/script 오역이 있다면 알려주세요. Script component 스크립트 컴포넌트 Next.js의 스크립트 컴포넌트는 개발자들이 third-party script 들의 로딩(loading) 우선순위를 설정할수 있어서 개발자의 시간을 절약하고 로딩 성능을 향상 시킬 수 있습니다. 웹사이트들은 종종 분석툴, 광고, 고객지원 위젯, 그리고 동의 관리 같은 것들을 위해 third-party script들을 필요로 합니다. 그러나, 이런 스크립트들은 로딩 성능에 부담을 주는 경향이 있고, 사용자 경험을 저하시킬 수 있습니..