react-native 스타일 스타일링 - 인라인 스타일링 - 클래스 스타일링 - 외부 스타일링 - 플랫폼 구분해서 스타일링 - 스타일드 컴포넌트 인라인 스타일링 객체 형태: HTML에서는 문자열 형태로 입력하는데 반해 객체로 전달 카멜 케이스 비슷한 역할을 하는 컴포넌트에 코드가 반복될 수 있음 수정이 번거롭다 코드만으로 스타일이 적용된 이유 이해하기 어렵다. (클래스, 스타일드 이용하면 명칭을 지정할 수 있어 이해하기 편합니다.) [App.tsx] inline-styling inline-styling inline-styling 클래스 스타일링 스타일시트에 정의된 스타일을 사용 인라인 스타일링보다 깔끔 명칭을 지정할 수 있기 때문에 의도파악이 수월하다 간편한 수정: 여러개를 사용했을 때 정의한 스타일시트의 스타일만 변경해주면 된다...
react-native 환경설정 react-native 환경설정 💡리액트 네이티브는 맥, 윈도우, 리눅스 환경에서 개발이 가능합니다. 맥 환경에서는 iOS, 안드로이드 개발이 모두 가능하지만, 윈도우와 리눅스 환경에서는 안드로이드 개발만 가능합니다. 개발환경 준비 - Node.js - 파이썬 - JDK - 안드로이드 스튜디오 프로젝트 만들기 Expo 💡 Expo는 리액트 네이티브를 편하게 사용할 수 있도록 여러 가지 설정이 되어 있는 툴 장점 쉬운 접근성: 처음 시작하는 사람도 접근하기 편하게 되어 있으며, 최종적으로 완성된 프로젝트를 쉽게 배포 및 관리할 수 있도록 다양한 기능을 제공합니다. 아이폰과 안드로이드 폰이 있으면 Xcode, 안드로이드 스튜디오 없이도 해당 플랫폼의 테스트를 진행할 수 있으며 개발할 수 있습니다. 웹도 함께..
썸네일 React Native란? React Native란? 💡 React-Native는 자바스크립트로 iOS와 Android를 동시에 개발하고 빌드할 수 있는 네이티브 모바일 애플리케이션 프레임워크입니다. RN Pros & Cons 장점 높은 재사용성 : 작성된 코드 대부분 플랫폼 간의 공유가 가능해서 iOS, Android를 동시에 개발 할 수 있다. Fast Refresh : 변경된 코드를 저장하기만 해도 자동으로 변경된 내용이 화면에 적용된다. 이 기능으로 수정 > 컴파일 > 새로고침 등의 작업을 생략하고 불필요한 작업시간을 줄일 수 있다. 성능 저하 문제점 해결 : 작성된 코드에 따라 각 플랫폼에 알맞은 네이티브 엘리먼트로 전환되기 때문에 큰 성능 저하 없이 개발이 가능하다. 쉬운 접근성 : 모바일에 대한 개발 지식이 없어도 자..