이 상품은 구매 후 지원 기기에서 예스24 eBook앱 설치 후 바로 이용 가능한 상품입니다.
|
0장 준비하기0.1 타입스크립트0.2 (실습) Node.js와 npm 설치하기0.3 (실습) VS Code 설치하기0.4 마치며1장 Next.js 소개1.1 리액트와 Next.js 1.2 CSR vs SSR1.3 SSG1.4 Next.js 탄생 배경1.5 마치며2장 Next.js 시작하기2.1 (실습) 직접 Next.js 앱 생성하기2.2 (실습) create-next-app을 사용해서 Next.js 앱 생성2.3 (실습) 글로벌 스타일 설정 및 ESLint 규칙 변경2.4 마치며3장 라우팅3.1 라우팅 기초3.2 페이지스 라우터3.3 앱 라우터3.4 링크와 내비게이션3.5 (실습) 라우트 구성하기3.6 (실습) 병렬 라우트 사용하기3.7 (실습) 인터셉팅 라우트 사용하기3.8 마치며4장 페이지와 레이아웃4.1 페이지4.2 레이아웃4.3 템플릿4.4 메타데이터4.5 (실습) 루트 레이아웃 만들기4.6 (실습) Feed 레이아웃 만들기4.7 (실습) 템플릿 적용해보기4.8 (실습) 정적 메타데이터 사용해보기4.9 (실습) 동적 메타데이터 사용해보기4.10 (실습) 동적으로 Open Graph 이미지 생성하기4.11 마치며5장 라우트 핸들러5.1 페이지스 라우터의 API 라우트5.2 앱 라우터의 라우트 핸들러5.3 라우트 핸들러 사용 예시5.4 (실습) 라우트 핸들러를 활용하여 API 만들어보기5.5 마치며6장 미들웨어6.1 미들웨어란6.2 Next.js의 미들웨어6.3 (실습) 미들웨어 사용해보기6.4 마치며7장 데이터 페칭7.1 fetch7.2 서버 액션7.3 (실습) 서버에서 데이터 받아오기7.4 (실습) 서버 액션 사용하기7.5 마치며8장 SWR8.1 SWR 소개 및 역할8.2 데이터 페칭8.3 뮤테이션과 재검증8.4 (실습) SWR 사용하기8.5 마치며9장 렌더링9.1 렌더링 기초9.2 서버 컴포넌트9.3 클라이언트 컴포넌트9.4 서버와 클라이언트 컴포지션 패턴9.5 엣지 런타임과 Node.js 런타임9.6 (실습) 서버 컴포넌트 사용해보기9.7 마치며10장 캐싱10.1 리퀘스트 메모이제이션10.2 데이터 캐시10.3 풀 라우트 캐시10.4 클라이언트 사이드 라우터 캐시10.5 캐시 상호작용10.6 캐싱 관련 API10.7 캐싱 요약10.8 (실습) 캐싱 동작 확인하기10.9 마치며11장 스타일링11.1 CSS 모듈과 글로벌 스타일11.2 Tailwind CSS11.3 CSS-in-JS11.4 Sass11.5 (실습) Tailwind CSS 사용하기11.6 마치며12장 최적화12.1 이미지 최적화12.2 폰트 최적화12.3 스크립트 최적화12.4 지연 로딩12.5 정적 애셋12.6 (실습) 이미지 최적화 적용하기12.7 (실습) 폰트 최적화 적용하기12.8 (실습) 지연 로딩 적용하기12.9 마치며13장 설정하기13.1 next.config.js 파일13.2 환경변수 설정13.3 (실습) 환경변수 사용해보기13.4 (실습) Redirect 적용하기13.5 (실습) Rewrite 적용하기13.6 마치며 14장 테스트14.1 프론트엔드 테스트 종류14.2 Vitest14.3 Jest14.4 Playwright14.5 Cypress14.6 (실습) Jest로 테스트하기14.7 (실습) Playwright로 테스트하기14.8 마치며15장 빌드와 배포15.1 빌드의 개념15.2 Next.js 애플리케이션 빌드15.3 (실습) Next.js 애플리케이션 빌드해보기15.4 마치며16장 미니 프로젝트16.1 미니 커뮤니티 기획하기16.2 (실습) Next.js 애플리케이션 생성하기16.3 (실습) 폴더 구성하기16.4 (실습) 페이지 생성하기16.5 (실습) 라우트 구성하기16.6 (실습) Shadcn UI 및 Tailwind CSS 연동하기16.7 (실습) 데이터베이스 설계하기16.8 (실습) Turso 데이터베이스 생성하기16.9 (실습) Drizzle ORM 연동 및 데이터베이스 스키마 생성16.10 (실습) NextAuth 연동하기16.11 (실습) 라우트 핸들러로 API 만들기16.12 (실습) 클라이언트 API 호출을 위한 함수 구현하기16.13 (실습) SWR 연동하기16.14 (실습) 헤더 컴포넌트 구현하기16.15 (실습) 라우트 그룹을 사용하여 여러 루트 레이아웃 구현하기16.16 (실습) SignInPage 구현하기16.17 (실습) SignUpPage 구현하기 16.18 (실습) MainPage 구현하기16.19 (실습) PostWritePage 구현하기16.20 (실습) PostViewPage 구현하기16.21 (실습) 미들웨어 만들기16.22 (실습) 로컬에서 애플리케이션 작동 테스트16.23 (실습) Vercel 배포하기
|
이인제의 다른 상품
|
이 책은 Next.js를 처음 접하는 독자도 실습을 통해 자연스럽게 기본기를 쌓을 수 있도록 구성했다. 단순히 기능을 나열하는 것이 아니라 개발의 흐름을 따라가며 왜 필요한지, 어떻게 작동하는지를 이해할 수 있도록 돕는다.개발 환경 설정부터 차근차근Node.js, VS Code 설치부터 타입스크립트 기초까지, 웹 개발을 처음 시작하는 독자도 무리 없이 따라올 수 있도록 준비 과정을 자세히 다룬다.Next.js의 핵심 개념을 체계적으로 학습CSR, SSR, SSG 같은 렌더링 방식부터 파일 기반 라우팅, 데이터 페칭, API 작성까지 Next.js의 핵심 기능을 직접 실습하며 익힐 수 있도록 구성했다.실습 위주 구성설명에 그치지 않고 모든 내용을 실습을 통해 바로 확인할 수 있도록 구성되어 Next.js의 다양한 기능을 자연스럽게 습득할 수 있다.기초부터 실전 프로젝트까지기본기를 다진 후에는 하나의 완성된 웹 애플리케이션을 만드는 프로젝트를 통해 지금까지 배운 내용을 종합적으로 활용해볼 수 있다.★ 대상 독자이 책은 Next.js를 처음 배우려는 모든 개발자를 대상으로 한다. 리액트 기초 지식을 갖춘 독자라면 더욱 쉽게 접근할 수 있으며 다음과 같은 분들에게 특히 적합하다.● 리액트 기반 웹 개발을 더 체계적으로 배우고 싶은 개발자● Next.js를 이용해 SSR, SSG를 적용한 SEO 최적화 웹사이트를 구축하고 싶은 개발자● Next.js를 이용해 직접 웹 애플리케이션을 만들어 보고 싶은 분● Next.js를 활용한 실무 프로젝트 경험을 쌓고 싶은 프론트엔드 개발자★ 이 책의 구성이 책은 크게 네 부분으로 나눌 수 있으며 각 장은 Next.js의 핵심 개념부터 실전 활용까지 단계적으로 학습할 수 있도록 구성되어 있다.웹 개발의 첫걸음, Next.js와의 첫 만남(0~2장)Next.js를 배우기 위한 준비 단계로 타입스크립트의 기본 개념을 간단히 익히고 Node.js와 npm 그리고 VS Code를 설치하여 개발 환경을 설정한다. 이어 리액트와 Next.js의 관계를 이해하고 CSR, SSR, SSG와 같은 렌더링 방식의 차이를 살펴본다. Next.js의 탄생 배경을 통해 프레임워크의 필요성을 배우고 직접 Next.js 프로젝트를 생성하며 기본 폴더 구조를 익히는 실습을 진행한다.Next.js를 이해하는 가장 빠른 길, 라우팅의 세계로(3~5장)Next.js의 핵심인 라우팅 시스템을 본격적으로 학습한다. 먼저 폴더 구조를 기반으로 하는 전통적인 페이지스 라우터를 익히고 최신 앱 라우터의 개념과 사용법을 실습한다. 동적 라우트, 병렬 라우트, 인터셉팅 라우트 등 다양한 라우팅 기법을 단계별로 체험하며 Next.js의 기본적인 작동 원리와 페이지 구성 방식을 익힌다.Next.js의 진짜 힘을 경험하다, 실전 기능 마스터(6~15장)실제 서비스 개발에 필요한 다양한 기능을 익혀본다. 서버와 클라이언트 컴포넌트를 구분하고 미들웨어를 이용해 요청 흐름을 제어하는 방법을 학습한다. 다양한 렌더링 전략(SSR, SSG, ISR )을 적용해 사이트 성능을 높이고, 메타데이터 설정을 통해 SEO를 강화하는 방법도 익힌다. 데이터베이스 연동, 사용자 인증, 파일 최적화 등 실무에 필요한 기술을 차근차근 쌓아나간다.Next.js 웹 애플리케이션 구축하기(16장)지금까지 배운 내용을 종합해 Next.js로 실제 웹 애플리케이션(미니 커뮤니티 사이트)을 만드는 프로젝트를 진행한다. 동적 라우트, 데이터 연동, 서버 기능 통합을 실습하며 하나의 완성된 서비스를 직접 구축해본다. 이 과정을 통해 Next.js를 활용한 실전 개발 역량을 자연스럽게 체득할 수 있다.
|