[스나이퍼팩토리] 한컴AI아카데미 6주차

 

 

리액트 네이티브(모바일) 교육이 수요일부터 시작되었다.

새로 오신 강사님께서 우리가 기존 리액트랑 헷갈릴 수 있으니까 리액트 네이티브에서 등장하는 개념들부터 여러 번 반복해 설명해주셨다. 그치만 내가 수업에 집중을 피곤이슈로 못했기 때문에 학습일지를 복습용으로 이용해보겠다.

 

 

 

개념 복습

React Native란? 

자바스크립트와 리액트의 개념을 활용하여 네이티브 모바일 앱(안드로이드, ios)를 개발할 수 있게 해주는 프레임워크

웹에서 사용하던 리액트의 장점을 모바일에 확장하여, 별도의 네이티브 언어(swift, java, kotlin)를 전부 쓰지 않고도 모바일 앱을 작성할 수 있다.

네이티브 앱이란 안드로이드나 ios운영체제에 밀접하게 작동하는 앱을 의미

 

React Native의 주요 내장 컴포넌트

1. View - 레이아웃을 위한 컨테이너

2. Text - 텍스트 표시

3. Image - 이미지 렌더링

 

React Native의 장·단점

장점

- 자바스크립트와 리액트 문법을 활용할 수 있음

- 한 번의 코드베이스(자바스크립트)로 양대 모바일 운영체제(iOS/Android)에 대응할 수있다 

- Hot Reload : 코드를 수정한 후 앱을 재빌드할 필요 없이, 수정사항이 즉시 반영되어 화면에서 확인 가능 → 개발생산성 up

- 커뮤니티가 활발하여 라이브러리가 풍부하다

 

단점

- 실제로 앱 스토어에 배포하려면 Xcode, Androi Studio를 설치하여 각 플랫폼 빌드 환경을 갖춰야함. (플랫폼별 설정을 따로 챙겨야함)

- 복잡한 네이티브 기능은 커스텀이 필요함. (네이티브 모듈을 직접 작성하거나 다른 전용 라이브러리를 사용해 보완해야하는 경우 有)

- 업데이트 될 때마다 React Native 버전과 네이티브 SDK 충돌에 주의해야한다.

 

브릿지 구조

- 자바스크립트 스레드에서 UI나 네이티브 기능 호출 시, Bridge를 통해 iOS/Android의 실제 네이티브 API와 통신함

- 네이티브 성능에 근접한 UI, UX를 제공한다. 핵심 Logic은 자바스크립트로, 플랫폼별 차이는 리액트 네이티브 라이브러리가 중간에서 처리한다.

- 복잡한 네이티브 모듈(카메라, GPS, 생체인증 등)이 필요하면, 직접 Native Module 작성하거나 서드파티 라이브러리에 의존해야한다.

- JS와 네이티브 간 통신이 많아지면 퍼포먼스 최적화 이슈가 발생한다.

- 최근에는 브릿지를 우회하는 새로운 구조도 도입되었다고 함. (JSI, Fabric, TurboModules 등)

 

 

과제

 

강사님의 예시코드를 참고해서 아~주 심플하게 앱을 만들었음 

 

 

 

기능이 거의 없는 말 그대로 할 일을 추가만 하는 앱이기 때문에 코드가 이해하기 어렵지는 않다. 

아직까진 웹에서 하던거에서 ToucableOpacity(버튼), Text, View 정도만 추가되었음. (사실 추가된 것도 아니고 명칭만 다른 거임)

        <TouchableOpacity onPress={work}>
          <Text
            style={[
              styles.categoryButton,
              working ? styles.categoryButtonActive : null,
            ]}
          >
            WORK
          </Text>
        </TouchableOpacity>

 

기억에 남은 건 스타일을 웹에서 했던 것처럼 css파일로 작성하는 게 아니라 style.js 파일에 객체로 저장하는 것ㅎㅎ

당연한 소리긴 한데 폰에서 돌아가는 앱도 이런 노가다로 이루어졌다고 생각하니까 뭔가 새롭구만 

 

이번 주는 월요일 쉬고 4일만 나가고 중간에 개인적인 행사가 있어서 뭔가 마음이 붕떠서 집중을 제대로 못한 것 같아서 아쉽다

다음주부터는 각잡고 열심히 할 것 !

리액트 모바일이 웹 바로 다음 과정에 있는데 개념도 많이 차이나는 건 아니라서 웹 파트도 같이 복습할 수 있을 것 같아 좋다. 

 

 

 

본 후기는 [한글과컴퓨터x한국생산성본부x스나이퍼팩토리] 한컴 AI 아카데미 (B-log) 리뷰로 작성 되었습니다.