[RN] react-native Firebase Push Notification - iOS
·
React Native
개인프로젝트를 하면서 푸시알림발송을 해보았다. 참고사이트May님 블로그 : [React Native] 🔥 Firebase 로 푸쉬 알림 구현하기 - (2) iOS 앱에서 푸시 알림 띄우기! 1. iOS 인증서 생성iOS앱을 내 Firebase 프로젝트와 안전하게 연결하기 위해 인증서 파일을 다운받아 iOS앱 내에 세팅해야한다. 1.1) Firebase 콘솔에서 iOS 앱 생성하기저는 이미 Android, iOS앱을 생성해서 2 apps라고 표기되지만생성전이라는 가정하에 + Add app 버튼을 눌러준다. 이곳 또한 저는 이미 생성된 앱이라 아이콘이 주황색 컬러로 선택되어 있다.iOS+아이콘을 클릭해준다. Apple bundle ID는 반드시 본인 프로젝트의 bundle ID와 같아야 한다.내 프로젝..
[RN] react-native simulator 'Hide Inspector'
·
React Native
iOS Simulator⌘+d 또는^+⌘+z 클릭 후 Toggle Element InspectorAndroid Emulator⌘+m 클릭 후 Toggle Element Inspector 참고 사이트https://stackoverflow.com/questions/76988889/react-native-on-ios-catalyst-how-do-i-remove-inspect React Native on iOS/Catalyst - How do I remove inspect?I have an iOS app developed via React Native running on macOS via Catalyst. It happened that I erroneously pressed something to enable..
[RN] react-native 'Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: number.' 에러잡기
·
React Native
결국 코드 한줄씩 주석처리 해보면서 svg파일이 문제인걸 찾았다.또 하루종일 svg와 관련된 파일들만 설치하고 난리부르스......ㅋㅋ 발생원인react-native 버전이 업그레이드 되고나서 발생하는 에러이다.나의버전: "react-native": "0.75.2" 해결방법 ts-jest 라이브러리 사용 1. ts-jest 라이브러리 설치npm install --save-dev ts-jest# oryarn add --dev ts-jest 2. jest.config.js 파일 수정module.exports = { preset: 'ts-jest', testEnvironment: 'node', transform: { '^.+\\.tsx?$': 'ts-jest', '^.+\\.svg$': 'je..
[RN] react-native button으로 sort 정렬하기
·
React Native
1. Btn1을 누르면 해당하는 열이 오름차순 정렬 -> 내림차순 정렬 -> 디폴트 정렬2. Btn1을 눌러서 오름차순 정렬해놨다가 Btn2를 누르면 Btn2를 기준으로 오름차순 정렬 테이블 헤더 및 화살표 이미지 상태저장 const [selectedHeader, setSelectedHeader] = useState(null); const [arrowState, setArrowState] = useState(0); - 눌러진 열을 구분 할 수 있게 테이블헤더 상태를 useState를 활용하여 저장- 오름차순, 내림차순 구분을 하게 해주는 화살표 상태 저장 헤더 클릭시 아이콘 변경 const handleHeaderClick = (index: number) => { if (selectedHeade..
[RN] react-native tab navigation 스크린 이동 새로고침
·
React Native
options={{ unmountOnBlur: true }} 추가 unmountOnBlur: true옵션이 추가된 탭은 새로고침이 발생한다.
[RN] react-native navigation params 사용하기
·
React Native
Params란?화면을 구성할 때 함께 전달되는 매개변수(parameters)를 의미한다. Params 사용하기params를 사용하기 위해서는 두 가지 과정이 있어야 한다. 1. navigation.navigate() 함수의 두 번째 변수로 params를 전달해야 한다.navigation.navigate('RouteName', { /* params go here */ })params는 JSON직렬화가 가능한 형태를 추천한다.(보통 객체 형태로 전달한다.) 2. Screen의 구성요소에서 params를 읽어야 한다.function ScreenName({ route }) { /* route.params 으로 사용할 수 있다. */} Params 함수1. setParams()현재 화면의 매개변수를 동적으..