[Next.js] Page Router? Next.js에서 클릭 몇 번이면 끝난다고! 1탄

Next.js를 쓰다 보면 "어? 이건 어떻게 하지?" 싶은 순간들이 있습니다. 이번에는 네비게이션, 프리패칭, 그리고 레이아웃 설정을 쉽게 이해할 수 있도록 정리해볼게요. 어렵게 생각하지 말고 가볍게 읽어주세요!01네비게이션페이지를 쉽게 이동하는 방법, 한번 알아볼까요?Next.js에서 페이지 이동은 정말 간단합니다. Link 컴포넌트와 useRouter 훅만 기억하면 됩니다.import "@/styles/globals.css";import type { AppProps } from "next/app";import Link from "next/link";import { useRouter } from "next/router";export default function App({ Component, page..

• format_list_bulleted Next.js
• · 2025. 1. 22.
• textsms

[Next.js] React의 찐친 확장판?

01Next.js 란 무엇인가?Next.js는 React.js의 확장판 느낌이 물씬 나는 프레임워크입니다.“라이브러리가 아니라고?” 맞아요, 프레임워크예요. 이게 왜 중요하냐면, 개발자와 코드의 관계가 완전히 달라집니다.라이브러리 vs 프레임워크: 누가 더 자유로울까?프레임워크는 이렇게 말하죠:“내가 틀을 다 정해놨으니 너는 그 안에서 놀아. 내가 다 해줄게!”덕분에 모든 기능이 기본 제공되지만, 대신 자유도는 낮아집니다.반면 라이브러리는:“자, 이거 쓰고 싶은 대로 써. 네 마음대로 만들어봐!”자유도는 최고지만, 대신 직접 만들어야 할 게 많습니다.Next.js는 이 프레임워크의 특성을 활용해 사전 렌더링 같은 고급 기술을 쉽게 사용할 수 있도록 만들어졌습니다.02사전 렌더링: CSR의 단점을 극복한 ..

• format_list_bulleted Next.js
• · 2025. 1. 17.
• textsms