TIL: RN 배달앱 클론코딩 | 리액트 네이티브 기본 컴포넌트 - 221013

Lumpen·2022년 10월 13일
0

TIL

목록 보기
157/244

기본 컴포넌트

react native 는 react 와 다른 컴포넌트를 사용하게 된다

컴포넌트를 읽을 때 가장 마지막 줄 부터 확인한다
export를 어떻게 했는지 부터 확인 후 올라간다

style

react native 는 기본 css, styleSheet를 지원한다
하지만 css도 웹과 조금 다르다
flex 기반인데 flex도 웹이랑 다름

style을 변수에 따라 다르게 주어야 할 때는 인라인 스타일로 작성해야 한다

길이 단위

웹에서의 px이나 em 등 없음

단위 작성 없이 숫자만 넣으면 되는데 기본적으로 dp 라는 단위를 사용한다
-> 휴대폰 화면의 해상도에 따라 유동적인 값으로 % 와는 다르다
% 도 쓸 수 있음

축약 스타일의 css 문법 사용 불가 -> border: 'solid 1px black' 같은

typescript 를 사용한다면 css 자동완성이 돼서 좋은데
아니라면 좀 힘들다 -> 제로초님 git hub 에 방법 있음

앱 화면

웹은 가로 방향이 기본, 모바일은 세로 방향이 기본

react 와의 호환

공통되는게 거의 없다 -> 아쉬운 부분 (react-native-web 이 시도는 해봤으나 비주류)
화면 구성은 웹과 완전 다르지만
비즈니스 로직은 웹 코드가 있다면 그대로 사용할 수 있다

react 웹이 있어도 react native 로 모바일 개발하는 시간은 웹개발 하는 만큼 소요된다
웹과 react native 를 1:1맵핑 된다고 생각하면 안됨

react native 공식문서

공식문서 업데이트가 잘 안되고 빠진 부분이 꽤 있다

profile
떠돌이 생활을 하는. 실업자, 부랑 생활을 하는

0개의 댓글