한눈에

Next.js 메뉴 아래에서 보는 React 기초입니다.

한 줄로

React는 화면 조각을 만드는 라이브러리다. Next.js는 그 조각에 주소, 서버 렌더, 데이터 저장을 붙이는 프레임워크다. 같은 일이 아니다.

Next.js 페이지 파일 안에 적는 화면은 React 컴포넌트다. 그래서 Next.js를 따라가려면 컴포넌트, JSX, props, useState는 여기서 같이 본다.

시작 전에

  • HTML로 제목, 문단, 버튼, 입력, 목록을 만들 수 있다.
  • JavaScript 함수, 배열, 객체, =>를 읽을 수 있다.

클래스 컴포넌트, Create React App, Redux는 이 강좌에 없다. Next.js 16이 쓰는 것은 함수 컴포넌트다.

이 묶음에서 다루는 것

단원 내용
컴포넌트·JSX 함수로 화면을 나누고, props로 값을 넘긴다
상태·이벤트 useState, 클릭, 입력값
목록·조건 map, key, 있을 때만 그리기
Next.js에서 서버 컴포넌트와 'use client' 중 어디에 두는지

주소와 데이터 조회는 Next.js 강좌로 돌아간다. 이 강좌는 그 파일 안에 들어가는 React만 다룬다.