React14 React native - custom font 적용과 발생했던 문제를 기록 - IOS react native custom font 를 적용했던 과정과 발생했던 문제를 기록 합니다. 👉🏻 적용 방법 1. assets / fonts 에 폰트 추가 (assets 이라는 폴더를 만들면 된다) 2. 루트 경로에 react-native.config.js 생성 module.exports = { assets: ['./assets/fonts'] }; 3. react-native link 실행 react-native link 4. ios/[프로젝트이름]/Info.plist 에 폰트 추가 되었는지 확인 5. xcode project info 탭에서 font 추가되어 있는지 확인 🧐 재빌드 했는데, 에러 발생 찾고 찾다가 다른 알엔 개발자분들에게 여쭈어 보니 폰트 파일명과 폰트 패밀리는 다른 것이니 폰트 패밀.. 2022. 4. 24. React native - 앱 스킴 만들기 ios ios 만 다룹니다! AppDelegate 설정 ios / [프로젝트 이름] / AppDelegate.m ⭐️맨상단⭐️ 에 아래 코드를 추가한다. #import ⭐️**@end 이전**⭐️ 에 아래 코드를 추가한다. - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary *)options { return [RCTLinkingManager application:application openURL:url options:options]; } universal link를 사용하는 경우 아래 코드도 추가 합니다. 단, 유니버설 링크가 앱에서 작동하도록 하려면 서버에 연결된 도메인 도 설정해야 합니다.. 2022. 4. 18. React native - progress bar 만들기 🧩 아래 처럼 생긴 progress bar 를 만들어보자. progress bar 가 필요했는데, 여러 라이브러리를 살펴봤지만 맘에 드는게 없기도 했고, 이정도는 내가 개발할 수 있는 정도라 그냥 직접 만들었다. 실제로도 별거 없다. 📍준비물 react native react native animation - https://reactnative.dev/docs/animatedvalue#interpolate 🔨구현 해당 컴포넌트를 다양한 곳에서 사용할 수 있도록, step(count) 값은 외부에서 받도록 변경했다. 컨트롤할 ref 정의 하기 ref 와 같이 쓰는 이유는 값이 변경 되었을 때 렌더링 되지 않고 값을 유지시켜, 애니메이션이 되고 원래 위치로 돌아가는 것을 방지하는 데 사용한다. 즉, 리렌더링.. 2022. 4. 16. React native 로 스와이프 애니메이션 install yarn add react-native-swipe-gestures use react-native-swipe-gestures react-native animation event swipe 시에 텍스트 변경하게 하기 react-native-swipe-gestures 라이브러리를 이용하면, 손쉽게 스와이프 액션을 캐치할 수 있습니다. import React, { useState } from 'react' import { SafeAreaView, StyleSheet, Text } from 'react-native'; import GestureRecognizer from 'react-native-swipe-gestures'; function Intro() { // swipe 시에 바꿔줄 텍스트 모음.. 2022. 4. 11. 🐛 에러로그 - error Failed to build iOS project. We ran "xcodebuild" command but it exited with error code 65. [RN] 💻 환경 리액트네이티브 🐥 동작 npm run ios 🐛 에러 내용 error Failed to build iOS project. We ran "xcodebuild" command but it exited with error code 65. 📌 원인 내부 번들 꼬여서 그런거래요... 🚀 해결 1. xcode에서 Build Phases 탭 에서 copy bundle resources 안에 있는거 날리고, 다시 번들링함 😭 위의 방법도 안되면? iOS ios 폴더 > Pods > Pods.xcodeproj 실행 > Podfile 내 코드를 아래 처럼 변경 use_flipper!({ 'Flipper' => '0.74.0' }) post_install do |installer| flipper_post_insta.. 2021. 11. 25. 🐛 에러로그 - Multiple commands produce [파일경로] (RN) 환경 리액트네이티브 동작 npm run ios 버그 Multiple commands produce [파일경로] 원인 react-native-vector-icons를 link해서 사용했는데 rn이 업데이트 되면서 자동 link가 되니, unlink 하라해서 했다가 해당 문제 발생 이런 경우 Copy Bundle Resources 에 파일이 중복 해서 들어가게 돼서 해당 에러를 뿜게됨 해결 1. xcode 실행 2. 자신의 프로젝트 선택 3. 상단 메뉴탭에 build Phases 선택(난 없는데? 하는 경우 왼쪽 폴더리스트에 가장 루트를 클릭해준다. 난 frontend) 4. copu bundle Resources 에서 중복되는 파일 제거 (하단 -버튼 누르면 됨) npx react-native run-io.. 2021. 11. 25. 이전 1 2 3 다음
