본문 바로가기

전체 글158

AWS EC2 빌드시 메모리 부족 문제 해결 우분투 서버의 프론트 폴더를 빌드하던 중 Creating an optimized production build .. 까지만 진행 후 아무리 기다려도 멈춤 상태로 빌드가 진행되지 않았다. 찾아보니 빌드 멈춘 원인은 aws 메모리 부족 문제였고, 이 경우 본인의 로컬 서버에서 빌드를 진행 후 빌드 결과물인. next를 서버로 전송하여 서버를 실행하여야 한다.  1. (우분투 서버 아닌 본인의 로컬 서버에서 진행) 프로젝트에서 터미널 열고 모든 작업 처리 후, npm run build 2. brew install git-lfs 설치 여기서 git-lfs를 설치하는 이유는, git은 작은 소스코드 파일들을 위한 버전 컨트롤 시스템으로 100Mb부터는 push가 되지 않는다. 그럼에도 위에서처럼 부득이하게 대용.. 2022. 5. 24.
[React Err] Can't perform a React state update on an unmounted component.. 해결하기 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function. 프로젝트 진행 중, 처음 로그인하는 SignInScreen에서 이와 같은 경고가 발생했다. 무시해도 앱은 잘 구동되지만, 이런 건 바로바로 해결해줘야 속이 시원하다 🤧 에러 메시지를 해석해보면 언마운트 된 상태에서 리액트의 state를 업데이트하려고 하여 발생한 경고인 것을 확인이 가능하고, 밑에 줄에.. 2022. 4. 23.
Strapi 스트라피로 api 만들기 백엔드에 대한 지식이 없어도 strapi를 이용하여 서버 구축이 가능하다. 주로 백엔드 기술을 다루지 못하거나 MVP를 만드는 상황에서 사용하기에 괜찮은 방법이다 yarn create strapi-app [프로젝트명] --quickstart 로 설치했다가, 버전의 차이인 건지.. 설치가 제대로 되지 않았다 현재 버전이 v4이고, 스택오버플로어 검색 결과 @beta를 붙이니까 v3버전으로 설치되었다 npm install -g strapi@beta strapi new [프로젝트명] --quickstart 위에서 npm 글로벌 베타로 설치 후, 터미널 재실행 -> 밑에 명령어를 입력하니 원하던 데로 설치가 완료되었다. strapi 서버 종료 후 재실행을 하고 싶으면 strapi develop 명령어를 입력한다.. 2022. 2. 28.
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.
반응형