뚝딱뚝딱 코딩 기록_

[React Native_ NetInfo] 네트워크 연결을 확인하는 방법에 대해 알아보자 1. 라이브러리 설치 expo install '@react-native-community/netinfo' 2. 인터넷 연결 여부 확인 (재사용 가능) `````` import NetInfo from '@react-native-community/netinfo'; `````` const unsubscribe = NetInfo.addEventListener(state => { console.log(state.isConnected); return (state.isConnected); }); unsubscribe(); 💡 state.isConnected : boolean (true / false) 💡 state.type : ..

[React Native_ FlatList] FlatList로 무한 스크롤하는 방법에 대해 알아보자 `````` import React, { useState } from 'react'; import { View, FlatList } from 'react-native'; import RenderItem from './item'; // 리스트에 보여줄 컴포넌트 `````` export default function App() { // data : 렌더링할 데이터 리스트 const data = [ {key: value}, ]; // 새로고침 state const [isRefreshing, setIsRefreshing] = useState(true); const handleRefresh = () => { set..

[React Native_image axios] ImagePicker로 받아온 이미지 데이터를 서버로 보내는 방법을 알아보자 1. ImagePicker 사진 가져오기 expo ImagePicker library를 이용하여 데이터를 받아오는 방법은 지난 포스팅에서 소개했다. ImagePicker 사용 방법이 궁금하다면 포스팅을 참고하면 될 것이다. 👉 [리액트네이티브] 갤러리에서 사진 가져오기-ImagePicker 2. axios import axios from 'axios'; const data = { key: value, } axios.post('url', data} .then(response => console.log) // 성공한 경우 .catch(error => console.log) // err..

[React Native_expo-image-picker] 갤러리에서 사진 가져오는 방법에 대해 알아보자 1. ImagePicker 설치하기 expo install expo-image-picker 2. 접근 권한 허용 const [galleryPermission, setGalleryPermission] = ImagePicker.useMediaLibraryPermissions(); // 권한이 없는경우 허용 여부 요청 if (!galleryPermission?.granted) { const permission = setGalleryPermission(); // 허용하지 않는 경우 종료 if(!permission.granted) { return null; } }; 💡 useMediaLibraryPermiss..

[React Native_ EXPO CLI] 👉React Native 공식문서 바로가기👈 Introduction · React Native This helpful guide lays out the prerequisites for learning React Native, using these docs, and setting up your environment. reactnative.dev ❔ React Native - 자바스크립트를 사용하여 모바일 어플리케이션을 개발할 수 있는 프레임워크 - iOS와 Android 어플리케이션 동시에 개발 가능 - 자바스크립트로 작성된 코드를 네이티브 코드로 렌더링 - Web 과는 조금 차이가 있음 ❔expo CLI vs React-Native CLI 1. expo CLI..