본문 바로가기

TIL

[TIL-163] React Native Redux dispatch 에러 Possible Unhandled Promise Rejection (id: 0): ReferenceError: setToken is not defined import React, {useState, useRef, useEffect} from 'react'; import {useDispatch, useSelector} from 'react-redux'; const PwVerify = ({navigation}) => { const token = useSelector(store => store.token); const dispatch = useDispatch(); ... // fetch하여 result에 담긴 token 받아옴 dispatch(setToken(result.acc.. 더보기
[TIL-162] 노마드코더 React Native #2.0~# 보호되어 있는 글입니다. 더보기
[TIL-161] React Native Redux 시작하기 파일 구조 및 기본 세팅 정석으로는 어떻게 하는지 모르겠지만 나는 src 폴더 하위에 redux 폴더를 만들었다. 이 폴더 안에 여러 state들을 각 파일로 만들어두고, index.js로 관리한다. index.js에서 redux로 관리할 전역 상태값들을 연결시켜준다. 루트 리듀서를 디폴트로 export 한다. // src.redux.index.js import {combineReducers} from 'redux'; import token from './token'; const rootReducer = combineReducers({ token, }); export default rootReducer; 모든 화면을 navigating하는 App.js에서 store를 주입한다. cre.. 더보기
[TIL-160] React Native TextInput 입력 완료 후 값 수정하기 onEndEditing // bankData.json { "1": { "bankName": "국민은행", "number": 14, "validation": { "regex": "/[0-9,-]{6,6}-[0-9,-]{2,2}-[0-9,-]{6,6}/", "hyphen": 2, "index": [6, 9] } }, "2": { "bankName": "기업은행", "number": 14, "validation": { "regex": "/[0-9,-]{3,3}-[0-9,-]{6,6}-[0-9,-]{2,2}-[0-9,-]{3,3}/", "hyphen": 3, "index": [3, 10, 13] } }, ... } const modifyAccout = () => { .. 더보기
[TIL-159] React Native 전역 상태 관리의 필요성 point와 카드 번호를 홈 화면과 송금 화면 두 스크린에서 필요한 상황이다. 지금은 각 화면에 도착했을 때, useEffect를 사용하여 컴포넌트가 최초 렌더링 된 직후에만 요청을 보내 두 가지 값을 받아왔다. 그런데 홈에서 송금 화면으로 스크린을 이동했을 때 그 사이 point 잔액이 바뀌어서 새로운 값을 받게 되었다. 이때 송금 화면에서 뒤로가기 버튼을 눌러 홈화면으로 넘어오면, "뒤로가기" 때문인지 화면이 새로고침되지 않아서 point와 카드번호를 받아오는 요청이 보내지지 않는다. 그래서 변경 전 point 잔액이 여전히 그려지는 문제가 있다. point를 전역 state로 관리함으로써, 요청을 보내서 값이 변경될 때마다 하나의 state에 저장하면 된다. 화면(컴포넌트).. 더보기
[TIL-158] React Native React Native에서 그라데이션 만들기 react-native-linear-gradient import LinearGradient from 'react-native-linear-gradient'; 해당 라이브러리를 설치하면 그라데이션도 가능하다. 색상만 지정해주면 기본적으로 상하 그라데이션이 나오는데, start와 end를 조절하여 그라데이션 각도를 바꿀 수 있다. RN(React Native) 프로젝트에서 react-native-linear-gradient을 사용해서 그라데이션(Gradient) 백그라운드(background)를 만들어 보자. https://dev-yakuza.posstree.com/ko/react-native/react-native-linear-gradient/ https://g.. 더보기
[TIL-157] React Native - 유효성 검사 정규표현식 regex.test("문자열") regex(정규표현식)에 text() 메서드를 사용하면 인자로 넘겨준 문자열이 주어진 regex에 일치하는지 불리언으로 값을 반환함. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test const idRegex = /^[a-zA-z-0-9]{6,20}$/; => o (자바스크립트) const idRegex = "^[a-zA-z-0-9]{6,20}$"; => x (파이썬) const re = new RegExp('ab+c') regex는 문자열이 아니라 객체 형태이다. 따라서 변수에 정규 표현식 리터럴을 할당할 때 따옴표로 감싸면 안 된다. 대신 /(슬래시.. 더보기
AWS EC2 프리티어 과금 오늘 갑자기 AWS 결제 문자를 받았다. 6215원이 나갔다고 한다. S3는 요금이 나간다고 들었지만 나는 EC2만 썼고, S3를 써서 과금됐다는 얘기를 들었을 때도 몇 천원 안 되는 금액이었다. 나는 EC2 프리티어만 사용하고 있는데 갑자기 돈이 왜 나가지 싶어서 청구서를 확인해봤다. AWS 사이트가 너무 복잡하고 다 번역투에 원하는 기능 찾기도 힘든데, 검색해보니까 billing을 검색해서 들어가면 볼 수 있었다. 내역을 살펴보니 EC2에서 무료 750시간 외에 318시간의 사용분에 따른 요금이 부과된 것 같다. 그냥 AWS 프리티어 1년 동안 공짜다~ 이렇게 알고 써왔는데 그 기준이 복잡했던 모양이다. 750시간도 있고, 용량도 있고, 정해진 범위 안에서 무료인 것 같다. 그런데 나는 750시간이라.. 더보기

티스토리툴바