조각조각/Next.js
-
[Next.js와 친해지기] 2. 서버 컴포넌트와 클라이언트 컴포넌트조각조각/Next.js 2024. 4. 18. 23:37
💬 잊지 말자 서버 컴포넌트!!! 많은 경우의 수를 만나봐야 서버와 클라이언트의 구분이 명확해질 것 같다는 생각이 들었다. 📑 Next.js의 컴포넌트 API Next.js의 기본 컴포넌트는 서버 컴포넌트이다. 클라이언트 컴포넌트를 사용하려면 컴포넌트 최상단에 'use client' 선언이 필요하다. 단, 클라이언트 컴포넌트는 '서버 + 클라이언트'의 하이브리드 컴포넌트로 이해해야 한다. 클라이언트 컴포넌트를 사용해야 하는데 'use client' 선언이 없다면 에러가 표시된다. 📑 Next.js의 컴포넌트 구분 서버 컴포넌트 API 특징 : 보안, 캐싱, 성능 SEO 등의 이점 cookies / headers / redirect ... 클라이언트 컴포넌트 API 특징 : 유저와의 상호작용, 브라우저 A..
-
[Next.js와 친해지기] 1. 설치 및 초기 설정조각조각/Next.js 2024. 4. 17. 23:01
👀 2주간 Next.js 강의가 진행된다. Next.js를 써본 적이 없어서 배운 부분까지는 어떻게든 프로젝트 때 원활하게 사용하자!(물론 Next를 안쓸 수도 있겠지만)라는 목표를 잡고 수업에 임했다. 오늘은 그 첫 번째로 설치 및 초기 설정에 대해 기록한다. 1. 설치 1-1) 설치 명령어 가장 기본적인 설치 명령어는 프로젝트 이름을 같이 입력해서 열어둔 폴더 안에 새로운 폴더를 생성하여 설치한다. npx create-next-app@latest [프로젝트명] 만약 열어둔 폴더 안에 바로 설치하고 싶다면 . 키워드를 사용하자. npx create-next-app@latest . 1-2) 프로젝트 설정 ✔ Would you like to use TypeScript? … Yes # 타입스크립트 사용 여부..