리액트 네이티브 앱 제작 원론. 3장 스타일과 레이아웃

상상과는 달리 디자인 적용을 위해 CSS를 사용할 필요는 없었습니다. 다만 요소도 방식도 CSS와 매우 유사한 것은 분명하네요. 속성들이 다 머릿속에 들어가 있어야 디자인 스펙을 따라잡을 텐데, 지금 시점에 이걸 다 외우고 있을 수도 없고... 목표 삼을 토이 프로젝트가 시급합니다.

스타일을 정의하는 방법으로 두 가지가 있습니다.

1. JSX에 직접 기술하는 '인라인 스타일'

2. 자바스크립트 객체로 정의하는 '스타일 객체'. StyleSheet를 사용하면 컨테이너 객체가 제공되고, 스타일의 속성들이 올바른지 검증도 해줍니다.

복수의 스타일이 적용될 때, 같은 속성이 중복으로 정의되어 있으면 뒷 쪽에 있는 속성이 적용됩니다.

리액트 네이티브는 스타일링에 있어서 다른 접근 방식을 채택한다. CSS의 상속 모델과는 달리, 리액트 네이티브에서의 스타일은 거의 모두 해당 엘리먼트로 범위가 한정된다. 이는 애플리케이션 스타일링에 있어 다른 방식을 사용할 수 있게 한다. 즉, 전역 스타일에 의존하지 않고, 스타일을 캡슐화한 재사용할 수 있는 컴포넌트를 만들어야 한다는 의미다.