전체 글

meta 태그 태그는 HTML 문서의 사이에 입력하는 특수 태그로서 해당 문서에 대한 정보인 메타데이터(metadata)를 정의할 때 사용합니다.viewport - 반응 형 웹 구현Keywords - 검색엔진에 의해 검색되는 단어 지정Description - 검색 결과에 표시되는 문자 지정author - 웹 페이지의 소유자(또는 회사) 작성  OpenGraph오픈그래프는 웹페이지가 소셜 미디어 또는 오픈그래프를 활용한 사이트로 공유될때 사용되어지는 정보이다. 기본적으로 설정해야하는 og 메타태그 Naver 블로그, 카카오톡 미리보기 설정  트위터 미리보기 설정  모바일 앱 미리보기 설정    Next.js에서 meta 태그 적용하기 정적 메타 태그개인적으로 Layout에서 화면 구성을 하고..

파비콘(favicon)이란?즐겨찾기 아이콘. 즐겨찾기(favorites)와 아이콘(icon)의 합성어로, 인터넷 웹 브라우저의 주소 창에 표시되는 웹사이트나 웹페이지를 대표하는 아이콘이다. 일반적으로 16*16 사이즈로 만들지만 디바이스가 다양해진 만큼 다양한 크기의 아이콘을 만드는 것이 좋다. 그 아이콘은 웹 브라우저 상단에 있는 탭에 표시되기도 하며 브라우저의 북 마크바 나 방문 기록, 검색 결과에서 페이지 url과 함께 표시되기도 한다.  파비콘 만드는 추천 사이트  Favicon & App Icon GeneratorUpload an image (PNG to ICO, JPG to ICO, GIF to ICO) and convert it to a Windows favicon (.ico) and App..

emotion은 css-in-js (JavaScript코드에서 CSS를 작성하는 방식) 라이브러리 중 하나로 다음의 특징이있다.자동적으로 vendor-prefix 를 붙여준다.기본적으로 고유한 이름을 생성한다.JavaScript와 CSS사이에 상수와 함수를 쉽게 공유할 수 있다.React 스타일 컴포넌트로 사용할 수 있는 것CSS 로드 우선 순위 이슈를 해결할 수 있다javascript runtime에서 필요한 CSS를 동적으로 만들어 적용한다. 패키지 설치 npm install --save @emotion/react// styled 방식 사용할시npm install --save @emotion/styled// 스타일을 압축하고 끌어 올려 스타일을 최적화하고 // 소스 맵과 레이블을 사용하여 더 나은 개..