반응형

rn 13

[React Native][라이브러리 소개] 깔끔하고 쉽게 구현하는 Toast

# react-native-toast-message - Toast Message는 앱 내에서 사용자들에게 이벤트의 발생과 그 내용을 알려줄 수 있는 직관적인 UI 요소로 많은 앱에서 사용된다. 물론 Toast Message의 구현 난이도 자체는 높지 않기 때문에 직접 구현하는 것도 좋은 방법이지만, Toast Message가 서비스의 핵심 적인 기능은 아니다보니 적당한 라이브러리가 있을 경우 이를 활용하면 시간을 절약할 수 있다. 본 포스팅에서는 이런 경우 도움이 될 수 있는 라이브러리를 소개하려고 한다 # 깃헙 페이지 https://github.com/calintamas/react-native-toast-message GitHub - calintamas/react-native-toast-message:..

개발/React Native 2023.09.28

[React Native][라이브러리 소개] RN에서 쓸만한 Dropdown

# react-native-element-dropdown - Dropdown은 웹 또는 앱에서 많이 사용되는 선택 UI입니다. 문제는 이러한 UI들이 대부분 네이티브 UI를 사용하다보니, Android와 IOS에서 동일한 디자인이 아니라는 것입니다. 이러한 문제를 해결하기 위해서는 적절한 라이브러를 활용하는 것이 효율적입니다. 지난 번 관련 포스팅에서는 간단하고 쉽게 사용할 수 있는 깔끔한 라이브러리를 소개했었습니다. [React Native][라이브러리 소개] 지금까지 봤던 가장 깔끔한 Dropdown / Picker / Select # React Native에서 사용가능한 가장 마음에 드는 react-native-dropdown-picker - React Native에서 선택 옵션을 구현할 때, 일반..

개발/React Native 2023.09.07

[React Native][라이브러리] react-native-restart로 앱 재시작 기능을 추가하는 방법

# react-native-restart를 사용해서 런 타임 중에 앱 번 들을 재시작 하는 방법 - 안녕하세요 Jake입니다. 오늘은 react-native-restart 라이브러리를 이용해서 앱 실행 중에 앱 번들의 재시작 기능을 추가하는 방법을 소개하려고 합니다. 사실 앱 번들의 재시작 기능은 필요하지 않도록 개발을 하는 것이 가장 좋지만, 언어나 테마 변경, 데이터 삭제 등의 경우에 쉽게 상태를 초기화 할 수 있기 때문에 유용한 기능이기도 합니다. # 깃헙 페이지 https://github.com/avishayil/react-native-restart GitHub - avishayil/react-native-restart: React Native Package With One Purpose: To ..

개발/React Native 2023.08.27

[React Native][라이브러리] Modal을 추가하는 아주 쉬운 방법 - react-native-magic-modal

# react-native-magic-modal을 활용한 Modal 구현 방법 소개 - 안녕하세요. Jake입니다. 앱을 개발하는 과정에서 모달은 빼놓을 수 없는. UI 요소 중 하나입니다. RN에서 개발을 좀 해보신 분들이라면, RN에서 모달이 필요하면, react-native의 기본 모달로 직접 구현하거나 react-native-modal 사용하셨을 것입니다. 두가지 모두 많이 사용되는 좋은 Modal이지만, 생각보다 추가 해야 할 코드가 많고, 모달의 Show/Hide 등을 직접 관리 해야 해서 간단한 모달이어도 구현에 손이 많이 갑니다. 본 포스팅에서는 이런 경우에 활용할 수 있는 좋은 대안을 소개하려고 합니다. # Github Page GitHub - GSTJ/react-native-magic-..

개발/React Native 2023.08.05

[React Native] 앱 아이콘 쉽게 변경하기 - 2023

# icon-set-creator으로 앱 아이콘 쉽게 변경하는 방법 소개(react-native-make는 놓아주자) - React Native로 개발을 하고 IOS, Android 플랫폼 모두에 앱을 출시해본 경험이 있는 사람이라면, 아이콘을 변경하는 일이 얼마나 번거롭고 귀찮은 일인지 아실 겁니다. 그렇기에 react-naitve-make 같은 라이브러리를 찾아서 사용하게 됩니다. react-native-make를 사용해보신 적 없으신 분들을 위해 설명하자면, 지정한 아이콘 이미지를 기반으로 각 플랫폼에서 요구하는 아이콘 사이즈를 폴더 구조에 맞게 자동으로 생성해 주는 도구라고 보시면 될 것 같습니다. 문제는 플랫폼 별로 요구하는 사항이 계속 업데이트가 되다 보니, 라이브러리의 유지보수가 중요한데, ..

