프로그래밍/React Native 3

react navigation v5 drawer 추가하기

react-navigation에서 제공하는 기능으로 drawer를 추가할 수 있다. @react-navigation/drawer 를 인스톨 해준다. npm install @react-navigation/drawer 기본적인 코드는 아래와 같다. import { createDrawerNavigator } from '@react-navigation/drawer'; const Drawer = createDrawerNavigator(); function MyDrawer() { return ( ); } Navigator를 반환하는 함수를 하나만들면 되는데, Drawer Navigator는 헤더가 없는게 특징이다. 직접 header 컴포넌트를 만들어서 넣어주면된다. 커스텀한 메뉴를 추가하거나, 스타일을 주고싶은 경..

react native 안드로이드 emulator api 연동시 localhost 이슈

android 개발시에 백엔드 api를 통해서 localhost의 9090포트로 호출시 response를 못받는 상황이 발생. axios의 문제인가해서 http://다른 url을 통해서 해봤더니 잘 받아온다.. adb reverse 커맨드를 통해 설정을 해줘야 하는듯하다. https://stackoverflow.com/questions/33704130/react-native-android-fetch-failing-on-connection-to-local-api React Native Android Fetch failing on connection to local API I'm using the fetch API in my react-native Android app to make requests to a..

React Native 윈도우 내 개발환경 세팅

개인 노트북은 mac이지만 사내 pc가 window이기 때문에 복습겸 환경세팅을 정리함. 개발 환경은 expo와 react native 두가지 방법이 있지만, expo는 교육용 딱 그뿐이라고 들었기때문에 거르도록 한다. 물론 expo로 구현가능한 기능들의 범위를 확실히 인지하고, 가능하다면 expo도 좋은듯하다. 휴대폰에도 expo앱만 받아서 간단하게 개발중인 앱을 띄울 수 있었고, PC에서도 금방금방 확인할 수 있었던걸로 기억한다. 하지만, 사용하지않은 네이티브 모듈때문에 앱 사이즈가 커지는 문제와 expo에서 제공하지않은 모듈이 생기면 추가할 때 불편함이 있는 문제가 있다. 기본적으로 create-react-native-app으로 생성할경우는 expo기반으로, react-native init 으로 생..