React-Native 작동 방식

React Native는 어떻게 작동하는가

React와 React-Native의 가장 큰 차이점은 개발 대상이다.
React는 웹사이트를 만들고
React-Native는 모바일 애플리케이션을 만든다.

용도가 다르니 그에 따라 세부적인 사항도 달라진다.

웹 개발은 브라우저를 통해 보여지는 DOM을 생성하기 위해 HTML 코드를 작성해야 한다.
반면 React-Native는 웹 개발과는 다른 영역이다. React-Native에는 브라우저가 없기에 HTML 코드를 작성하지 않는다.

위 다이어그램에서 React Component가 React Native로 전달되고, bridge를 통해 각 운영체제로 전달되는 흐름을 알 수 있다.

React-Native는 자바스크립트 코드를 사용하여 네이티브 앱을 개발할 수 있도록 만든 플랫폼이다.

위 다이어그램은 React-Native App에서 이벤트가 어떻게 처리되는지를 보여준다.

우리가 실제 작업할 영역은 Native, Bridge, JavaScript 중 오직 JavaScript 영역 뿐이다. 자바스크립트 코드를 작성하면 React-Native가 네이티브앱으로부터 정보를 얻어 자바스크립트 코드를 작동시키고, 변경사항 다시 네이티브 앱에 적용할 것이다.

위 이미지는 React-Native App의 구성요소이다.
보여지는 모든 요소들이 개발에 필요하다.
따라서 안드로이드 앱을 위해서는 자바를 설치해야 하고, IOS 앱을 위해서는 Objective-C 또는 Swift가 필요하다.

하지만 코드를 작성하는 영역은 JavaScript, Markup/Styleing 뿐이다.
코드와 개발환경만 갖추면, React-Native가 우리의 코드와 네이티브 앱 사이의 통역사가 되어 주는 것이다.