본문으로 건너뛰기

코스 카탈로그

React 애플리케이션

실제 React와 TypeScript로 접근 가능하고 상태를 가진 인터페이스를 만드세요.

Koda의 오프라인 샌드박스에서 고정된 React 19로 실제 JSX와 TSX를 작성하고 실행합니다. 타입이 있는 컴포넌트, props와 children 조합, 상태와 제어 폼, effect와 오래된 응답 처리, 브라우저 히스토리 라우팅, DOM 단언 기반 동작 검증을 배웁니다. 실행 가능한 프로젝트 세 개는 소유권 규칙이 있는 접근 가능한 이슈 보드와 독립 포트폴리오 모드로 마무리됩니다.

미리보기 레슨으로 시작모든 요금제 비교

커리큘럼

  1. 섹션 1

    컴포넌트와 props

    타입 컴포넌트, 조합, 안정적인 key, 접근 가능한 의미 구조로 UI를 표현합니다.

    1. 첫 번째 실제 컴포넌트
    2. JSX는 UI를 설명합니다
    3. 타입이 있는 props는 계약입니다
    4. children으로 조합하기
    5. 목록, key와 의미 구조

  2. 섹션 2

    상태, 이벤트와 폼

    상태 스냅샷, 이벤트 핸들러, 제어 입력, 파생 값으로 상호작용을 모델링합니다.

    1. 상태는 스냅샷입니다
    2. 이벤트는 의도를 설명합니다
    3. 제어 폼
    4. 복제하지 말고 파생하세요

  3. 섹션 3

    Effect, 데이터와 복구

    외부 시스템을 동기화하고 모든 데이터 상태를 드러내며 오래된 작업이 이기지 못하게 합니다.

    1. effect는 React 밖을 동기화합니다
    2. 의존성과 정리
    3. 모든 데이터 상태는 UI입니다
    4. 오래된 응답 막기
    5. 렌더 실패에서 복구하기

  4. 섹션 4

    라우팅, 테스트와 전달

    탐색 가능한 레이아웃을 만들고 보이는 동작을 테스트하며 책임 있게 번들을 판단합니다.

    1. 히스토리 기반 라우팅
    2. 공유 레이아웃과 찾을 수 없음
    3. 보이는 동작 테스트하기
    4. 번들과 전달 판단

학습 경로

풀스택 웹 개발자

테스트를 거친 풀스택 React 앱을 만들고 공유합니다. 누구나 쓸 수 있는 화면, 소유자만 볼 수 있는 데이터, 제한이 명확한 API, 정확하게 유지되는 실시간 갱신, 그리고 되돌릴 수 있는 배포까지 갖춥니다.

코스 14개로 구성된 과정

레슨 하나를 체험하고 습관으로 이어가세요.

무료 체험 대상인 첫 가입 회원은 7일 무료 · 언제든 취소 가능

시작하기

코스 목록으로 돌아가기