728x90

Development/ReactNative 38

[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 ..

[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] 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:..

[study] 240102

reactNative 장점 : -하나의 코드로 관리, 러닝커브 높은 React사용 -코드푸시로 빠른 업데이트 -> 비용절감 -FastRefresh -오픈소스 플랫폼 단점 : -일부기능 Native접근 필요 -오픈소스, 라이브러리 의존도 -성능 -잦은 업데이트 안드로이드 application에서 전체 앱 상태를 관리하는 class Event를 전달하기 위한 함수를 제공 -onCreate:어플리케이션 실행될때 최초 호출 -onTerminate:어플리케이션 종료될 때 호출 Manifest : android 앱의 메타정보를 요약해서 선언해둔것 Permissions 자주 사용하는 권한 #1 사진관련 ios - NSPhotoLibraryUsageDescription Android - READ_EXTERNAL_STO..

[study] navigation

react-native에서 정말 많이 사용하고, 그만큼 중요한 내비게이션이다. 아래 링크를 정말 많이 보고, 참고하고, 적용해 보았다. https://reactnavigation.org/ React Navigation | React Navigation Routing and navigation for your React Native apps reactnavigation.org 위 사이트에 나온 방법대로 내비게이션을 설치했다면, 내가 사용하는 방법은 이렇다. const navigation = useNavigation(); 사용하는 곳에 useNavigation()을 선언해 주고, navigation.navigate(), navigation.goBack(), navigation.push(), 등의 함수를 사용..

728x90