차근차근 생활 & 코딩

안녕하세요. 이번 시간에는 구글 배포 후 카카오 로그인에 대해서 알아보도록 하겠습니다. 개발 할 때는 카카오 로그인이 잘 됩니다. 하지만 개발 후 구글 플레이어에 배포를 하면 카카오 로그인이 되지 않는 현상을 확인하게 됩니다. 카카오에서도 배포를 위해 SHA-1를 추가로 인증해 주어야 합니다. 구글 콘솔에 있는 키해시를 입력해야 됩니다. 하시만 SH1 인증서는 키해시와 다른 방식으로 작성이 되어 있습니다. 구글 콘솔에 SHA-1 인증서 지문을 base64로 컨버팅 해 주셔야합니다. Step 1. SHA-1 인증서 컨버팅 하기 ① 구글 콘솔에 접속하여 SHA-1 인정서 지문을 복사하도록 합니다. ② CMD 터미널을 실행하여 아래 명령어를 입력해 주도록 합니다. echo | xxd -r -p | openss..

안녕하세요. 이번 시간에는 카카오 키해시 등록하는 방법에 대해 알아보도록 하겠습니다. Step 1. 키 해시 수정하기 내 애플리케이션 > 앱 설정 > 플랫폼에 접속 후 수정 버튼을 클릭해 줍니다. 키 해시 여러 줄 바꿈으로 여러개를 등록 할 수 있어 등록 후 저장 버튼을 눌러 주도록 합니다. 간단히 등록이 됩니다. 수고하셨습니다.

카카오, 구글, 네이버 api 연동 시 키 해시를 입력해야 접속이 됩니다. 이럴 때 개발용(Debug Key)과 배포용(Release key) 두 가지를 가져오셔야 됩니다. #Debug Key 아래 코드 명령어를 치시면 디버그 작업 개발용 키 해시 값을 얻을 수 있습니다. keytool -exportcert -alias androiddebugkey -keystore ./android/app/debug.keystore -storepass android -keypass android | openssl sha1 -binary | openssl base64 명령어 입력 후 cmd 창에 예를 들어 Xo8123214214215yr9iU= 같은 문자가 나타나게 됩니다. #Release key 아래 링크에서 키값을 생..

안녕하세요. 이번 시간에는 앱 아이콘의 이름을 변경하는 것에 대해 알아보도록 하겠습니다. 어렵지 않으며 간단합니다. 파일 수정하기 \android\app\src\main\res\values\strings.xml 경로에 있는 appicons 부분을 수정해 주시면 됩니다. appicons 수고하셨습니다.

안드로이드 편 Part 1. 웹뷰에서 React Native로 메세지 데이터 보내기 Step 1. 설치하기 웹뷰를 사용 할 수 있도록 아래 명령어를 통해 라이브러리를 설치해 주시면 됩니다. npm i react-native-webview Setp 2. 웹뷰에서 rn으로 데이터 송신(전체 코드) import {View, Alert} from 'react-native'; import React, {useRef} from 'react'; import {WebView} from 'react-native-webview'; export default function App() { const html = ` Send `; const webviewRef = useRef(); /** 웹뷰 ref */ const hand..

안녕하세요. 이번 시간에는 안드로이드 권한 설정 하는 방법에 대해 알려드리도록 하겠습니다. 안드로이드(Android) 권한 설정 android > app > src > main > AndroidManifest.xml 경로에 아래 코드를 추가해 주도록 합니다. 권한요청 아래 코드를 활용하여 권한을 요청하도록 합니다. import { PermissionsAndroid } from 'react-native'; const requestPermission = async () => { if (Platform.OS === 'android') { await PermissionsAndroid.requestMultiple([ // PermissionsAndroid.PERMISSIONS.CAMERA, PermissionsA..

안녕하세요. 환경 변수는 API KEY를 활용해서 숨기는 방법도 있지만, 다양한 개발 환경과 관련된 다양한 파일에 변수를 저장할 수 있으며, 환경변수를 사용하면 보다 쉽게 관리 할 수 있습니다. 그럼 이번 시간에는 환경 변수를 활용하여 노출이 되면 안되는 API KEY를 숨기는 방법에 대해서 알아보도록 하겠습니다. Step1. 설치 환경 변수를 활용할 수 있는 라이브러리를 설치하도록 하겠습니다. yarn add react-native-config 또는 npm install --save react-native-config Step2. .env 파일 생성 프로젝트 내 최상위에 .env 파일을 만들어 준 후 github에 업로드 되지 않도록 .gitignore에 추가해주시면 됩니다. Step3. 안드로이드 설..

안녕하세요. 이번 시간에는 파이어베이스 구글 로그인에 대해 알아보도록 하겠습니다. 내용이 다소 복잡 할 수 있으니 천천히 따라 해보시면 좋을 듯합니다. Step1. Firebase 세팅 ① 프로젝트 추가하기 ② 프로젝트 이름을 정합니다. ③ 프로젝트 이름을 정하셨으면 계속 버튼을 클릭합니다. ④ 애널리틱스 사용 설정을 Off 해주도록 합니다. (통계 분석을 하시고 싶은 분들께서는 On으로 설정하셔도 됩니다.) ⑤ 프로젝트 만들기 버튼을 클릭하여 프로젝트를 만들도록 하겠습니다. ⑥ 새 프로젝트가 준비되었습니다. 이제 신규 프로젝트가 생성된 것을 확인 할 수 있습니다. ⑦ 이제 안드로이드 아이콘 버튼을 클릭하여 앱을 추가하여 시작하도록 하겠습니다. ⑧ Android 패키지 이름을 등록해 주도록 합니다. (자..