시작하기

이 페이지는 React 문서 및 관련된 리소스의 개요입니다.

React는 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리입니다. 홈페이지자습서에서 React에 대한 모든 것을 알아보세요.


React 시도해보기

React는 처음부터 점진적으로 적용할 수 있도록 설계되었으며 필요한 만큼 React를 사용할 수 있습니다. React를 맛보기로 접해보거나 간단한 HTML 페이지에 약간의 대화형 기능(interactivity)을 추가하거나 복잡한 React 기반의 앱을 시작하고자 하는 경우, 이 섹션의 링크를 통해 시작할 수 있습니다.

온라인 플레이그라운드

React를 사용하는데 관심이 있다면, 온라인 코드 편집기를 사용할 수 있습니다. CodePen 이나 CodeSandbox 혹은 Glitch에서 Hello World 템플릿을 사용해 보세요.

여러분이 사용하고 있는 코드 편집기를 사용하길 원한다면, 이 HTML 파일을 다운로드하고 편집한 다음 브라우저의 로컬 파일 시스템에서 열 수도 있습니다. 런타임 코드 변환이 느리므로 간단한 데모에만 이 코드를 사용하는 것이 좋습니다.

웹사이트에 React를 추가하기

1분 안에 HTML 페이지에 React를 추가할 수 있습니다. 그리고 조금씩 React의 비중을 늘리거나 몇 개의 동적 위젯에 포함할 수 있습니다.

새 React 앱 만들기

React 프로젝트를 시작한다면 스크립트 태그를 사용한 간단한 HTML 페이지를 만드는 것이 최고의 방법일 것입니다. 설치하는 데 1분밖에 걸리지 않습니다!

그러나 애플리케이션이 커진다면 보다 통합된 설정을 고려하는 것이 좋습니다. 대규모 애플리케이션에 권장되는 여러 개의 JavaScript 툴체인들이 있습니다. 각 툴체인은 많은 설정 없이 작동할 수 있고 풍부한 React 에코시스템을 최대한 활용할 수 있습니다.

React 배우기

사람들은 다양한 배경과 다른 학습 스타일을 가지고 React에 입문합니다. 이론적인 접근 방식을 선호하는 사람들과 실용적인 접근 방식을 선호하는 사람들 모두에게 이 섹션이 도움되길 바랍니다.

  • 직접 구현해보면서 학습하는 것을 원하시는 경우, 실용적인 자습서부터 시작하세요.
  • 개념을 차근차근 익히며 학습하는 것을 원하시는 경우, 주요 개념 가이드부터 시작하세요.

다른 낯선 기술과 마찬가지로 React는 러닝 커브(learning curve)가 있습니다. 약간의 인내심을 가지고 연습하면, React에 대한 요령을 익힐 수 있습니다.

첫 번째 예시

React 홈페이지에는 라이브 편집기와 함께 제공되는 몇 가지 React 예시가 있습니다. React에 대해 전혀 모르더라도 코드를 변경하면서 그것이 결과에 어떤 영향을 미치는지 보실 수 있습니다.

입문자를 위한 React

React 문서가 어렵게 느껴진다면, Tania Rascia가 쓴 React 개요를 먼저 보고 오시는 것이 좋습니다. 위 글은 가장 중요한 React 개념들을 자세하고 입문자도 쉽게 이해할 수 있도록 소개합니다. 그다음에 이 문서를 다시 봐주세요!

디자이너를 위한 React

디자인 분야에서 일하고 있다면 이 리소스가 시작하기 좋습니다.

JavaScript 리소스

React 문서는 Javascript 프로그래밍에 익숙한 사람을 대상으로 쓰여져 있습니다. 전문가일 필요는 없지만, React와 JavaScript를 동시에 배우기는 어렵습니다.

이 JavaScript 개요를 읽고 여러분의 Javascript 수준을 확인하는 것을 권장합니다. 30분에서 1시간 정도 걸리겠지만 React를 익히는 데에 더 자신감이 생길 것입니다.

