Frontend/REACT_NATIVE 20

REACT-NATIVE- ios Splash

1. react-native-splash-scr yarn add react-native-splash-screen 2. cd ios/ pod install 실행 3. App.tsx에서 스플래쉬 종료 코드 추가해주기 import SplashScreen from "react-native-splash-screen"; function App() { React.useEffect(() => { try { setTimeout(() => { SplashScreen.hide(); /** 추가 **/ }, 2000); /** 스플래시 시간 조절 (2초) **/ } catch (e) { console.warn("에러발생"); console.warn(e); } }); return ( ); } export default App;..

REACT-NATIVE - 아이폰 기본 폰트 사이즈 문제

시뮬레이터를 통해서 앱을 개발하다가 알람 기능을 추가하려고 실기기로 연결했는데 갑자기 모든 폰트가 엄청 엄청 작게 보이는 문제가 발생했다. 시뮬레이터랑 실기기랑 차이가 있나 싶어서 이리저리 확인해봤는데 실제로 디자인이랑 실기기랑 사이즈 크기가 너무 많이 났다ㅠㅠ 다른 건 다 괜찮은데 왜 ,, 폰트 사이즈만 이러지? 회사 사람들 다 불러서 다 같이 고민했는데 답이 안 나와서 한참을 우울해하고 있었는데 문득 아이폰 기본 폰트 설정이 떠올랐고 확안해 보니 그것 때문이었다!!!! ㅠㅠㅠㅠㅠㅠ세상에나 사람들 마다 각자 아이폰 기본 폰트 설정을 다르게 하는걸 잠시 망각,,,, 그래서 구글링 해보니까 기본적으로 리액트 네이티브 에서 사용하는 는 allowFontScaling 프로퍼티가 true로 되어있어서 설정된 폰..

REACT-NATIVE - 카카오 로그인 구현하기 (iOS)

1. react-native-seoul/kakao-login 다운로드하기 yarn add @react-native-seoul/kakao-login pod install//잊지말기 //혹시 오류 나면 arch -x86_64 pod install https://github.com/react-native-seoul/react-native-kakao-login GitHub - react-native-seoul/react-native-kakao-login: react-native native module for Kakao sign in. react-native native module for Kakao sign in. Contribute to react-native-seoul/react-native-kakao-l..

REACT-NATIVE - 스택 내비게이션에 props값 넘기는 법

✔️ 사용 방법 //stacknavigaiton 있는 곳! const [token ,setToken] = useState("") {return }}/> //Login.tsx interface Props { setToken: Dispatch; token: string; } function Login ({setToken, token} : Props){ return ( 로그인 페이지 :{toekn} ) } export default Login; props로 값을 넘길 때 타입 스크립트에서는 항상 받아온 props의 값을 선언해주는 것을 잊으면 안 된다!

REACT-NATIVE-imagePicker

권한 얻기 $ yarn add react-native-permissions ios/Podfile permissions_path = '../node_modules/react-native-permissions/ios' //카메라 pod 'Permission-Camera', :path => "#{permissions_path}/Camera" //위치 정확하게 가져오기(베터리 소모량 많음) pod 'Permission-LocationAccuracy', :path => "#{permissions_path}/LocationAccuracy" //위치 항상 가져오기 pod 'Permission-LocationAlways', :path => "#{permissions_path}/LocationAlways" //위치 사용..

REACT-NATIVE - ios font적용하기 -

1. 원하는 폰트를 다운로드한다 2. (확실하지 않지만) /ios/fonts를 만들고 폰트 파일을 다 넣어준다. 3. src/assets/fonts를 만들고 적용할 폰트 폰트를 전부 다 넣어준다 4. 제일 상위에서 react-native.config.js 파일을 만들어준다 module.exports = { project: { ios: {}, android: {}, }, assets: ["./src/assets/fonts"], }; 5. /ios/프로젝트파일/info.plist파일 수정 작업에 들어간다. UIAppFonts IBMPlexSansKR-Bold.ttf IBMPlexSansKR-Medium.ttf IBMPlexSansKR-ExtraLight.ttf IBMPlexSansKR-Light.ttf IB..