본문 바로가기

반응형

React Native

(10)
[React Native] Async Storage - setItem, getItem, 중복확인 검사 아이디, 비번, 닉네임 변경 부분을 맡았따. 변경 후에 비번과 닉네임은 async storage부분에도 변경을 해줘야 했다. id는 asyncstorage를 삭제하고 다시 로그인하라고 로그인 페이지로 보낸다 그래서 해보았다 1. 기본적인 코드 import { AsyncStorage } from 'react-native'; //Library //Persisting data _storeData = async () => { try { await AsyncStorage.setItem( '@MySuperStore:key', 'I like to save it.' ); } catch (error) { // Error saving data } }; //Fetching data _retrieveData = async (..
[React Native] 바텀 내비게이션 및 스플래쉬화면 적용하기! 현재 소개팅앱을 만들고 있다. 거기에 바텀 내비게이션이 필요했다. 그래서 만들어 보았다. 1. createBottomTabNavigator모듈 설치 npm install @react-navigation/bottom-tabs 2. 코드 1) 기본적인 예시 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; const Tab = createBottomTabNavigator(); function MyTabs() { return ( ); } 위와 같이하면 아래에 Home탭과 Setting탭만이 생긴다. 다른곳은 갈수 없다. 그렇다고 바텀에 다 때려박으면 밑에 메뉴가 너무 많아 난잡해질것이다. 2)나의 코드 import Login f..
[React Native] MAC/IOS 알람 구현하기 3(Push notification)-firebase 2020/12/10 - [React Native] - [React Native] MAC/IOS 알람 구현하기 1(Push notification)-firebase [React Native] MAC/IOS 알람 구현하기 1(Push notification)-firebase 1. 프로젝트 생성 npx react-native init [파일명] 예를 들어 npx react-native init hyukpush 2. 모듈 다운 # Using npm npm install --save @react-native-firebase/app # Using Yarn yarn add @react-native-fi.. coding-hyeok.tistory.com 2020/12/10 - [React Native] - [React ..
[React Native] MAC/IOS 알람 구현하기 2(Push notification)-firebase 2020/12/10 - [React Native] - [React Native] MAC/IOS 알람 구현하기 1(Push notification)-firebase [React Native] MAC/IOS 알람 구현하기 1(Push notification)-firebase 1. 프로젝트 생성 npx react-native init [파일명] 예를 들어 npx react-native init hyukpush 2. 모듈 다운 # Using npm npm install --save @react-native-firebase/app # Using Yarn yarn add @react-native-fi.. coding-hyeok.tistory.com 1. Install the messaging module npm i..
[React Native] Android 알람 구현하기 2(Push notification)-firebase 2020/12/10 - [React Native] - [React Native] Android 알람 구현하기 1(Push notification)-firebase [React Native] Android 알람 구현하기 1(Push notification)-firebase 현재 진행중인 앱 프로젝트에서 메세지가 오거나 매칭이 완료되면 알람이 오는 기능을 구현하고 싶었다. 그래서 한번 배워보았다. firebase를 사용하였따 1. 프로젝트 생성 npx react-native init [파일 coding-hyeok.tistory.com 1. Install the messaging module npm install --save @react-native-firebase/messaging 2. install the..
[React Native] MAC/IOS 알람 구현하기 1(Push notification)-firebase App Push 기법은 네가지가 있다. 1. Expo Push Notification 2. FCM(Firebase Cloud Notification) + APNS(Apple Push Notification Service) 3. FCM only 4. AWS Amplicy 이다. 나는 2번을 사용할 것이다. Push가 언제 작동해야 하나? 3가지 경우가 있따. Foreground 상태 : 앱이 현재 실행되고 있을 떼 Background 상태 : 앱이 실행되어 있지만 화면에서 벗어나 있을 때 Quit 상태 : 앱이 꺼져 있을 때 1. 프로젝트 생성 npx react-native init [파일명] 예를 들어 npx react-native init hyukpush 2. 모듈 다운 # Using npm npm i..
[React Native] Android 알람 구현하기 1(Push notification)-firebase 현재 진행중인 앱 프로젝트에서 메세지가 오거나 매칭이 완료되면 알람이 오는 기능을 구현하고 싶었다. 그래서 한번 배워보았다. firebase를 사용하였따 1. 프로젝트 생성 npx react-native init [파일명] ex) npx react-native init hyukpush 2. 'local.properties' 파일 생성 또는 Android Studio로 들어가면 자동생성됩니당 android폴더에 'local.properties'파일생성하고 sdk.dir=/Users/hyukyun/Library/Android/sdk 자신의 sdk파일 경로를 써주면 된다 3. firebase 모듈 설치 # Using npm npm install --save @react-native-firebase/app # ..
[ReactNative]Mac - Android 설치(npx react-native run-android) 1. Node & Watchman 설치 node brew install node watchman brew install watchman 2. Java Development Kit brew cask install adoptopenjdk/openjdk/adoptopenjdk8 3. Android Studio 설치 설치할때 설치마법사에서 Android SDK, Android SDK Platform, Android Virtual Device, HAXM을 체크하고 설치하자(캡처를 못했ㄷㅏ..) 4. Android SDK manager Android Studio를 설치하고나서 SDK manager에 들어가서 SDK manager 좌측 하단에 'show package details'를 누른다. Android10.0(..

반응형