챌린지 48일 차. 48일 차...? 48일 차.....??? 남은 챌린지 기간 단 2일..? 49일 차, 50일 차가 지나가면 끝이라고라? 벌써 50일이 거의 다 지나간다니 정말 믿기지가 않아~! 공부하고 하루 일과처럼 작성하던 포스팅이였었는데 끝나면 어색할 것 같다.
리액트 SPA 프로젝트 배포하기
npm run build
- production 모드로 빌드되어 "build" 폴더에 파일을 생성한다. 이때 만들어진 파일들을 웹서버를 통해 사용자가 접근할 수 있도록 처리한다.
- build/static 폴더 안에 JS, CSS 파일들이 생성된다. 이때 파일 이름에 hash 값이 붙는다. (ex)main.eb74f3d0.chunk.css)
SPA Deploy의 특징
- 모든 요청을 서버에 하고 받아오는 형태가 아니다.
- 라우팅 경로에 상관없이 리액트 앱을 받아 실행한다.
- 라우팅은 받아온 리액트 앱을 실행 후 적용한다.
- static 파일을 제외한 모든 요청을 index.html로 응답해 주도록 작업한다.
만약 파일이 없는 경우 index.html을 내려줄 수 있도록 작업하는 방식을 다음과 같은 네가지로 작업해볼 수 있다.
1. serve -s build (serve라는 노드 명령어로 배포한다.)
2. AWS S3 에 배포한다.
3. node.js express
4. NginX
위의 방법에 관한 내용은 다음 장에 새로운 글로 작성해보도록 하겠다.
패스트캠퍼스 [직장인 실무교육]
프로그래밍, 영상편집, UX/UI, 마케팅, 데이터 분석, 엑셀강의, The RED, 국비지원, 기업교육, 서비스 제공.
fastcampus.co.kr
본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성되었습니다.
#패스트캠퍼스 #패캠챌린지 #직장인인강 #직장인자기계발 #패스트캠퍼스후기 #한번에끝내는프론트엔드개발초격차패키지online
