썬이의 IT세상

react-native-track-player 라이브러리를 사용하여 오디오 스트리밍 관련 서비스를 만들기 위해 npm install react-native-track-player --save 라이브러리를 설치하고, 앱을 컴파일할 때 exoplayer 관련하여 컴파일 에러가 뜰 때가 있다. 해결 방법은 간단하다. allprojects { repositories { maven { // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm url("$rootDir/../node_modules/react-native/android") } maven { // Android JSC is installed from npm url..

ReactNative로 앱을 개발하다보면 앱을 디버깅할 때 원래는 잘되었는데 갑자기 컴파일 에러가 뜬다는 등 알 수 없는 에러를 맞닥뜨리게 되는 경우가 많은데, 이 경우에 주로 터미널을 보면 어디서 원인이 되었는 지 알 수 있지만, 그래도 가끔은 Metro Server의 Cache를 초기화 하거나, gradlew를 초기화 함으로써 에러가 간단하게 해결되는 경우가 있다. 그래서 이번 포스팅에는 위 두 가지의 경우에 따른 명령어를 정리해보고자 한다. ✔ Metro Server Cache Reset npm start --reset-cache 위 명령어는 말 그대로 npm 으로 metro server를 시작할 때 서버의 cache를 초기화 시켜주는 명령어이다. ✔ Gradlew clean cd android g..

개인 PC 드라이브에 메모리가 부족하기도 하고 개발용으로 쓰기 이전엔 게임만 했던 데스크탑이라 간만에 PC를 포맷해준 후에 오로지 개발만을 위한 환경으로 구축하기 위해 관련 소프트웨어들을 설치해주고 새로운 마음으로 프로젝트를 진행하려는데 JDK를 17 버전으로 설치해버려서, 이전 프로젝트의 react-native 앱을 빌드하는데는 어려움이 있었다. 전에는 Nodejs를 최신으로 설치해서 머리좀 아팠었는데.. 역시 뭐든 최적화 되어있는 LTS버전이 짱인 것 같다. 이왕 이렇게 된거 다시는 까먹지 않게 하기 위해서 블로그에 남겨두어야겠다. ✔ jdk가 최신 버전임에 에러가 나는 상황 해결 방법 https://www.oracle.com/kr/java/technologies/javase/jdk11-archive..

Execution failed for task ':app:mergeDexDebug'. react native 에서 안드로이드 앱 디버깅 시 위의 메시지가 출력되며 빌드가 되지 않는다면, android\app\build.gradle 파일에서 buildscript { ext { buildToolsVersion = "30.0.2" minSdkVersion = 21 compileSdkVersion = 30 targetSdkVersion = 30 ndkVersion = "21.4.7075529" } defaultConfig { multiDexEnabled true } repositories { google() mavenCentral() } dependencies { classpath("com.android.too..

2022.01.24 - [Study/React,RN] - [React]리액트 훅(Hook)에 대해 알아보자!(useState, useEffect) - 1 [React]리액트 훅(Hook)에 대해 알아보자!(useState, useEffect) - 1 React에서 말하는 Hook은, React 버전 16.8부터 React 요소로 새로 추가되었다. Hook을 이용하면, 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있다. // 그렇다고 Reac k-taeyang.tistory.com 2022.01.25 - [Study/React,RN] - [React]리액트 훅(Hook)에 대해 알아보자!(useState, useEffect) - 2 UseState [Rea..

React Native로 앱을 만들고, npx react-native run-android 명령어를 통해 Android로 앱을 빌드할 때, 개발 환경도 다 조성하고 Android virtual device도 연결이 되었지만 NDK Version이 안맞다며 빌드 에러가 날 때가 있는데, 이런 경우에는 주로 Android SDK 버전 문제일 확률이 높다. 먼저, android\build.gradle 내에서 ext { ... ndkVersion = "xx.x.xxxxxx" ... } 로 되어있는 부분과 동일한 버전의 NDK를 설치해 주어야 하는데, 안드로이드 스튜디오 - Tools - SDK Manager 에서 SDK Tools 탭에 들어간 후 하단의 Show Package Details 를 눌러주면 하단 이..

평소와 같이 RN 앱 개발을 하던 중, 어제까지는 잘되던 react-native run-android 명령어에서 를 뱉어내며 에러가 나던 것이었다. 해결 방법은 매우 간단했다. 에뮬레이터에 설치된 디버깅 전용 앱을 삭제하고 다시 react-native run-android 명령어를 사용해 설치해주면 된다.

fetch를 이용하여 API를 사용할 때, GET 함수를 불러올 경우 위와 같은 에러를 마주할 때가 있다. 예를 들면, fetch(`${IP}/users/${props.id}/1`) .then(response => response.json()) .then(data => console.log(data)) 이런 식으로 GET 호출하였다 치면 거의 100% 위와 같은 에러를 마주할 것이다. 해결 방법은 아주 간단하다. fetch(`${IP}/users/${props.id}/1`) .then(response => response.json()) .then(data => console.log(data)) .catch(error => {console.log(error)}) 이런식으로 .catch 만 붙여주면 아주 간..

만들고있는 서비스에서 서비스 이용약관을 소스에 때려박아보니 쓸데없이 가독성이 떨어지는 경향이 있어 //#region - //#endregion 을 사용하여 간단히 보려고 했다. 이후 추가작업도 마무리 한 뒤에 잘됐나 보려고 서비스 이용약관 탭을 누르는 순간 Text Strings must be rendered within a component 에러가 떠서 1시간을 허비하게 만들었다. 처음엔 뭐가 잘못된지 몰라서 경우의 수도 다 따져보고 했는데, 결국엔 가독성 좋자고 적어놨던 region 때문이었다 ㅠㅠ 지우고 다시 디버깅하니 문제 해결! C# 개발할 때 소스코드 이쁘게 정리하려고 했던 버릇때문에 시간만 날려먹었다 다음엔 그냥 코드를 최대한 줄여서 쓰는 습관을 들여야지.. 원인은 region 기능을 JSX..

간만에 Private Box의 코드를 정리하고 깃헙에 커밋하려는데 git add . 명령어를 치니 위와 같은 경고창이 뜨면서 add가 되지 않았다. 찾아보니 매우 간단한 문제였는데, VS Code상의 하단을 보면 CRLF 라고 써있는 곳이 보일 것이다. 위의 경고창이 떴다면 나같은 경우에는 yarn.lock 파일에 들어갔을 때 CRLF 라고 써있는 부분이 LF 라고 되어있을 것이다. LF 라고 써있는 부분을 클릭하고 CRLF로 변경해주면 아주 간단히 해결된다.