리액트 네이티브로 앱을 개발하다 보면 빌드 오류나 시뮬레이터 기동 시 캐시 문제, 의존성 문제 등으로 인해 예상치 못한 에러가 발생하는 경우가 있습니다. 이런 경우, 클린 작업이나 캐시 삭제를 통해 문제를 해결할 수 있습니다.이번 포스트에서는 리액트 네이티브 개발 중 자주 사용하게 되는 Clean, 캐시 삭제 명령어와 기본적인 라이브러리 설치 방법을 정리해 봅니다. Clean & 캐시 삭제안드로이드(Gradle) Clean안드로이드 빌드 관련 문제 해결을 위해, 다음 명령어로 Gradle 캐시와 빌드 아티팩트를 초기화할 수 있습니다.# 프로젝트 루트에서 android 폴더로 이동 후 실행cd android/ && ./gradlew clean build --refresh-dependenciescd ../n..

새해 들어서 React Native로 새 사이드 프로젝트를 진행하고 있습니다. 이번 프로젝트에서는 사용자 인증을 위해 카카오톡 로그인을 간편하게 구현하기로 했습니다. 관련 자료를 찾아보니 예전 자료들이 많고 0.76 버전 이상의 버전에 대해서는 자료가 많이 없어서 제가 적용한 과정에 대해 설명하려고 합니다.(이번 포스트에서는 react-native-seoul/kakao-login 라이브러리를 사용하여 카카오톡 로그인을 구현하는 방법을 다룹니다.) 내 애플리케이션 생성 하기우선, 카카오 내 애플리케이션을 생성하는 과정부터 시작하겠습니다.카카오 개발자 사이트에 접속합니다."내 애플리케이션" -> "애플리케이션 추가하기" 버튼을 클릭하여 앱을 생성합니다.생성 후, 카카오 로그인과 OpenID Connect 활..

이번 글은 React Native에서 절대경로 설정하는 방법에 대해 작성하려고 합니다. RN은 워낙 버전 크러쉬로 악명 높지만 절대경로 설정 방법은 기존의 React 웹 프로젝트와 크게 다른 점은 없기 때문에 쉽게 설정할 수 있습니다.  설치우선 babel 관련 프리셋과 플러그인을 설치해 줍니다.// npmnpm install --save-dev @babel/preset-react// yarnyarn add @babel/preset-react --dev 그 다음 플러그인을 사용해요 경로 별칭(alias)을 설정해 주기 위해 Babel의 module resolver을 개발 의존성으로 설치합니다.// npmnpm install --save-dev babel-plugin-module-resolver// yar..

요즘 RN을 새롭게 배우고 있는데 Flutter로 개발하던 시절의 좋았던 개발 경험이 자꾸 생각나는 거 같다.  그 이유를 생각해 보면 IDE를 통한 편리한 개발 환경 덕분이였던 거 같은데,오늘은 Flutter의 IDE와 유사한 React Native IDE에 대해서 설치 방법과 기능을 간단히 작성해 보려고 한다. React Native IDE 공식 홈페이지 React Native IDE 설치 방법React Native IDE는 다른 IDE들 처럼 codebase 근처에 두고 개발하며 바로바로 업데이트 내역을 확인할 수 있다.다만 아직 배타 버전이며 macOS의 개발만 지원하고 있다.   우선 홈페이지에 접속한 후 Download from VSCode marketplace 버튼을 눌러서 익스텐션을 사용..