IT 개발85 ReactNative expo-cli 시작하기. 시작이 반이다. 고로 오늘 반을 끝냈다 이전에는 간단한 앱 개발을 react-native cli로만 조금씩 경험을 해봤었다현 회사 앱 개발이 expo-cli로 되어있는데, 예전의 expo-cli의 단점이 많이 사라졌다고 한다.이번 기회에 expo-cli 개발 환경에 익숙해져 보자 (= 아마도 회사 업무 조금 더 수월해지지 않을까 하는 마음)는 기대감을 갖고! 이번 출시를 목표로 두고 있는 사이드 프로젝트 앱 개발을 expo-cli로 도전해보려한다. 01. expo-cli 설치 yarn add expo-cli명령어를 통하여 우선 expo-cli를 설치해 준다. expo-cli를 설치했다면npx expo init 을 입력하여, expo-cli 프로젝트를 생성해 준다 02. expo 공식 사이트 가입 및 설정 expo 공식 사이트에 들어가.. 2023. 2. 5. AWS는 왜 계속 내 만원을 가져가나.. (Feat. 탄력적 IP 삭제) 취준 기간 동안 만들었던 웹 프로젝트의 모든 AWS 세팅을 삭제했었다이후에 확인해 보니 AWS에서 매달 내 만원이 줄줄이 세어 나가고 있는 것을 발견하였다 (...)인스턴스를 삭제했기 때문에, 가장 유력한 건 EC2 탄력적 IP였다 [AWS] -> [EC2] -> [탄력적 IP 주소]아무것도 없다고 생각했는데, 내 현주소가 '미국 동부'로 되어 있어서 보이지 않았던 것이다 흑흑다시 서울로 선택하니 그제야 탄력적 IP 주소가 보였다 오른쪽 상단의 작업 버튼을 클릭하여 '탄력적 IP 주소 릴리스'를 선택하면 탄력적 IP가 완전히 삭제된다이제 내 만원을 지킬 수 있다 🥲 ⚠️ 탄력적 IP 사용은 비용이 따로 들지 않지만,연결 한 인스턴스를 사용하지 않을 때(인스턴스 중지/삭제) 요금이 청구된다.. 2023. 1. 29. Nextjs useEffect안의 router query가 빈값으로 나올 때 localStorage는 저장, 변경, 삭제 등 모든 동작이 동기적으로 실행된다.URL의 쿼리스트링으로 존재하는 code를 nextjs의 router.query 를 객체구조분해를 이용하여 가져왔다이후 useEffect가 실행될 때 쿼리스트링의 code 키,값을 가져와서 localStorage에 저장하려는 의도였다 예상과 달리, localStorage에 값이 들어가지 않아 useEffect안에 router.query를 콘솔로 찍어보니빈 객체 { } 가 출력되었다 이는 nextjs에서 정적으로 최적화된 페이지는 루트 매개 변수가 제공되지 않아 query값을 콘솔에 찍어도빈 객체로 나오기 때문이었다 (= 정적 파일 최적화) Next.js@10.0.5 이후 버전router.isReady라우터 필드가 클라이언.. 2023. 1. 19. ReactNative 리액트 네이티브 : 리액트 네비게이션 설정 포스팅에선 react-navigation 라이브러리 사용 예정. yarn add @react-navigaiton/nativereact-navigation 설치 yarn add react-native-screens react-native-safe-area-contextreact-navigation 의존 라이브러리 설치 IOS 테스트를 한다면,npx pod-install 1. 리액트 네이티브 내비게이션 설정import {NavigationContainer} from '@react-navigation/native';function App() { return ... }export default App; ... 안에 내비게이션 설정을 JSX로 선언이 가능하다. 기존 웹의 경우, 웹 브라우저에 탑재되어있는 히.. 2022. 2. 13. Firebase ReactNative 연동 에러 Error: [storage/unauthorized] User is not authorized to perform the desired action. 현재 벨로퍼트님의 리액트 네이티브를 다루는 기술 책의 예제를 익혀가며 리액트 네이티브를 학습하고 있다.이번장에서 Firebase와 ReactNative를 연동하여 Firebase storage에 이미지를 저장하려 하는데,좀 전까지는 잘만 실행되던 시뮬레이터가 튕김 현상과 함께 아무리 켜도 계속 종료되었다. 터미널을 확인해보니 다음과 같은 에러 메시지가 출력되었다 Possible Unhandled Promise Rejection (id: 0):Error: [storage/unauthorized] User is not authorized to perform the desired action.NativeFirebaseError: [storage/unauthorized] User is not authorize.. 2022. 2. 10. 리액트 불변성을 지키는 이유와 방법 리액트를 접하면서 불변성 개념에 대해 알게 되었다.리액트 네이티브도 역시나 불변성을 지켜가면서 변화를 줘야 한다. 불변성을 지킨다는 것은?객체 및 배열을 직접적으로 수정하지 않는다는 말이다.즉, 기존 객체는 내버려 두고 새로운 객체를 만들어서 새로운 객체에 원하는 값을 덮어씌워야한다 왜 불변성을 지켜야 할까? 렌더링 성능 최적화 방식 때문이다.리액트에서 부모 컴포넌트가 업데이트될 경우, 그 밑의 자식 컴포넌트도 전부 업데이트(리 렌더링)된다.이는 변경사항이 따로 없음에도 자동적으로 함께 리 렌더링이 된다. 만약 컴포넌트에서 처리하는 데이터 및 연산량이 많을 경우에는 이러한 성능 최적화에 더욱 신경을 써야 한다.리액트의 Virtual DOM이 Props의 변화를 감지하기 위해, 이전의 Props와 새로 .. 2022. 2. 10. 이전 1 2 3 4 5 ··· 15 다음 반응형
