리액트 네이티브

[React Native] 리액트 네이티브 차트 라이브러리 추천

웹이나 앱을 개발하다 보면 데이터를 예쁘게 차트로 시각화하고 싶은 경우가 생깁니다. 리액트 네이티브에도 다양한 차트 라이브러리가 존재합니다. ✔ 하지만 기업이 아닌 개인 사용자들이 만든 커뮤니티 라이브러리가 대부분이기 때문에 사용하기 전에 다운로드 수, 최근 업데이트 날짜 등을 잘 확인해야 합니다. 제가 사용해 보고 좋다고 생각한 차트 라이브러리 2가지를 추천해 드리겠습니다. 😀 1. react-native-chart-kit https://www.npmjs.com/package/react-native-chart-kit?activeTab=readme react-native-chart-kit If you're looking to **build a website or a cross-platform mobile..

[React Native] RNSVGSvsViewAndroid 에러, ReadableMap 에러 해결방법

리액트 네이티브 차트 라이브러리를 사용하기 위해서 install 했더니 다음과 같은 에러가 발생했습니다. 패키지 버전들이 충돌 나서 안되는 줄 알고 2일 동안 스택 오버플로와 깃허브 이슈를 엄청 찾아다녔습니다. 😪 2일간의 삽질의 흔적입니다. 😂 📝 해결방법 ⦁ java.lang.Double cannot be cast to abi47_0_0.com.facebook.react.bridge.ReadableMap ⦁ requireNativeComponent: "RNSVGSvgViewAndroid" was not found in the UIManager ✔ 다음 코드를 터미널에 순서대로 입력해 줍니다. 🎉 expo update expo prebuild rm node_modules yarn install 참고 문..

[React Native] 리액트 네이티브 Expo Audio 녹음, 재생 구현하기

Expo에서 오디오 녹음 및 재생을 구현할 수 있는 Audio라는 Expo SDK를 지원합니다. 저는 프로젝트에 음성 일기를 구현하기 위해 사용했습니다. 공식 문서에 예제 코드가 잘 나와있지만, 저는 이런저런 에러로 꽤나 고생했습니다. 😂 📝Audio https://docs.expo.dev/versions/v47.0.0/sdk/audio/ Audio - Expo Documentation Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React. docs.expo.dev ✔ Usage에 예제 코드가 잘 나와있습니다. Open In Snack 눌러서 ..

[React Native] 리액트 네이티브 코드 적용 안되는 이슈 해결 (캐시 초기화)

리액트 네이티브 개발을 하다가 앱이 너무 느려진다거나, 소스 코드를 변경해도 적용이 안되는 이슈를 겪게 되었습니다. 에러 메시지도 보여주지 않기 때문에 해결하기 굉장히 힘들었습니다. 🤦‍♂️🤷‍♂️ 결국 Stack Overflow의 도움을 받아 해결하게 되었습니다! https://stackoverflow.com/questions/40985027/unable-to-resolve-module-in-react-native-app Unable to Resolve Module in React Native App I'm getting an error in React Native saying it can't resolve a module. It's saying a certain folder doesn't exist ..

[React Native] 리액트 네이티브 To Do 앱 만들기 (AsyncStorage, Map)

https://nomadcoders.co/react-native-for-beginners 왕초보를 위한 React Native 101 – 노마드 코더 Nomad Coders React Native로 2개의 앱 만들기 nomadcoders.co 프로젝트를 하면서 앱을 개발해야 하는 일이 생겨서 니꼬 선생님의 강의를 듣고 React Native를 사용해 To Do 앱을 만들었습니다. Expo를 사용하면 환경 설정이 간단하고 제공해 주는 API, 컴포넌트들이 많아서 쉽고 빠르게 개발이 가능합니다. 📝 To Do 앱 ⦁ 🧾 기능 1. To Do List / 여행 리스트 추가 삭제 2. 체크박스 선택 시 텍스트 줄긋기 및 색 변경 ( 완료 체크 ) 3. AsyncStorage 사용 ( Local Storage 비..