React Native cli Apple 로그인 연동하기

2024. 8. 3. 16:23·React Native/JavaScript
목차
  1. 환경 설정 
  2. 환경 설정 - iOS
반응형

끝이 다가오고 있다. 

네이버, 카카오, 구글을 구현하고 이번엔 애플 로그인을 구현할 계획이다. 

 

작업 환경은 iOS ( Macbook )이다. 

 

환경 설정 

환경을 설치하는 것은 따로 올리지 않으려고 했지만 첫 환경을 구성하는 단계에서 달라질 수 있을 것 같아서 올린다.

공식 사이트에서 without Framework에서 내용을 보고 설치하였다. 

npx @react-native-community/cli@latest init [프로젝트명]

 

프로젝트 구성이 끝나면 바로 애플 로그인 라이브러리를 설치하였다. 

yarn add @invertase/react-native-apple-authentication

 

설치가 끝나면 iOS환경에서도 로그인이 필요하므로 npx pod-install 명령어를 바로 사용해서 pod 라이브러리를

추가로 설치해준다. 

npx pod-install

 

여기까지 설치가 끝나면 프로젝트에서 설치할 부분은 끝이다.

지금까지의 버전을 공유하자면 

"dependencies": {
  "@invertase/react-native-apple-authentication": "^2.3.0",
  "react": "18.2.0",
  "react-native": "0.74.2"
},
"devDependencies": {
  "@babel/core": "^7.20.0",
  "@babel/preset-env": "^7.20.0",
  "@babel/runtime": "^7.20.0",
  "@react-native/babel-preset": "0.74.84",
  "@react-native/eslint-config": "0.74.84",
  "@react-native/metro-config": "0.74.84",
  "@react-native/typescript-config": "0.74.84",
  "@types/react": "^18.2.6",
  "@types/react-test-renderer": "^18.0.0",
  "babel-jest": "^29.6.3",
  "eslint": "^8.19.0",
  "jest": "^29.6.3",
  "prettier": "2.8.8",
  "react-test-renderer": "18.2.0",
  "typescript": "5.0.4"
},

 

다음과 같다. 

 

환경 설정 - iOS

애플 로그인은 라이브러리 깃허브에 그냥 떠먹여주고 있지만 내가 이런 글을 작성하는 이유는 언제가 사라질 수 있고 

확인할 수 없는 경우가 생긴다면 링크를 띡 하고 공유했을 때 곤란한 경우가 발생하기 때문에 작성하겠다.... 

 

애플 개발자 센터에서 이것저것 등록을 해줘야 한다. 

 

Identifiers 설정

identifiers를 설정해줘야 하는데 없다면 파란색 + 버튼을 눌러서 App ID를 만들어준다. 

그렇게 되면 App ID Configuration에서 Sign In with Apple을 발견할 수 있다. 

Edit을 눌러서 선택지가 Enable as a primary App ID인지 확인해준다. 

Bundle ID와 Description을 등록하고 저장을 한다. 

 

Keys 설정 

Identifiers 설정이 끝나면 Keys를 등록해줘야 한다. + 버튼을 눌러서 새롭게 등록해주자. 

Key Name과 Sign In with Apple을 선택해준다. 그리고 Configure을 들어가서 앞서 만들었던 Identifiers를

Primary App ID에서 골라준다. 끝나면 Save를 눌러준다. 

마지막으로 저장해준다. 

 

xcode 설정 

개발자 센터에서 설정이 끝나면 Xcode에서 추가로 설정을 해준다. 

another project로 작업중인 프로젝트를 선택해준다. 

target에서 프로젝트를 선택해준다. 

Signing & Capabilities 설정을 들어가서 + Capability를 눌러준다. 

그러면 Sign in with Apple이 나옵니다. 그것을 선택하면 아래에 Sign in with Apple이 생깁니다. 

 

프로젝트에서도 해당 설정으로 파일이 추가되어 있을 것입니다. 

 

이렇게 설정하면 iOS 설정은 끝이다. 

 

반응형
저작자표시 비영리 변경금지 (새창열림)

'React Native > JavaScript' 카테고리의 다른 글

React Native cli Google 로그인 연동하기  (2) 2024.07.24
React Native cli Naver & Kakao 연동하기  (1) 2024.07.20
React Native cli Naver 로그인 연동하기  (2) 2024.07.17
React Native cli Kakao 로그인 연동하기  (2) 2024.07.14
React Native 개발 환경 구성하기  (2) 2024.05.27
  1. 환경 설정 
  2. 환경 설정 - iOS
'React Native/JavaScript' 카테고리의 다른 글
  • React Native cli Google 로그인 연동하기
  • React Native cli Naver & Kakao 연동하기
  • React Native cli Naver 로그인 연동하기
  • React Native cli Kakao 로그인 연동하기
잉여개발자
잉여개발자
풀스택 개발자를 목표로 잉여롭게 개발 공부도 하면서 다양한 취미 생활도 즐기고 있는 잉여 개발자입니다.
  • 잉여개발자
    잉여로운 개발일지
    잉여개발자
    • 분류 전체보기 (789)
      • 개발정보 (36)
      • 개발환경 (7)
      • 개발생활 (19)
      • React (141)
        • 이론 (23)
        • 기능 (12)
        • 실험실 (88)
        • 버그 (6)
        • 패스트캠퍼스 (9)
        • Npm (3)
      • React Native (28)
        • 공통 (6)
        • TypeScript (3)
        • JavaScript (18)
        • 버그 (1)
      • Next.js (30)
        • 이론 (13)
        • 실험실 (13)
        • 버그 (3)
      • Web (35)
      • 알고리즘 (202)
        • 풀이 힌트 (39)
      • JavaScript (47)
      • TypeScript (29)
        • 기초 (27)
        • 실험실 (2)
      • Node.js (13)
        • 이론 (0)
        • 기능 (3)
        • 실험실 (9)
        • 버그 (1)
      • 도커 (4)
      • CCNA (22)
        • 이론 (4)
        • 문제 (18)
      • 취미생활 (167)
        • 잉여로운 칵테일 (2)
        • 잉여의 식물키우기 (130)
        • 잉여로운 여행기 (11)
        • 잉여의 제2외국어 (21)
        • 잉여로운 책장 (2)
      • Java (1)
        • Java의 정석 (1)
      • 꿀팁 공유 (3)
  • 태그

    타일러영어
    javascript
    webpack
    네트워크
    바질
    Babel
    CSS
    바질 키우기
    영어회화
    Node.js
    영어독학
    자바스크립트
    리얼클래스
    식물
    Docker
    CCNA
    네이버 부스트캠프
    타입스크립트
    다이소
    typescript
    react
    redux
    next.js
    프로그래머스
    리액트
    ChatGPT
    리얼학습일기
    ReactNative
    알고리즘
    덤프
  • hELLO· Designed By정상우.v4.10.1
잉여개발자
React Native cli Apple 로그인 연동하기

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.