kasumil의 코딩 공작소

일단 딥링크와 유니버셜링크, 앱링크를 많이 들어봤을것이다. 해당 설명에 대한 자세한 내용은 하단 링크 참조 https://help.dfinery.io/hc/ko/articles/360039757433-%EB%94%A5%EB%A7%81%ED%81%AC-Deeplink-URI%EC%8A%A4%ED%82%B4-%EC%9C%A0%EB%8B%88%EB%B2%84%EC%85%9C-%EB%A7%81%ED%81%AC-%EC%95%B1%EB%A7%81%ED%81%AC-%EA%B5%AC%EB%B6%84%EA%B3%BC-%EC%9D%B4%ED%95%B4 해당 내용을 이해하고 진행하면된다. https://reactnavigation.org/docs/deep-linking/ React Navigation reactnavigat..

onEndReached 함수 호출 부분. onEndReachedThreshold FlatList의 뷰 위치 설정. 해당 내용을 분석하면 전체 크기에 80%에 도착하면 console을 찍게 해놨다. onEndReachedThreshold={0.8} onEndReached= {() => { console.log(80);} 요렇게 쓰면 해당 무한 스크롤링 이벤트 기초부분이 완성된다. 해당 코드에 도착하면 append 식으로 구현하면되니까. 하지만 animation으로 숨겨졌다 보여졌다하는 기능들은 해당 방식으로 구현이 불가능하다. onScroll을 통해서 유저가 올렸다 내렸다 하는 해당 부분을 감지하는 로직을 추가해야 해당 부분이 완성된다.

// 1. 프로젝트 생성 npx react-native init webviewtest // 2. 라이브러리 설치 yarn add react-native-webview or npm install --save react-native-webview // 3. pod install ios라면 필수 cd ios pod install // 4. android 설정 // android/gradle.properties 파일 내 하단 추가 android.useAndroidX=true android.enableJetifier=true // 5. 리액트네이티브 버전 고정 명령어. npm config set save-exact=true // 이게 기초 세팅. //App.js import React, { useRef } fro..

require_relative '../node_modules/react-native/scripts/react_native_pods' require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules' platform :ios, '11.0' install! 'cocoapods', :deterministic_uuids => false target 'AwesomeProject' do config = use_native_modules! # Flags change depending on the env values. flags = get_default_flags() use_react_native!( :path => con..

기존에 개발하다가 때려친 사이드 프로젝트를 진행하고자한다. 이걸 왜 하느냐? 그냥, RN으로 어플 하나 만들어서 써보려고. 일단 이전에 날 좌절시킨 이유로 UI를 만들어보기로 했다. Template을 찾아봤는데, 없네..? 왜 그런가 했더니 expo 전용으로 나왔거나 아니면 유료더라. 그래서 찾아봤더니 템플릿이 필요가 없더라. 그냥 UI를 불러서 구성하면 되는 것이었다. 설치해도 왜 안됨? 이러고 있었는데, 설치할 게 없청많더라. 4개를 기본으로 설치해야 작동. 차라리 부트스트랩이 나은 것 같은데 말이지. "react": "17.0.2", "react-native": "0.67.3", "react-native-elements": "3.4.2", "react-native-linear-gradient": "..

분명 신규프로젝트로 npx react-native init 프로젝트명 이렇게 했는데, 스튜디오에서 작동이 되지 않는다. 왜 그런것인가? 했는데, Desktop 경로인 것에는 한글이 없고, 바탕화면 폴더에서는 한글 경로가 껴버리는 바람에 이런 것이었다. 안드로이드 스튜디오에서 컴파일될때 한글이나 특수문자가 끼니 해당 문자가 컴파일 경로에서 방해되어 해당 부분이 작동되지 않던 것. 괜히 그래들 버전을 7.2에서 6.7로 변경하고 안드로이드 스튜디오 SDK 파일 날리고 뻘짓했었다. https://blog.naver.com/psjin312/222334408580 error: internal/modules/cjs/loader.js:883 다음과 같은 에러가 발생했다. Terminal에서 npm start 실행 시..

https://marketplace.visualstudio.com/items?itemName=jundat95.react-native-snippet React Native Snippet - Visual Studio Marketplace Extension for Visual Studio Code - React Native, Typescript React Native, StyleSheet, Redux Snippet marketplace.visualstudio.com 원래는 스니펫을 일일히 설정해줘야하는데, 귀-찮. 누가 이걸 vscode 확장 프로그램으로 만들어놨다. 이것이 누군가에게는 쓸모없을지라도여러 개의 반복되는 것을 치는 것은 매우 귀찮다. Console clg→ console.log(object) c..

- 보통 대부분의 React Native 교재에선 보통 styled-component로 css를 컨트롤 할 것이다. 하지만, 회사에서 유지보수 측면에선 좋은 것은 아니므로 css를 한개에서 컨트롤 하는 것이 나을 것이다. 그렇기에 한개에서 컨트롤 하는 것을 적어보려고 한다. 호출 방법은 간단하다. const styles = require('../../cssstyle/StyleSheet').member; //css 위와 같이 styles에 함수 설정을 하고 해당 값으로 접근하여 해당 설정한 값을 보면 된다. css파일에선 이렇게 구성하여 놓는다. const { StyleSheet } = require('react-native'); module.exports = { member: StyleSheet.crea..

해결방법 : Google Cloud API화면의 OAuth인증화면으로 들어가, 테스트 상태를 출시 상태로 변경하면 해결된다 출시 상태 후 다시 언제든지 테스트 상태로 돌아올 수 있으니 부담없이 변경하여도 된다. 최근부터 이 문제가 발생하기 시작한 것 같은데, 기존에 OAuth인증을 정상적으로 진행한 계정의 경우엔 아무 문제가 생기지 않는다. 출처 devgod.tistory.com/41 [Android/GPGS] Google Login/OAuth Infinite loop/loading gpgs를 연동후 EnableSaveGames옵션을 활성화 하면 로그인 후 흰 화면의 OAuth인증화면이 무한 로딩 걸리는 문제가 발생한다. 해결방법 : Google Cloud API화면의 OAuth인증화면으로 들어가, 테스..

github.com/react-native-google-signin/google-signin react-native-google-signin/google-signin Google Sign-in for your React Native applications. Contribute to react-native-google-signin/google-signin development by creating an account on GitHub. github.com 구글 로그인 연결을 하려고 한다. 난 firebase를 사용하지 않아야 하므로 더 어려웠다.(회사에서 쓸건데 돈내는 것을 써야한다면 욕먹으니까) 이전 React에서 웹에서도 clientid를 주는데 이건 어디에서 줘야하지? 기존에는 developer er..