Stack/React-Native

React-Native 하면서 생겼던 글로 쓰기에 애매하지만 간단하게 필요했던 것들을 정리해본다.Ios Simulator 끄는법다음사진과 같이 ios simulator 를 사용중에 컴퓨터를 종료하려고 했는데 ios simulator가 켜져있어서 종료가 안된적이 있다.이럴데  'command + Q' 를 누르게 되면 정상적으로 종료가된다.Expo 앱에서 Debugger 열기Expo 앱에서 Debugger 를 열기 위해서 다음과 같은 창을 띄우려면, 앱에 설치하는 경우 핸드폰을 흔들면 나오지만 Ios Simulator에서는 흔들수 없기에 이럴 때는 'Command + D' 를 눌러주면 된다. Ios Simulator 에서 custom loaction 설정해주기앱을 만들던 도중에 gps를 내위치를 기반으로 날..

React-Native에서 위치에 관한 기능을 사용하기 위해 Expo를 사용해보자https://docs.expo.dev/versions/latest/sdk/location/위의 docs 주소 참고하자expo-location 설치npx expo install expo-location우선 expo-location 을 설치해주자Location import 시키기import * as Location from 'expo-location';핸드폰으로 부터 허가 받기전체 코드는 아래와 같다.useEffect(() => { LocationFunc();}, []);const LocationFunc = async () => { // 1. requestForegroundPermissionsAsync() 허가 받는..

React-Native View 컴포넌트에 대해 알아보기React-Native 는 거의 대부분을 너비와 높이에 기반해서 레이아웃을 디자인 하지 않는다.⇒ width , height를 거의 사용하지 않는다는 뜻이다.스크린의 크기에 따라 보이는게 천차만별이기 때문이다.반응형 디자인에 대해 생각해야된다. 수많은 스크린들을 고려하면서 디자인 해야될것!아이콘이나 아바타는 width 나 height 를 사용할 수 있지만 레이아웃에서는 사용하지 않는다.View 기본적으로 flex 속성을 가지고 있다.  일반적으로 웹에서는 display : flex 를 하고 flex-direction: row; 를 하는 속성을 넣어줘야 되지만 React-Native View 는 기본적으로 flex 속성을 가지고 있다.그리고 React..

React-Native 규칙React-Native는 HTML 로 구성되지 않기 때문에 가 아닌 가 아닌 를 통해 구성된다.React-Native의 Text 의 구성요소는   텍스트 컴포넌트 안에 들어가야된다. ⇒ span , p 를 사용할수 없다.React-Native 에서는 React처럼 style을 완전히 동일로는 사용할수 없다. ⇒ 일부만 사용할 수 있다React-Native StyleSheet 사용방법import { StatusBar } from 'expo-status-bar';import { StyleSheet, Text, View } from 'react-native';export default function App() { return ( Hello World ..

설치과정1. node 설치 ⇒ 기본과정이므로 생략2. expo를 global로 설치npm install --global expo-cli 3. watchman 설치brew install watchmanWatchman은 Meta가 만든 File 모니터링 도구4. 어디에서 실행하고 테스트 할 것인가?4-1. XCode를 설치하면 컴퓨터 자체에서 Ios Simulator를 사용할 수 있다.4-2. Android studio를 설치하면 컴퓨터 자체에서 Android Simulator를 사용할 수 있다.4-3. 아이폰 핸드폰에서 expo go 앱을 다운 받아 설치하여해당 폰에서 실행가능4-4. 안드로이드 핸드폰에서 expo go 앱을 다운 받아 설치하여 해당 폰에서 실행가능5. expo init을 파일폴더 생성ex..

리액트 네이티브를 사용하기 위해서 'Expo'와 'React-Native-CLI' 를 사용한다.CLI 와 Expo의 특징React Native CLI 특징기본적으로 네이티브 코드(Android, iOS)를 직접 다뤄야 하기 때문에 설정이 복잡하다.Java, Android Studio, Xcode 등 네이티브 환경 설정이 필요하다.커스터마이징이 자유로워서, 프로젝트에서 네이티브 모듈을 직접 작성하거나, 서드파티 네이티브 모듈을 쉽게 사용할 수 있다.React Native Expo의 특징설치와 초기 설정이 매우 간단하다. expo init 명령어로 바로 프로젝트를 시작할 수 있다네이티브 코드 설정 없이도 앱을 개발할 수 있어서 초보자에게 적합하다Expo 앱을 통해 개발 중인 애플리케이션을 실시간으로 테스트할..