본문 바로가기

프로그래밍94

[React-Native/오픈소스활동] ... does not contain a gradle build 안드로이드 스튜디오 에러 해결 개요 프로젝트 디렉토리를 안드로이드 스튜디오로 여는 경우 아래와 같은 에러가 발생할 수 있습니다. Directory 프로젝트명 does not contain a Gradle build ... 해결 방법 프로젝트 디렉토리가 아닌 프로젝트/android 디렉토리를 안드로이드 스튜디오로 열어보세요. 안드로이드 스튜디오는 프로젝트가 안드로이드 네이티브 프로젝트임을 가정하고 gradle 스크립트를 찾습니다. 프로젝트/android 디렉토리를 열어 gradle 스크립트를 문제없이 찾을 수 있도록 해야 합니다. 은근 많은 분들이 겪으시는 실수 같습니다. 메타 엔지니어 코르티쌤께서도 맞다고 해주셨네요. 참고 링크 React native screen and react safe area view is crashing , .. 2023. 8. 15.
[React-Native] 아키텍처 정리 React-Native의 새로운 아키텍처를 공부해 보고 아주 간단하게 정리해 보았습니다. 정리 좌: 구 아키텍처, 우 : 신 아키텍처 JSC : javascript 엔진으로 apple 사에서 웹브라우저 사파리에 도입하였음 -> 현재 React-Native에서는 Hermes라는 자체 javascript 엔진을 기본 엔진으로 사용 중 codegen : JSI : javascript 엔진에 사용할 수 있는 API로 javascript C++ 소통을 돕는다. Fabric : 렌더링 시스템 TurboModules : 네이티브 기능 활용을 돕는 모듈 관련 글 [React-Native] 구 아키텍처 : 기존 Bridge 를 가진 아키텍처 새로운 아키텍처를 이해하기 위해서는 구 아키텍처를 알아야 합니다. 구 아키텍처에.. 2023. 7. 28.
[React-Native] 아키텍처 : JSI, 렌더링 시스템 Fabric과 TurboModules 이전 브릿지를 사용한 구 아키텍처에서 javascript 코드와 렌더링 시스템과 서로 소통하기 위해선 JSON 으로 변환하는 과정을 반드시 거쳐야 했습니다. 이는 마치 한국인이 아프리카 은데벨레족과 소통하기 위해 중간에 미국인을 두고 번역을 하는 것과 마찬가지입니다. 이러한 구조는 성능 저하 문제를 야기했습니다. JSI (JavaScript Interface) JSI는 자바스크립트 엔진에 추가할 수 있는 API로 javascript와 C++ 오브젝트와 소통이 가능하도록 만들어줍니다. C++ 과의 소통이 가능하다는 점은 크로스플랫폼에서 크나큰 장점이 되는데요, 그 이유는 안드로이드 네이티브 코드는 C/C++로 설계 iOS 는 기본적으로 C/C++을 지원 하기 때문입니다. JSON 으로 변환하여 통신하는 방.. 2023. 7. 28.
[React-Native] 구 아키텍처 : 기존 Bridge 를 가진 아키텍처 새로운 아키텍처를 이해하기 위해서는 구 아키텍처를 알아야 합니다. 구 아키텍처에 포함된 개념은 무엇이고, 구 아키텍처의 문제점은 무엇이었는 지 서술합니다. Bridge 네이티브와 javascript는 동일한 언어를 사용하지 않고, 동일한 아키텍처를 사용하지 않습니다. 브릿지는 javascript 코드와 네이티브 간 통신을 도와줍니다. javascript 코드를 JSON 형태로 전달받아 Shadow Tree 생성에 사용합니다. 생성된 Shadow Tree 정보를 네이티브에 넘겨주어 네이티브 UI를 그립니다. UI 업데이트(아래 스크린 샷 내 Platform UI 부분), 레이아웃 구성(아래 스크린 샷 내 Shadow Tree 부분), JS은 서로 각각 다른 쓰레드에서 실행되며, 이 세 쓰레드는 서로 비동.. 2023. 7. 28.
[React-Native] ERESOLVE While resolving: undefined@undefined 에러 해결하기 발생 에러 npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: undefined@undefined npm ERR! Found: react-native@0.67.4 npm ERR! node_modules/react-native npm ERR! peer react-native@"*" from @react-native-community/cli@6.4.0 npm ERR! node_modules/@react-native-community/cli npm ERR! @react-native-community/cli@"^6.0.0" from react-native@0.67.4 npm ERR! react-n.. 2023. 7. 20.
[React-Native] cli.init is not a function 문제 해결하기 발생 에러 /opt/homebrew/Cellar/react-native-cli/2.0.1/libexec/lib/node_modules/react-native-cli/index.js:302 cli.init(root, projectName); ^ TypeError: cli.init is not a function at run (/opt/homebrew/Cellar/react-native-cli/2.0.1/libexec/lib/node_modules/react-native-cli/index.js:302:7) at createProject (/opt/homebrew/Cellar/react-native-cli/2.0.1/libexec/lib/node_modules/react-native-cli/index.js:2.. 2023. 7. 20.

티스토리툴바