리액트

[라이트세일/EC2 우분투] Nginx로 express/react 서버 리버스 프록시 구성하기 / 웹서버 프론트앤드/백앤드 연동 / 설정 방법

서론 자 이전 포스팅들을 통해서 내 라이트세일 우분투 서버에서 nodejs 환경기반으로 express/react 앱을 구동시키는 과정을 밟았다. git 저장소 연동 https://extsdd.tistory.com/449 [라이트세일/EC2] 우분투 리눅스 서버에 nodejs express / react 배포하기 / 프론트앤드, 백앤드 API 프로 서론 nodejs 환경에서 express 백앤드와 react 프론트앤드를 만들었고, 로컬환경에서 내 git 저장소에 모두 커밋을 해두었다. 이제 우리가 해야할 이은 git 저장소에 있는 소스코드 기반으로 내 라이트 extsdd.tistory.com 이 포스팅이 git 저장소 연동하여 부팅까지 시킨 포스팅이고 FE/BE 백그라운드 실행 https://extsdd...

[nodejs/React] Nginx <> React 프론트앤드 리버스 프록시 접속시 Invalid Host 페이지 해결 방법 / DANGEROUSLY_DISABLE_HOST_CHECK=true

현상 라이트세일 우분투 서버에서 Nginx 를 통해 내가만든 리액트 앱으로 리버스프록시를 구성하고, 접속을 해보는데 아래와같은 페이지가 표시되었다. Invalid Host header 원인 { "name": "my-react-app", "version": "1.0.0", "private": true, "homepage": "/", "scripts": { "start": "HOST=my-domain.com react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, // ... } 프로젝트의 package.json 내용중 start 스크립트를 보면 HOST에..

[EC2/라이트세일] 리눅스서버에 nodejs express/react 실행 후 외부에서 접속되지 않는 경우 / AWS 포트 방화벽 설정 / 사이트에 연결할 수 없음 / ERR_CONNECTION_TIMED_OUT / 공인 IP

현상 자 저번시간까지 이제 nodejs 환경에서 구동되는 express BE, react FE를 git 저장소에 올려서 내 라이트세일 우분투 서버까지 저장소 연동을하여 부팅하는데 성공했다. 그리고 리눅스 환경에서 백그라운드로 동작할 수 있게 forever 설정까지 끝냈다. 여기까지는 아래 포스팅을 참고하면 된다. https://extsdd.tistory.com/453 [라이트세일/EC2] 우분투 리눅스 서버에서 express, React 서버 백그라운드 실행 방법 / forever 설치 / np 서버 백그라운드 실행? 현재 내 라이트세일 리눅스 서버에서 express 로 만든 app을 실행시키면 이렇게 나온다. 서버가 정상적으로 켜졌고, 예상한대로 내가만든 API 에 대한 응답을 모두 정상처리 extsd..

[React] EC2/라이트세일 서버에서 리액트 npm start 배포/빌드/구동시 서버 멈춤 해결하기 / 메모리 부족 / 스왑 메모리 설정 / Swap Memory

현상 로컬환경에서 리액트 프론트앤드 서버구축을 끝냈고 git 저장소로 올려 이제 서버 배포하는 단계에서 문제가 일어났다. 서버 터미널에서 npm start 명령어를 이용해 앱을 실행하면 빌드과정을 거쳐 앱이 구동되는데.. 위 화면을 마지막으로 계속 터미널 접속이 멈추는것... 위 터미널만 멈추는 것이 아니고.. 새 터미널로 서버에 접속하려고해도.. 서버에서 응답을 주지 않았다. 즉..서버가 뻗어버린 것.. 기존에 올라가있던 앱들도 무응답을 현상을 보였다. 메모리 부족 그래서 원인이 뭘까 추측과 테스트를 반복하는 과정에서 놀랍게도 진짜 리앱트 앱이 구동될때만 이런 현상이 나타나기 시작했다. 그럼 왜.. 리액트 앱이 구동될때 이렇게 되는걸까..? 가장 먼저 의심이 들었던건 설마..? 메모리부족..? 일까....

[React] 리액트 실행시 FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory 에러 발생 / 힙메모리 부족

현상 로컬에서 만든 react 프론트 앤드를 라이트세일 서버에 올렸고 npm start 커멘드를 이용해 실행시켰는데 위처럼 나왔다. FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory 내용을 보면 힙메모리가 부족해서 OOM 이 발생했다는 뜻이다. 해결 방법 현재 Heap 사이즈 확인 node -e 'console.log(v8.getHeapStatistics().heap_size_limit/(1024*1024))' 현재 약 512 메가가 힙사이즈로 할당되어있다. Heap 사이즈 변경 $ export NODE_OPTIONS=--max_old_space_size=8192 다른 가이드를 보면 터미널에서 위 명령어를 수..

[라이트세일/EC2] 우분투 리눅스 서버에 nodejs express / react 배포하기 / 프론트앤드, 백앤드 API 프로젝트/ git 배포방법

서론 nodejs 환경에서 express 백앤드와 react 프론트앤드를 만들었고, 로컬환경에서 내 git 저장소에 모두 커밋을 해두었다. 이제 우리가 해야할 이은 git 저장소에 있는 소스코드 기반으로 내 라이트세일 리눅스 서버에 배포하는 것.! 일단 BE 배포나 FE 배포나 둘다 nodejs 환경이기때문에 그놈이 그놈이고 방법이 크게 다르지 않아 일단 express 로 구현한 backend 서버 배포하는 방법에 대해 알아보자! node 구동 환경 준비 먼저 라이트세일이나 EC2 리눅스 서버에서 node 기반 앱을 구동하기 위해서는 nodejs 런타임 환경과 npm 도구를 설치해줘야한다. https://extsdd.tistory.com/444 [Mac 환경설정] 라이트세일/EC2 우분투 리눅스 서버에 ..