Web

    Next.js - with Redux thunk

    Next.js - with Redux thunk

    이번에는 Next.js에서 전역으로 상태 관리를 하는법이 React와 다른거 같길래 너무너무 궁금해서 한번 조사하고 예시코드를 작성해보도록 하겠다. 참고는 https://github.com/vercel/next.js/tree/canary/examples/with-redux-thunk GitHub - vercel/next.js: The React Framework The React Framework. Contribute to vercel/next.js development by creating an account on GitHub. github.com 또한 공식 문서 https://github.com/kirill-konshin/next-redux-wrapper next-redux-wrapper를 참고하였..

    Next.js - Static File Serving

    Next.js는 정적 파일을 제공합니다. 'public'아래에 있는 폴더를 이용하면 됩니다. 'public'폴더 아래에 있는 파일들은 '/'을 통해 접근 가능합니다. import type { ReactElement } from "react"; import type { NextPageWithLayout } from "../_app"; import styles from "../../scss-styles/HomePage.module.scss"; import Image from "next/image"; import profilePic from "../../public/happy.jpg"; const Home: NextPageWithLayout = () => { return ( My Homepage Welcome..

    Next.js - Font Optimization

    기본적으로 Next.js는 빌드 시 자동으로 인라인 글꼴 CSS를 사용하여 글꼴 선언을 가져오는 추가 라운드 트립을 제거합니다, ㄷ따라서 첫 번째 내용물 페인트(FCP)와 최대 내용물 페인트(LCP)가 개선됩니다. HTML 태그 태그는 해당 문서와 외부 소스(external resource)사이의 관계를 정의할 때 사용합니다. 요소는 빈 태그이며, 속성만을 포함합니다. 또한, 이 요소는 ) } } export default MyDocument