react.js , react-dom, react native 그리고 expo

Debug-Life ·2023년 1월 16일
0

1. react & react native

  • react.js : 자바스크립트 라이브러리 (인터페이스 구축) 보통 웹개발에 사용,
  • react-dom : 웹 지원을 돕는 라이브러리.
  • react native : react-dom의 대안
  • Node.js : 자바스크립트 런타임 모듈. 브라우저 밖에서 자바스크립트를 실행할 수 있게함.
    단 , 리액트로는 Node.js를 작성하지 않는다. 리액트는 Node.js 라이브러리나 프레임워크가 아니라 리액트는 브라우저 쪽 자바스크립트이기 떄문에.
  • react.js + react-dom = 웹앱 구축
    react.js + react native = ios android 플랫폼 사용가능.
  • React 라이브러리 자체는 플랫폼에 구애받지 않는다
  • React Native에 내장된 컴포넌트들은 iOS 및 Android 플랫폼을 위해 네이티브 UI 요소로 컴파일됩니다. 이때 React Native가 컴파일 단계 역시 처리함.
  • 결국 react-dom 과 react native의 차이는 타겟 플랫폼이 웹인것인지 ios, android 인것인지로 나뉜다.

즉 reactNative는 모바일 플랫폼을 타겟
다시말해 react.js에서 자바스크립트로 코드 작성중 react native 컴포넌트와 api를 추가로 사용해 ios, android의 네이티브 모바일 앱을 만드는것.



2. expo

모바일 개발(ios, android)을 할때 개발결과는 보여주는 헬퍼에 불과,
단, EAS build service를 이용하면 독립형 어플로 빌드가 가능해진다.

다시 말해 expo go 앱을 통해서 개발 결과를 미리 폰에서 확인하고,
실제 독립형 앱은 eas로 빌드를 통해서 볼 수 있는것.



내용 요약

1. 리액트는 기존웹과 다르다.

기존웹은 요청과 응답의 방식으로 html 로드될떄까지 기다려야 했지만
모바일 앱에서는 그렇지 않다. 즉각반영.
그러니까 리액트는 뭐고 리액트를 사용해야하는 이유가 뭔데?
기존 자바스크립트 말고 말이야.

2. 왜 "JavaScript" 대신 리액트일까?

  • 반복적인 작업을 줄이고 개발자가 유지보수 하기 쉽다. (한눈에 잘 들어옴)
    결국 효율성 측면.
  • 고수준 레벨에서 사용자 Interface를 쉽게 구축할 수 있게 해준다. (핵심)

3. 리액트로 단일 페이지 애플리케이션(SPA) 구축

리액트는 서버에 새로운 html을 요청하지 않는데 어떻게 하는걸까?
SPA 싱글페이지 애플리케이션?
그걸 spa라고 한다.
서버는 제일 처음만 html 페이지를 보내주고 리액트가 이후에 일어나는 동작들에 관해서 제어한다.

4. react.js 대안 탐색하기(Angular/ Vue)

여기서는 다루지 않는다.





< 정리 >

리액트 네이티브(React Native)로 만든 모바일 애플리케이션은 네이티브 앱(Native App)으로 분류됩니다.

하이브리드 앱(Hybrid App)은 네이티브 앱과 웹 앱(Web App)의 중간 형태로, 웹 기술과 네이티브 기술을 결합하여 만들어지는 앱입니다. 하지만, 리액트 네이티브는 네이티브 앱을 개발하기 위한 프레임워크로, 모바일 운영체제에서 동작하는 네이티브 앱을 만들기 위한 기술입니다.

리액트 네이티브 앱은 iOS와 안드로이드 운영체제에서 독립적으로 동작하며, iOS와 안드로이드에서 각각 네이티브 앱으로 빌드됩니다. 따라서, 리액트 네이티브로 만든 애플리케이션은 네이티브 앱으로 분류되며, 하이브리드 앱과는 개념적으로 차이가 있습니다.



리액트 네이티브(React Native)는 네이티브 앱을 개발하기 위한 프레임워크 중 하나입니다. 리액트 네이티브는 리액트(React) 라이브러리를 기반으로 하며, 자바스크립트와 JSX를 사용하여 iOS와 안드로이드 운영체제에서 동작하는 네이티브 애플리케이션을 만들 수 있습니다. 리액트 네이티브는 모바일 애플리케이션을 개발하는 데 사용될 수 있으며, 네이티브 앱에 필요한 기능을 지원하고, 빠른 성능과 반응성을 제공합니다.

따라서, 리액트 네이티브는 네이티브 앱 개발에 사용되는 기술이며, 네이티브 앱과 하이브리드 앱, 웹 앱과는 개념적으로 다릅니다.

profile
인생도 디버깅이 될까요? 그럼요 제가 하고 있는걸요

0개의 댓글