반응형
리액트 네이티브(React Native) 란?
- 2015년 3월 페이스북에 의해 공개된 오픈소스 프로젝트
- 웹 브라우저가 아닌, iOS와 안드로이드(Android)에서 동작하는 네이티브 모바일 애플리케이션을 만드는 자바스크립트 프레임워크
리액트 네이티브 장점
- 두 플랫폼(iOS, Android) 동시 개발 가능
- 모바일 개발 지식이 없어도 자바스크립트만 알고 있으면 쉽게 시작할 수 있음.
- 변경된 코드를 저장하기만 해도 자동으로 변경된 내용이 적용된 화면을 확인할 수 있는 Fast Refresh 기능 제공
리액트 네이티브 단점
- 리액트 네이티브가 네이티브 코드로 전환되는 장점은 있으나, 네이티브 새로운 기능을 사용하는데 오래 걸린다는 단점이 있음.
- iOS, Android에서 업데이트를 통해 새로운 API를 제공하더라도 리액트 네이티브가 이를 지원하기까지 시간이 걸림.
- 개발 단계에서 문제가 생겼을 때 원인을 찾고 해결하는데 많은 시간이 걸림(=유지 보수의 어려움)
- 한 달 사이에 버전이 하나씩 올라가는 잦은 업데이트
리액트 네이티브 동작 방식
1. 브릿지
- 자바스크립트 코드를 이용해 네이티브 계층과 통신할 수 있도록 연결하는 역할
- 자바스크립트 스레드에서 정보를 받아 네이티브로 전달함
2. 가상 DOM
- 데이터에 변화가 발생 -> 변화된 데이터를 이용해 가상 DOM을 그림 -> 가상 DOM과 실제 DOM을 비교하여 차이점 확인 -> 차이점이 있는 부분만 실제 DOM에 적용하여 그림
- 위의 실제 DOM은 우리가 보는 화면에 나타나는 DOM이고 가상 DOM은 화면에 보이지 않지만 비교를 위해 존재하는 DOM이라고 이해하면 됨.
3. JSX
- 자바스크립트 확장 문법, XML과 유사함.
- 리액트에서 자주 사용되며 자바스크립트 코드보다 가독성이 더 뛰어남
반응형
'💻 my code archive > ✨React-Native' 카테고리의 다른 글
[리액트 네이티브] Hooks, useEffect, useRef, useMemo, 커스텀 Hooks 만들기 (0) | 2022.07.13 |
---|---|
[리액트 네이티브] 할 일 관리 Todo List 애플리케이션 만들기 (0) | 2022.07.12 |
[리액트 네이티브 스타일링] flex 정렬, 스타일드 컴포넌트(styled-components), ThemeProvider (0) | 2022.07.06 |
[리액트 네이티브] 내장 컴포넌트, props, useState (0) | 2022.07.03 |
리액트 네이티브 개발환경 준비하기, 프로젝트 생성 (0) | 2022.07.03 |