본문 바로가기
반응형

전체 글275

[앱 배포] ReactNative로 개발 IOS 첫 빌드 및 배포 방법 정리 이 글은 이미 시뮬레이터와 USB를 통한 디바이스 테스트는 마쳤다고 가정합니다. 앱스토어 배포전에 필요한 준비단계들을 알아보고 실제 배포까지 해볼 예정입니다. ReactNative로 개발한 앱을 IOS 앱스토어에 배포하는 것을 기준으로 작성되었습니다. ReactNative로 개발했다면 eas cli라는 관리 툴이 존재하며 상당 부분을 자동으로 간략하게 진행할 수 있습니다. xcode를 이용하는 native 방식과는 차이가 있습니다. 사전에 필요한 것들. 사전에 필요한 것들은 꼭 미리해야하는 것은 아니지만, 어차피 해야 하는 것들이며 필요한 시점에 진행해도 무관합니다. 그럼에도 사전에 필요한 것이라고 해둔 것은 진행흐름 상에 막히는 것을 최소화하려고 별도로 정리했습니다. 개발자 등록 2023년 2월 , 이.. 2023. 2. 12.
snowball 개인정보처리방침 ('netflify'이하 'netflify')은(는) 「개인정보 보호법」 제30조에 따라 정보주체의 개인정보를 보호하고 이와 관련한 고충을 신속하고 원활하게 처리할 수 있도록 하기 위하여 다음과 같이 개인정보 처리방침을 수립·공개합니다. ○ 이 개인정보처리방침은 2023년 1월 1부터 적용됩니다. 제1조(개인정보의 처리 목적) ('netflify'이하 'netflify')은(는) 다음의 목적을 위하여 개인정보를 처리합니다. 처리하고 있는 개인정보는 다음의 목적 이외의 용도로는 이용되지 않으며 이용 목적이 변경되는 경우에는 「개인정보 보호법」 제18조에 따라 별도의 동의를 받는 등 필요한 조치를 이행할 예정입니다. 제2조(개인정보의 처리 및 보유 기간) ① < s.. 2023. 2. 9.
ios splash 화면 만들기 (react-native-splash-screen 이용) 검색해보니 여러가지 방법이 있는 것 같았으나, 아래 방법으로 먼저 적용해보기로 했다. react-native-splash-screen // yarn의 경우 yarn add react-native-splash-screen // npm의 경우 npm install react-native-splash-screen // ios의 경우 cd ios && pod update // pod update 해줘도 되고 pod install 해줘도 됨 또는 npx pod-install ios Android android : MainActivity.java 파일 수정 ... import android.os.Bundle; // 추가 import com.facebook.react.ReactActivity; import org.d.. 2023. 2. 8.
아이폰 디바이스별 해상도 정리 실제 해상도 iPhone 3gs 3.5인치 320 x 480 320 x 480 iPhone 4, 4s 3.5인치 640 x 960 320 x 480 iPhone 5, 5c, 5s, SE1 4인치 640 x 1136 320 x 568 iPhone 6, 6s, 7, 8, SE2, SE3 4.7인치 750 x 1334 375 x 667 iPhone 12 mini, 13 mini 5.4인치 1080 x 2340 375 x 812 iPhone 6+, 6s+, 7+, 8+ 5.5인치 1242 x 2208 414 x 736 iPhone X, XS, 11 Pro 5.8인치 1125 x 2436 375 x 812 iPhone Xr, 11 6.1인치 828 x 1792 414 x 896 iPhone 12, 12 Pro, .. 2023. 2. 8.
시뮬레이터를 지정해서 테스트 하는 방법 --simulator flag CRNA로 생성된 프로젝트에서 혹은 npx로 시뮬레이터를 실행할 수 있다면 아래와 같이 --simulator 플래그로 실행시 지정할 수 있다. 아래 예시는 아이폰 se2 (아이폰 2세대)를 시뮬레이터로 지정해서 실행하겠다는 뜻이다. npx react-native run-ios --simulator="iPhone SE (2nd generation)" 마찬가지로 package.json에 저장해서 사용할 수 있다. #package.jsno에 추가 "scripts" : { "launch-ios": "react-native run-ios --simulator \"iPad Air 2\"" } #실행시 npm run launch-ios 사용가능한 디바이스 리스트 보기 iPad Air 2.. 2023. 2. 8.
2023. ver2. admob IOS 앱 첫 연동하기 예제 CRNA app (Expo Dev Client and EAS CLI) 2023.02.06 - [개발로그/ReactNative] - 2023. Ver1 . admob 첫 연동하기 정리 CRNA app (with IOS) 구글 애드몹에 가입하고 앱을 생성하는 단계까지는 위 포스팅의 내용과 동일합니다. 유투브에 다른 방법으로 연동하는 것이 있어서 테스트해보았습니다. Setup/Installation - Expo Dev Client and EAS CLI - Setup cd expo-rn-demo-with-ads expo install expo-dev-client expo install react-native-google-mobile-ads npx pod-install ios Add to app.json ios_app_id 는 자신이 발급 받은 것으로 해야합니다. 구글애드몹 사이트.. 2023. 2. 6.
에러가 있는 코드로부터 배운다. React Native Animated 에서의 Value 수정하기(useRef) export default function App() { const [up, setUp] = useState(false); // state 가 변경되어 컴포넌트가 re-rendering이 될 때마다 모든 코드가 다시 실행된다. // 그래서 21번째 라인이 실행되며 다시 초기값인 Y=0이 된다. const Y = new Animated.Value(0); const toggleUp = () => setUp((prev) => !prev); const moveUp = () => { Animated.timing(Y, { toValue: up ? 200 : -200, useNativeDriver: true, easing: Easing.circle, }).start(toggleUp); }; Y.addListener(.. 2023. 2. 1.
React Native Animated - 애니메이션 value 를 수정하기 위해 사용하는 것들. 예제 포함 이전글 2023.01.31 - [개발로그/ReactNative] - react native Animated 를 사용할때 알아야할 절대 Rules! ReactNative Animatied 제공받을 수 있는 3가지 애니메이션 Animated.decay() # 초기 설정된 속도로 시작해서 점점 느려지고 멈춘다. Animated.spring() # 물리모델을 지원한다. Animated.timing() # 대부분의 경우 타이밍을 사용한다. Animatied.timing() import React from "react"; import { Animated, StyleSheet, TouchableOpacity } from "react-native"; const Container = styled.View``; const.. 2023. 1. 31.
반응형