* 로그인 로직의 현재 문제점과 고려할 부분 안드로이드의 로컬 스토리지(AsyncStorage)는 사용하지 않는다. => 이유는 사용자가 로그인후 앱을 껐다 키면 로그인이 되어 있는 상태이나 로컬 스토리지에 저장된 사용자 정보는 사라지기 때문에 로그인이 되어있더라도 사용자 정보가 없는 문제가 발생한다. {!isLoggedIn && } stackRouter 컴포넌트에서 해당 부분이 문제가 된다. 사용자가 로그인하기 전에는 isLoggedIn 상태가 false 이므로 로딩시 랜딩페이지도 함께 로딩된다. 하지만 사용자가 앱을 종료하고 다시 시작하면 isLoggedIn 은 true 가 되기 때문에 로딩시 랜딩페이지는 로딩되지 않는다. 이렇게 되면 사용자가 로그인후 곧바로 로그아웃을 할때는 랜딩페이지가 메모리에 ..

https://dwbyun.tistory.com/7 [React Native] 0.70버전 custom font 적용하기 (react-native-cli) 이번 글에서는 react native 현재 최신 버전인 0.70.1 버전에서 custom font 적용하는 방법을 포스팅하려고 합니다. 우선 프로젝트를 생성하고 App.js 파일을 수정합니다. npx react-native init AwesomeProject import dwbyun.tistory.com https://fonts.google.com/specimen/Nanum+Pen+Script?subset=korean&noto.script=Kore Nanum Pen Script - Google Fonts Nanum Pen Script is a cont..

https://github.com/react-native-google-signin/google-signin GitHub - react-native-google-signin/google-signin: Google Sign-in for your React Native applications Google Sign-in for your React Native applications. Contribute to react-native-google-signin/google-signin development by creating an account on GitHub. github.com * SettingsScreen 컴포넌트에 구현된 소셜로그인 기능을 LoginButton 컴포넌트로 옮기기 npm install @re..

/** * @format */ import {AppRegistry} from 'react-native'; import stackRouter from './stackRouter'; import {name as appName} from './app.json'; AppRegistry.registerComponent(appName, () => stackRouter); 루트 디렉토리의 index.js 파일을 위와 같이 수정한다. LandingScreen 대신에 stackRouter 컴포넌트를 화면에 보여준다. import React, { useState, useEffect } from 'react' import { View, Text, StyleSheet, ActivityIndicator } from 'react..

https://medium.com/backticks-tildes/create-a-custom-app-intro-slider-in-react-native-4308fae83ad1 Create a custom App Intro Slider in React Native One great way to give users a feel of what your application is about is to have a couple of screens be displayed to them the first time… medium.com https://velog.io/@syoung125/3%EC%9B%94-%EC%9D%B8%ED%84%B4%EC%9D%BC%EC%A7%80-3-React-Native-animated-%EC..

https://github.com/react-native-google-signin/google-signin GitHub - react-native-google-signin/google-signin: Google Sign-in for your React Native applications Google Sign-in for your React Native applications. Contribute to react-native-google-signin/google-signin development by creating an account on GitHub. github.com * 구글 로그인후 프로필 정보 보여주기 & 로그아웃 구현하기 import React, { useEffect, useState } fr..

https://lucky516.tistory.com/306 ReactNative Firebase 구글 로그인 카카오 로그인보다 더 말썽일가 싶었는데 구글로그인도 생각보다 말썽이다 1. 기초설정 먼저 하기 링크에서 기초 환경세팅을 설정한다 https://rnfirebase.io React Native Firebase | React Native Firebase Welcome lucky516.tistory.com * 구글 로그인을 위한 라이브러리 추가하기 @react-native-google-signin/google-signin * 안드로이드 파일 설정하기 android/build.gradle에 들어가서 아래와 같이 추가한다. buildscript { ext { ... 중략 googlePlayServicesA..

https://devbksheen.tistory.com/entry/React-Native-%EC%B9%B4%EC%B9%B4%EC%98%A4-%EB%A1%9C%EA%B7%B8%EC%9D%B8-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0 React Native 카카오 로그인 설정 및 구현 RN 사이드 프로젝트 중 카카오 로그인을 구현하면서 방법을 정리하려고 한다. 라이브러리는 @react-native-seoul/kakao-login를 사용하였다. 1. 카카오 애플리케이션 생성 및 설정 kakao developers에 로그인 devbksheen.tistory.com * 카카오 로그인을 사용할 플랫폼 등록하기 - 안드로이드 패키지명 설정하기 defaultConfig { application..

* 통계화면을 보여주기 위한 라이브러리 설치하기 { "name": "learnreactnative", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "lint": "eslint .", "start": "react-native start", "test": "jest" }, "dependencies": { "@react-native-firebase/app": "^18.4.0", "@react-native-firebase/auth": "^18.4.0", "@react-native-firebase/firestore": "^18.4.0", "@re..

https://eunhee-programming.tistory.com/267 (React) 리액트 달력만들기 (초간단/쉬움) * 본 포스팅은 직접 구현한 코드입니다. * 불펌 금지합니다. * 더 좋은 코드가 있으면 가르쳐주세요 감사합니다 :) 포스팅 요약 1. 결과화면(사진 및 동영상) 2. 파일 구조 3. 코드 4. 깃허브 코드 주 eunhee-programming.tistory.com * 캘린더 화면에 년도/월 선택을 위한 드롭다운 버튼 보여주기 사용자가 특정 날짜의 할일목록을 조회하거나 수정하도록 하기 위하여 특정 날짜를 선택할 드롭다운 버튼을 보여주자! import React, { useState, useEffect } from 'react' import { View } from 'react-na..