데이터가 변하면 화면이 알아서 맞춰지는 인터페이스 작성법
복잡한 화면을 직접 조작하지 않고, 데이터 상태만 정의하면 화면이 알아서 맞춰지도록 코드를 작성할 수 있습니다. React는 웹과 네이티브 앱의 사용자 인터페이스를 만드는 데 쓰는 자바스크립트 라이브러리입니다. 화면의 각 상태를 단순한 뷰로 설계해 두면, 데이터가 변할 때 필요한 부분만 효율적으로 업데이트합니다.
상태 기반 화면 구성
React는 선언적 방식을 사용해 인터페이스를 만듭니다. 개발자는 애플리케이션의 각 상태에 해당하는 단순한 뷰를 설계합니다. 데이터가 변경되면 React는 효율적으로 업데이트하고 올바른 컴포넌트만 렌더링합니다. 이 방식은 코드를 예측 가능하게 만들고 이해하기 쉬우며 디버깅도 용이하게 합니다. 컴포넌트 로직은 템플릿이 아닌 자바스크립트로 작성되어 풍부한 데이터를 애플리케이션 전체로 전달하기 쉽습니다. 또한 상태는 DOM에서 분리되어 유지됩니다.
플랫폼을 넘나드는 사용
React는 기술 스택의 나머지 부분에 대해 가정을 하지 않습니다. 기존 코드를 다시 쓰지 않고 새로운 기능을 개발할 수 있습니다. Node를 사용해 서버에서 렌더링할 수도 있고, React Native를 사용해 모바일 앱을 구동할 수도 있습니다. 한 번 배운 지식을 다양한 환경에서 활용할 수 있습니다.
단계적 도입과 시작 방법
React는 처음부터 점진적 도입을 위해 설계되었습니다. 필요한 만큼만 사용할 수 있습니다. Quick Start를 통해 React를 맛볼 수 있고, 기존 프로젝트에 React를 추가해 필요한 부분만 사용할 수도 있습니다. 새로운 React 앱을 만들 때 강력한 자바스크립트 도구 체인을 원한다면 Create a New React App을 사용할 수 있습니다. 문서에는 Quick Start, 튜토리얼, React 사고법, 설치, UI 설명, 상호작용 추가, 상태 관리, 고급 가이드, API 참조, 지원, 기여 가이드 등 여러 섹션이 포함되어 있습니다.
JSX와 예제
React를 사용할 때 HTML과 유사한 문법을 사용할 수 있습니다. 이 문법을 JSX라고 부릅니다. JSX는 필수 사항은 아니지만 코드를 더 가독성 있게 만들고 HTML을 작성하는 듯한 느낌을 줍니다. 예를 들어 createRoot를 사용해 컨테이너에 HelloMessage 컴포넌트를 렌더링하면 "Hello Taylor"라는 텍스트가 표시됩니다. 이 예제는 React가 어떻게 화면에 내용을 출력하는지 보여줍니다.
기여와 라이선스
이 저장소의 주된 목적은 React 코어를 계속 발전시켜 더 빠르고 사용하기 쉽게 만드는 것입니다. 개발은 GitHub에서 공개적으로 이루어지며 커뮤니티의 버그 수정과 개선에 감사드립니다. 기여 가이드를 읽으면 개발 프로세스, 버그 수정 및 개선 제안 방법, 변경 사항 빌드 및 테스트 방법을 알 수 있습니다. 초보자를 위해 범위가 제한적인 버그가 포함된 good first issues 목록도 있습니다. React는 MIT 라이선스를 사용합니다.
