Frameworks

👉 react-native-asset 이용하기 react-native.config.js의 assets을, android와 ios에 연결해준다 // react-native.config.js module.exports = { assets: ["./assets/fonts"], }; npx react-native-asset

👉 Alert 구성요소 설명 및 사용법 Alert.alert( '삭제', // 제목 '정말 삭제하시겠어요?', // 설명 [ // 버튼 추가 {text: '취소', style: 'cancel'}, { text: '삭제', style: 'destructive', // 버튼 스타일 지정 onPress: () => { // 버튼 콜백함수 지정 onRemove(log?.id); navigation.pop(); }, }, ], { // 옵션 추가 cancelable: true, // 취소 버튼 활성화 }, );

👉 react-native-oss-license 란? React-native 에서 사용한 오픈소스 라이브러리들의 라이센스(저작권)을 한번에 보여준다. 설치 npm i react-native-oss-license 사용법 react-native-oss-license --json --only-direct-dependency ⭐️ 팁 license.js 파일로 만들면 prettier로 예쁘게 볼 수 있다. // license.js const license = [{ 콘솔창에 나온 Json 형식 문자열 복사하기 }]

👉 Firebase 란? 앱에서 사용할 데이터를 온라인에 저장하고, 가져올 수 있도록 해주는 도구 ( feat. 구글 ) 기능 회원인증, 데이터 읽기 쓰기, 이미지 업로드 등등.. 가입 Firebase Firebase는 고품질 앱을 빠르게 개발하고 비즈니스를 성장시키는 데 도움이 되는 Google의 모바일 플랫폼입니다. firebase.google.com 👉 사용법 콘솔로 이동 프로젝트 만들기 애널리틱스 사용할지 선택하기 '앱에 Firebase를 추가하여 시작하기' android ( React Native 0.69 기준 ) - 프로젝트 / android / app / build.gradle 열기 - applicationId 찾아서 복사 - 프로젝트 경로에서 명령어 실행해서, SHA-1 서명인증서 얻기 (..

👉 react-native-modal-datetime-picker 란? React Native에서, 시간 관련 선택창을 보여주는 Node.js 라이브러리 설치 npm i react-native-modal-date-time-picker 사용법 function onConfirm(){...} function onCancel(){...} return( {} onCancel={onCancel} // 날짜 선택 취소시, 호출 함수 지정 mode="date" // 모드 선택 : date, time, datetime date={new Date()} // 초기 날짜 지정 isVisible={visible} // true시 보여줌, false시 숨김 /> )

👉 date-fns 란? javascript의 Date(시간) 객체를 다양하게 변환하는 Node.js 패키지 설치 npm i date-fns 사용법 // format : 기본 변환기 // formatDistanceToNow : 현재 시간과 비교해주는 변환기 import {format, formatDistanceToNow} from 'date-fns' import {ko} from 'date-fns/locale'; const d = Date.now(); // PPP : 5월 29일, 2020 형식 // EEE : 월, 화, 수 ... 형식 // p : 오전 12:00 형식 // locale : 언어 선택하기 ( ko : 한국어 ) const f1 = format(d, 'PPP EEE p', {locale:..

👉 uuid란? 범용 고유 식별자 ( Universally Uniqute identifier ) 고유한 항목을 구분할 수 있도록 해주는 식별자를 제공하는 Node.js 패키지 설치 npm i uuid 사용법 // 버전이 여러가지가 있음 import {v4} from 'uuid; // 고유 랜덤값 생성 const id = uuidv4(); React Native 추가설치 npm i react-native-get-random-values

👉 children이란? 컴포넌트로 감싸진 부분 children 예시 function App(){ return ( 안녕하세요 // Container 컴포넌트의 children == 안녕하세요 ) } // children은, 해당 컴포넌트의 인자(매개변수)로 전달된다! function Container({children}){ return ( {children} ) }

👉 pod install이란? React Native ios 개발환경에서 javascript 라이브러리를 ios 네이티브 코드와 연동하는 것 필요성 pod install 을 해야만, javascript 코드를, ios Native (Objective-C)코드로 변경할 수 있다.