728x90

Development 69

[study] reactNative - 240111

장점 : -하나의 코드로 관리, 러닝커브 높은 React사용 -코드푸시로 빠른 업데이트 -> 비용절감 -FastRefresh -오픈소스 플랫폼 단점 : -일부기능 Native접근 필요 -오픈소스, 라이브러리 의존도 -성능 -잦은 업데이트 Event를 전달하기 위한 함수를 제공 -onCreate:애플리케이션 실행될 때 최초 호출 -onTerminate:애플리케이션 종료될 때 호출 Manifest : android 앱의 메타정보를 요약해서 선언해둔것

[error] Failed to install the app. Looks like your Android environment is not properly set. Please go to https://reactnative.dev/docs/0.73/environment-setup?os=macos&platform=android&guide=native#jdk-studio and follow the React Native CLI QuickStart gui..

npm run android를 하면 자꾸 저런 에러가 나면서 빌드가 안된다. npm install 을 해보아도, gradle 위치를 변경해 보아도 잘 안되었는데, 아래 사이트에서 방법을 적용하니 되었다. https://aboveimagine.tistory.com/126 [RN] 맥OS에서 리액트 네이티브 설치하기 feat 오류 폭탄🥲 리액트 네이티브란 리액트 네이티브(React Native)는 페이스북이 개발한 오픈 소스 모바일 애플리케이션 프레임워크이다. 안드로이드, iOS, 웹, UWP용 애플리케이션을 개발하기 위해 사용되며, 개발 aboveimagine.tistory.com 바로 brew install --cask adoptopenjdk // jdk를 업데이트했어야 했나 보다..

Development/Error 2024.01.09

[error] kakao-share android error

이런 이미지가 뜬 경우 kakao developers에서 애플리케이션에 들어가 ios/android 플랫폼을 등록해 주면 된다. https://developers.kakao.com/console/app 카카오계정 accounts.kakao.com -ios의 경우 xcode에 있던 번들 Id -android의 경우 androidManifest.xml의 package 속성을 확인하라는데 찾아봐도 없다. 그럴 때는 firebase 프로젝트 설정 >> 내 앱 카테고리에서 패키지 이름을 확인할 수 있다. ios는 번들 Id 입력 후 문제없이 공유기능이 가능하였지만, android는 계속 실패하였다. 패키지 이름만 입력하면 되는 것이 아닌가 보다. 다시 빌드를 해보고 있는 중이다. 빌드가 될 때도 있고, 다시 실패..

Development/Error 2024.01.09

[study] react-native-kakao-share-link

카카오로 공유하기 기능 적용 아래 사이트를 보고 잘 안 되는 부분만 복습할 겸 기록해 둔다. https://github.com/millo-L/react-native-kakao-share-link GitHub - millo-L/react-native-kakao-share-link: 리액트 네이티브 카카오 링크 오픈 소스 리액트 네이티브 카카오 링크 오픈 소스 . Contribute to millo-L/react-native-kakao-share-link development by creating an account on GitHub. github.com 1. npm install react-native-kakao-share-link 2. ios >> xcode 프로젝트 info 탭 >> url types ..

[error] no firebase app ' default ' has been created - call firebase.initializeapp()--reactNative-ios

xcode 에서 AppDelegate.m 파일에 코드입력을 했더니 해결됨 #import "AppDelegate.h" #import // 이거 추가 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [FIRApp configure]; // 이거 추가 } 그래도 동일한 에러가 계속 났는데, podfile에 추가하는 코드 중에 config = use_native_modules! use_frameworks!:linkage => :static // 이거를 :linkage => :static 없이 use_frameworks! // 이렇게만 적어서 빌드해보니 정상 작동하..

Development/Error 2024.01.04

[study] react-native 프로젝트를 파이어베이스와 연동하기

https://firebase.google.com/?hl=ko Firebase | Google’s Mobile and Web App Development Platform 개발자가 사용자가 좋아할 만한 앱과 게임을 빌드하도록 지원하는 Google의 모바일 및 웹 앱 개발 플랫폼인 Firebase에 대해 알아보세요. firebase.google.com 1. 시작하기 눌러 프로젝트를 생성한다. 2. ios / android 앱 연동하기 - ios : Apple번들ID --> xcode 최상단 프로젝트 폴더 클릭 > Singnign&Capabilities탭 >> IOS 박스에 있는 BundleIdentifier를 복사하여 붙여넣는다. (분홍색박스) 구성파일 다운로드하여 드래그하여 붙여넣는다(빨간색박스) -안드로..

[study] reactnative 프로젝트 만들기

공부를 할 때마다 새롭게 알게되는 부분이 많은데, 한 폴더에 계속 누적하다보니 명확히 알 수 없고, 읽기 복잡하기도해서 앞으로는 새로운 것을 배울 때마다 새로운 프로젝트를 만들어 commit 하기로 했다. vscode >>root폴더(프로젝트를 계속 누적할 곳) npx react-native init 'fileName' ++ 가끔 npm start를 할 때 안드로이드/ ios가 잘 안열리는 경우가 있는데 내가 알게 된 문제 해결 -안드로이드 androidStudio >> fileName을 오픈하는 것이 아닌 androidStudio >> fileName >> android폴더를 오픈한다. 이후 프로젝트의 jdk 설정이라던지, nativeModule 작업을 하기 쉬웠다. -ios xcode >> fileN..

[study] git repository-branch 만들고, 원격저장하기

개인 공부용으로 gitgub repository를 만들었고, 회사에 있는 동안에도 공부할 수 있는시간이 잇어 틈틈이 해당 repository로 커밋하고싶은 상황이다. 계정 공유자를 추가하는 방법도 있으나, 복습한다는 생각으로 개인 조직을 만들어서 회사계정을 추가하고, 회사계정의 권한을 소유자로 변경하여 토큰 발급 후 클론코딩하였다. 순서 : 1. 개인깃허브 아이디로 조직 만들기 2. 조직이 만들어지면 해당 레포지토리로 들어가서 팀원을 추가한다. 현재 나는 추가되어있어서 people이 보이지만 초기에는 안보일것이고, invite someone을 눌러 초대하면 된다. 3. 초대받은 계정 (회사계정)으로 들어가 수락한다. 4. 개인계정으로 다시 들어가 회사계정을 팀원이 아닌 owner로 권한 변경해준다. 5...

Development 2024.01.03

[study] 20240103 react-native-reanimated

react-native-reanimated *worklet -작은 조각의 javascript 조각 -뷰 속성을 업데이트 하거나, 이벤트에 반응할 때 UI Thread에서 바로 실행시킬 수 있는 JS조각 생성방법 : 함수 상단에 worklet이라는 string 추가 예) const funcA=()=>{ "worklet" ... } *SharedValues -Js Thread와 Main Thread 모두에서 읽기 또는 수정이 가능 한 값 Main Thread에서는 값이 변경됨을 바로 감지할 수 있어 읽기에 특화됨 -useAnimatedScrollHandler hook -setValue directly 예) const scrollOffset = useAnimatedScrollHandler({ onScroll:..

728x90