본문 바로가기

App/React Native3

[React Native] React Native 스타일 지정 방법 알림 본 포스팅은 공부 목적으로 작성된 글이며 상업적 목적으로 절대 사용되지 않았음을 밝힙니다. 프로퍼티에 직접 작성 첫 번째로 컴포넌트에 직접 프로퍼티를 안에 스타일을 작성하는 방법입니다. 참고로 프로퍼티(property)란, 속성이란 의미로, 위 이미지처럼 컴포넌트에 style을 의미하는 것이며, 어제 작성했던 버튼 컴포넌트 안에 title 등이 해당됩니다. 당연히 태그 안에 작성하는 것이라, 꾸밀 것이 많아 많은 값들을 지정해줘야 하면 코드도 많이 지저분해지기 때문에 지양하는 게 좋은데요. 이미지처럼 짧게 한두 개 정도 지정해줄 땐 편리하게 사용이 가능합니다. 변수에 작성 후 호출 두 번째는 위 이미지처럼 스타일을 변수에 작성하고 style 프로퍼티로 호출해주면 되며, 변수에 한 가지 스타일만 만들.. 2022. 2. 20.
[React Native] Simulator 구동 및 복습(App.js, Import, 컴포넌트) 알림 본 포스팅은 공부 목적으로 작성된 글이며 상업적 목적으로 절대 사용되지 않았음을 밝힙니다. iOS 시뮬레이터, 안드로이드 시뮬레이터 구동하기 리액트 네이티브에서 iOS 시뮬레이터와 안드로이드 시뮬레이터로 구동하기 위해서는, react-native run-ios # iOS 시뮬레이터 구동 react-native run-android # 안드로이드 시뮬레이터 구동 다음과 같은 명령어를 터미널에 입력해주면 됩니다. 현재 저는 iOS 시뮬레이터는 잘 구동이 되는데, 안드로이드 시뮬레이터의 경우 에러가 발생하여 구동이 되지 않습니다. 구글에 검색해 본 결과, gradlew clean을 해 주면 될 것 같은데요. 그렇게 하면 자바 경로가 잘못 되었다는 에러가 뜹니다. 이처럼 보통 인터넷 강의로 개발을 배울 때.. 2022. 2. 20.
[React Native] 소개 및 채택 과정 개요 요즘 리액트 네이티브를 공부하며 앱 개발 계획을 앞두고 있습니다. 리액트 네이티브 공부 일지를 작성하기에 앞서, 리액트 네이티브가 무엇이고 제가 왜 채택했는지에 대해 이야기를 해 볼까 합니다. 리액트 네이티브란? 리액트 네이티브를 말씀드리기에 앞서, 이 친구 이름이 리액트와 이름이 매우 비슷하죠? 리액트는 페이스북에서 개발한 웹 사이트를 개발할 때 가장 많이 사용하는 라이브러리 중 하나입니다. 이 프론트엔드의 취업 시장 변화 속도와, 사용 기술의 변화 속도는 매우 빠르지만, 그럼에도 불구하고 아직까지 대부분의 모집 요강에선 '리액트로 개발이 가능한 사람'이 많이 보일 정도로 굉장히 인기 있는 기술이자 필수 기술입니다. 근데 이런 리액트와 환경이 거의 비슷하고, 자바스크립트로 앱 개발이 가능한 프레임.. 2022. 2. 20.