개발/React Native 2023.08.02

[React Native] 폰트, MP3 등 에셋 쉽게 추가하기

# react-native-assets를 활용해서 네이티브 프로젝트에 에셋 추가하기 - React Native 환경에서 개발을 하다보면, Fonts를 변경하거나, 효과음이나 배경을을 추가하기 위해 MP3와 같은 음원 파일을 사용해야 하는 경우가 생깁니다. 문제는 이미지처럼 쉽게 포함시키지 못하고, XCode에 파일을 추가하거나, Android의 리소스에 추가하는 등의 추가작업이 요구됩니다. 하지만 이는 개발 하는 입장에서 시간을 빼았기는 귀찮은 일입니다. 본 포스팅에서는 이런 경우 도움이 되는 방법을 소개하려고 합니다 # 사용방법 - 자세한 사용방법 및 옵션들은 아래의 페이지에 잘 설명되어 있으니 참고하시기 바랍니다. GitHub - unimonkiez/react-native-asset: Linking ..

개발/React Native 2023.07.28

[RN][유용한 툴] React Native 패키지 명, 번들 명 변경하기

# react-native-rename를 사용해서 패키지를 쉽게 변경하는 방법 - React Native 프로젝트 개발을 시작할 때, 앱의 최종 이름이나 번들 이름이 확정되어 있지 않은 경우가 많습니다. 기획이 변경 되기도 하고, 또 이름이 마음에 들지 않아서 바꾸기도 합니다. 그러다보니 패키지 이름을 변경해야 되는 상황은 발생하기 마련입니다. 문제는 이 과정이 번거롭고 귀찮다는 것입니다. 본 포스팅에서는 react-native-rename을 사용해서 전체 패키지 이름을 변경하는 방법을 소개하려고 합니다 # 깃헙 저장소 https://github.com/junedomingo/react-native-rename GitHub - junedomingo/react-native-rename: Rename reac..

개발/React Native 2023.02.14

[React Native][라이브러리 소개] 앱, 플레이 스토어 리뷰를 작성 기능을 추가 해보자

# react-native-in-app-review - 앱 개발은 할 일이 참 많습니다. 힘들게 개발이 마무리 하면서, 출시 준비를 하다보면, 떨어져 가는 에너지와 반대로 해야 하는 귀찮은 일은 많아지기만 합니다. 그 중에서도 앱스토어나, 구글 플레이 스토어 관련 작업들은 많이 번거롭기 마련입니다. 오늘은 이런 과정에서 앱 스토어 및 구글 플레이 스토어 리뷰를 작성하는 기능에 대한 구현을 도와줄 라이브러리를 포스팅 하려고 합니다. # Github Page GitHub - MinaSamir11/react-native-in-app-review: The Google Play In-App Review API, App store rating API lets you prompt users t The Google P..

개발/React Native 2022.11.29

[RN] React Native 카메라 사용하기 react-native-vision-camera

# React Native 앱에서 카메라를 사용해보자 # 들어가며 지금까지 React Native에서 가장 많이 사용되는 카메라 라이브러리는 react-native-camera였다 React Native Camera · The comprehensive camera module for React Native. The comprehensive camera module for React Native. react-native-camera.github.io 그러나 react-native-camera 라이브러리는 유지보수를 해줄 지원자가 부족하고 코드 복잡도가 많이 올라가는 바람에 deprecated 되었다. 그래서 찾아낸 대안이 오늘 소개할 react-native-vision-camera다 # 깃헙 페이지 Hel..

개발/React Native 2022.01.26

[RN] React Native 앱 Youtube 추가하기(2022.12 업데이트)

# React Native에 Youtube 영상을 넣는 방법을 알아보자 - react-native-youtube-iframe # 들어가며 React Native에 youtube를 넣을 때 가장 많이 사용하는 라이브러리는 react-native-youtube이지만, 이 라이브러리는 사용자도 많고, 개발 기간도 오래 되어 상당히 고도화 되어 있는 상태입니다. 그러다보니 기능이 많지만, 막상 최소한의 기능만 가져다 쓰고 싶을 때는 무겁고 복잡하게 느껴질 수 있습니다. 그래서 오늘 소개할 대안이 react-native-youtube-iframe입니다 # 깃헙 페이지와 문서 사이트 GitHub - LonelyCpp/react-native-youtube-iframe: A wrapper of the Youtube-i..

개발/React Native 2021.11.01
반응형