개발환경과 컴포넌트(JSX)

학습 목표

이 영상을 통해 React 개발의 기초가 되는 JavaScript ES6+ 문법의 핵심 개념과 React의 기본 구조 및 특징을 이해하고, 컴포넌트 기반 아키텍처의 중요성을 파악할 수 있습니다.

핵심 개념

• ES6+ 문법: 화살표 함수, 구조 분해 할당, 스프레드 연산자, 템플릿 리터럴, 기본 매개변수, 클래스, 모듈(import/export), async/await 등 React 개발에 필수적인 ES6+ 문법을 복습하고 활용 방법을 익힙니다.
• React의 등장 배경: 기존 웹 개발 방식(JSP 등)의 한계를 이해하고, SPA(Single Page Application) 개발을 위한 라이브러리로서 React가 왜 등장했는지, 그리고 그 장점은 무엇인지 알아봅니다.
• 컴포넌트 기반 아키텍처: UI를 재사용 가능한 컴포넌트로 나누어 개발하는 React의 핵심 방식과 데이터 관리 및 UI 렌더링의 관계를 이해합니다.
• React의 특징: 선언형 프로그래밍, 컴포넌트 기반, Virtual DOM 등의 React 주요 특징을 살펴봅니다.
• SPA vs MPA: 클라이언트 사이드 렌더링(CSR)과 서버 사이드 렌더링(SSR)의 차이를 이해하고, React가 SPA 구현에 어떻게 활용되는지 배웁니다.

공부 방향성

본 영상은 React 학습의 선수 지식인 JavaScript ES6+ 문법을 다루고 React의 기본 개념을 소개합니다. 영상 시청 전 ES6+ 문법에 대한 기본적인 이해가 있다면 학습 효과를 높일 수 있습니다. 영상 시청 후에는 React의 컴포넌트 구조를 직접 만들어보고, JSX 문법을 활용한 UI 개발을 연습하며 다음 단계 학습을 준비하시기 바랍니다.