RN의 앱 로그인 과정 + DB연동 (3)

엑세스 토큰과 리프레쉬 토큰으로 구성

앱 실행 → 리프레쉬 토큰 API 호출, 성공/실패로 결과값 받기

실패시 → 신규 유저 or 만료된 유저(토큰 만료) → 저장된 토큰 지우고 재 로그인 → 홈으로 이동

성공시 → 홈 화면

npm i react-native-encrypted-storage

encryptStorage.js를 만들어주는데 사용법 자체는 웹의 로컬 스토리지와 거의 똑같은데,

대신 async await 문법을 사용해 주어야 한다!

그리고 다시 npm start 후 android studio도 껐다 키자! ( 그냥 설치하고 start 했더니 오류 발생.. 다시 껐다 키니까 오류 사라짐! )

다음으로는 postgresql, pgadmin 설치!

환경설정이 가장 어렵다.. postgresql 설치하면 자동으로 pgAdmin4가 설치되는데

실행하니까 이런 오류가 계속 떴다..

해결법 = 구글링 + gpt

gpt가 백업하는 상황에서의 문제라고 알려줬지만 gpt 해결방법으로는 안됐다.. 그래서

윈도우 PostgreSQL 설치 + pgAdmin4 실행 오류 해결

PostgreSQL의 다양한 버전들이 우리의 선택을 기다리고 있습니다. 윈도우의 비트 버전에 맞게, 필요한 버전으로 선택하시면 됩니다. 저는 windows x86–64, 13.3 현재 최신 버전으로 설치해 보겠습니다.

medium.com

pgAdmin 폴더를 삭제하고 pgAdmin4 단독 프로그램 설치 후 실행했더니.. 됐다!

그 후에는 착착 잘 진행돼서 DB연동까지 끝내놨다!

로그인에 필요한 부분들 공부하는데 제네릭과 JSON 처리법이 자주 등장한다.

암호화된 스토리지에 데이터 저장하는 함수를 제네릭으로 쓰고 있다.

제네릭.. 엄청 많이 나온다! 제대로 이해하고 사용하고 싶어서 계속 공부하는 중..

const setEncryptStorage = async <T>(key: string, data: T) => {
  await EncryptStorage.setItem(key, JSON.stringify(data));
};

JSON형식의 키:값도 많이 사용한다.. JSON에 대해서도 깊이 공부해보고 싶다!

리액트나 네이티브나 사용하기 까다로운 부분들을 npm install ~ 로 사용하기 쉽게 해주는 거 같다.

제대로 알면 진짜 쓰기 편한 언어인 것 같은 느낌이 공부할 때마다 느껴진다.. 잘 배워보고 싶다!

tmi : 달, 하늘 사진찍는걸 좋아한다!

달은 아무것도 안 보이는 깜깜한 밤에 혼자 밝게 떠 있는걸 보면 멋있기도 하고 든든한 느낌이라 그냥 보고 있으면 기분이 좋아진다!!

하늘은 매일 똑같은 하늘이 없을 만큼 항상 색도 다르고 모양도 다 달라서 기억하고 싶은 마음에 자주 찍는거 같다!

썸네일 만큼은 내가 찍은 사진으로 해야지! 히히

ys2 notepad