nextjs에서 global font 적용하기
nextjs에서 글로벌로 font를 적용하는 방법을 두가지를 기록하려 합니다 1. local 환경에서 font 제공하기 public/fonts 경로에 font 파일을 넣어줍니다 저는 더페이스샵에서 만든 잉크립퀴드체를 사용하겠습니다 개인, 상업적용도로 사용할 수 있습니다 /styles/globals.css body { padding: 0; margin: 0; font-family: -apple-system, InkLipquid, sans-serif; } @font-face { font-family: "InkLipquid"; font-weight: 200; src: url("/fonts/InkLipquidFonts.ttf") format("truetype"); } 위 파일에 코드를 적어주면 폰트가 적용된걸 ..
nextjs에서는 typescript 를 즉시지원한다고 합니다 저는 typescript로 코딩하는걸 선호해서 적용하기로 하였습니다 아래의 코드를 console에서 입력합니다 touch tsconfig.json js 확장자를 tsx로 바꿔줍니다 yarn dev 명령어로 실행해보면 Please install typescript, @types/react, and @types/node 를 설치하라고 합니다 설치해주도록 합시다 yarn add --dev typescript @types/react @types/node 설치 후 yarn dev 명령어로 실행하면 자동으로 tsconfig.json 파일이 업데이트되면서 실행되는것을 확인할 수 있습니다
nextjs 시작하기
nextjs 공식문서를 참고하여 개인적으로 브랜드사이트를 만들어보려고 합니다 아래사이트에서 Docs를 클릭하면 nextjs의 공식문서를 참고할 수 있습니다 https://nextjs.org/ Next.js by Vercel - The React Framework Production grade React applications that scale. The world’s leading companies use Next.js by Vercel to build static and dynamic websites and web applications. nextjs.org 설치 npx create-next-app # or yarn create next-app 저는 yarn을 사용하기때문에 아래의 코드로 설치하였습니다..