[reactjs] firebase 에서 react.js 웹 호스팅하기

참고

# Goal

- 로컬에 생성한 react.js 웹 프로젝트를 firebase로 배포하고 테스트

# 준비

- npm 설치되어있어야 함.

- firebase 계정 및 프로젝트 생성

# 전체 순서

-> react 프로젝트 생성

-> 생성한 react 프로젝트를 firebase 프로젝트로 설정

-> firebase 배포

# create-react-app 설치 및 빌드

$ npm install -g create-react-app

$ cd projects (프로젝트 상위폴더)

$ create-react-app test_app

$ cd test_app (react 프로젝트 이름)

$ npm start

-> 로컬 웹접속 테스트 (localhost:3000)

$ npm run build

-> 빌드 완료

# firebase 설치

$ npm install -g firebase-tools

$ firebase login

-> firebase 계정으로 로그인

# firebase 프로젝트 등록

$ cd test_app

$ firebase init

-> 프로젝트 특성을 선택하는 화면

-> database, hosting 을 선택한다.

Database Rules을 묻는다. -> default 선택

deploy 디렉토리를 묻는다. -> build 라고 입력

single-page app 설정을 할지 묻는다. -> y 입력

index.html 을 overwrite하지 묻는다. -> n 입력

완료되면, http://{project}.firebaseapp.com 로 접속 가능함.

seize the day