JavaScript 내용이 혼동될 때마다, MDNjavascript.info는 참고하기 좋은 웹사이트입니다. 또한, 문의를 할 수 있는 커뮤니티 지원 포럼도 있습니다.

실용적인 자습서

직접 구현해보면서 학습하는 것을 원하시면, 실용적인 자습서을 살펴보세요. 본 자습서에서는 React로 tic-tac-toe 게임을 만들어 봅니다. 게임 제작에는 관심이 없어서 이 자습서를 건너뛰고 싶은 마음이 들지도 모릅니다. 하지만 조금만 기다려 보세요. 자습서에서 학습하는 기술은 대부분의 React 앱을 구축하는 데 있어 기본이며, 이를 완전히 익히면 훨씬 더 깊은 이해할 수 있습니다.

단계별 가이드

개념을 단계별로 배우려면 주요 개념 가이드를 시작하는 것이 가장 좋습니다. 모든 다음 장은 앞 장에 소개된 지식을 바탕으로 하기 때문에, 천천히 따라가기만 한다면 개념을 놓치지 않고 습득할 수 있습니다.

React에 대해 생각해 보기

많은 React 사용자는 React에 대해 생각해보기를 읽는 것을 React를 마지막으로 이해하는 것으로 생각합니다. 이것은 아마 가장 오래된 React 문서이지만 여전히 유용합니다.

사람들은 때때로 공식 문서보다 타사 책과 비디오 강좌가 더 도움이 된다고 생각합니다. 우리는 일반적으로 권장되는 리소스 목록을 유지하며, 이 중 일부는 무료입니다.

고급 개념

주요 개념에 익숙해지고 React를 더 많이 다루게 되면 보다 고급 주제에 관심을 가지게 될 것입니다. 이 섹션에서는 contextrefs와 같이 강력하지만 일반적으로 사용되지는 않는 React 기능을 소개합니다.

API 참조

이 문서 섹션은 특정 React API를 자세히 알아보고 싶을 때 유용합니다. 예를 들어, React.Component API 참조에서는 setState()의 작동 방식과 각 상황에 알맞는 생명주기 메서드를 알 수 있습니다.

용어 사전과 FAQ

용어 사전에는 React 문서에 나타나는 가장 일반적인 용어의 개요가 포함되어 있습니다. 또한 AJAX 요청 만들기, 컴포넌트 상태, 파일 구조 등 일반적인 주제에 대한 짧은 질문과 답변을 전문으로 하는 FAQ 섹션도 있습니다.

최신 React 소식

React 블로그는 React 팀의 업데이트에 대한 공식 소스입니다. 릴리즈 노트 또는 사용 자제 공지를 포함한 중요한 내용이 먼저 게시됩니다.

트위터의 @reactjs 계정을 팔로우할 수도 있지만, 블로그만 읽어도 꼭 알아야 하는 정보는 놓치지 않을 수 있습니다.

모든 React 릴리즈가 자체 블로그 게시물을 사용할 만한 것은 아니지만 릴리즈 페이지와 React의 CHANGELOG.md 파일에서 모든 릴리즈에 대한 자세한 변경 기록을 확인할 수 있습니다.

버전 관리된 문서

이 문서는 항상 안정된 최신 버전의 React를 반영합니다. React 16부터는 이전 버전의 문서를 별도의 페이지에서 찾을 수 있습니다. 이전 버전의 문서는 릴리즈 시점에 스냅샷으로 작성되며 지속적으로 업데이트되지 않는다는 점에 유의하세요.

빠진 항목이 있다면?

이 문서에서 빠진 부분이나 혼동되는 부분을 발견하시면, 개선을 위한 제안과 함께 문서의 레퍼지토리에 이슈를 올려주시거나, @reactjs 계정에 tweet 해주세요. 여러분의 참여를 기다립니다!