Google Firebase 개발환경 구축하기 (3)

Google Firebase CLI

Google firebase 를 제대로 컨트롤 하고 싶은가?  

Google firebase 사이트에서 많은 것을 제공하지만, 개발 PC에 Firebase CLI 를 설치해서 사용하자.

firebase-tools-instant 프로그램 설치 (Windows,Mac) 

아래 사이트에 접속하여 바이너리를 다운로드 한다.

https://firebase.google.com/docs/cli?hl=ko#install-cli-windows

설치가 되면, 파이어베이스 네온싸인이 등장한다. 

그리고,

Firebase CLI 로그인 화면이 팝업된다. 

팝업 창에서 구글계정으로 로그인을 수행하고, 바로 [허용] 을 선택한다.

firebase tools 설치 

Google 로부터 firebase 사용허락을 받아냈으니. Firebase tools 를 설치하도록 하자.

Firebase CLI 콘솔창 커맨트라인에서 아래와 같이 실행한다.

> npm install -g firebase-tools 

그리고,

콘솔창에서 아래명령으로 로그인을 시도해본다.

> firebase login 

Okay, 로그인이 되었다면, 프로젝트 목록도 조회해보자.

파이어베이스(firebase) 프로젝트 목록 조회 

> firebase projects:list 

프로젝트 디렉토리 생성 

프로젝트 목록이 나오는가? 

로컬디렉토리에 프로젝트 공간을 만들어야 한다.

위 목록에서 확인된 프로젝트명으로 로컬에 디렉토리를 만들자 

mkdir c:\apps

mkdir c:\apps\number1app

프로젝트 초기화 실행 

만든 디렉토리에 진입하자

cd c:\apps\number1app

프로젝트 초기화 .

엄격히 말하면, "프로젝트 초기화"가 아니라, "프로젝트 최초구성" 정도로 해석하는게 옳다.

주의할점은,  반드시!  해당 프로젝트디렉토리내에서 진행한다.

> firebase init 

위와 같이 실행하면,

로컬 프로젝트공간에 Firebase 프로젝트 구성정보가 로딩되는 시나리오가 진행된다. .

[*] Firebase  Database 항목을 선택,  스페이스바로 선택한다.

..

[*] Hosting  항목을 선택, 스페이스바로 선택.

엔터를 치면 아래와 같다. (엔터는' 절대긍정'을 의미한다)

(github 계정이 있다면, 자동적으로 github 에 연동까지 해준다. 이부분은 생략해도 된다.) 

Authorize Firebase CLI 

팝업 창의 하단버튼 Authorize firebase 클릭하여 권한을 부여한다.

Firebase 프로젝트 선택 

이미 존재하는 프로젝트를 만들어 두었으므로, [ Use an existing project ]를 선택하도록한다.

현재 존재하는 project 목록이 나열되며, 현재 진행중인 프로젝트 선택하고 클릭한다.

Firebase Rule 파일 생성 

Json 포맷의 Database Rule 파일이 생성되고 받아온다.

엔터를 치면, (엔터는 절대긍정의 의미)

아래와 같이 파일이 생성되어 들어온 것을 확인할 수 있다.

웰컴 되것다.

'

구글 firebase 가 나의 프로젝트 공간으로 들어오다.

로컬 디렉토리를 확인해보자.

아래 파일을 열어 확인해보자.

1. firebase.json

2. database.rules.json 

3. public/index.html 

firebase 로컬 웹서버 기동 

> firebase serv

웹브라우저에서 접속해보자.

http://localhost:5000

firebase 가 만들어준 로컬에 저장된 index.html 이 로딩되는것을 확인할 수 있다.

오늘의 성과를 정리해 보자.

1. firebase CLI 프로그램을 설치했고,

2. firebase tools 를 설치했다.

3. firebase CLI 명령으로 프로젝트를 확인하고,

4. 로컬 PC에 신규프로젝트 공간을 할당하여, 프로젝트 디렉토리를 만들었다.

5. 그리고, firebase 프로젝트 rule 파일들, index.html 리소스파일이 로컬 디렉토리에 들어오는 것을 확인했다.

6. 그리고 firebase cli 명령으로 로컬 웹서버를 기동시키고,

7. 웹브라우저에 접속해서 나의 프로젝트 디렉토리의 웹 컨텐츠를 확인 했다.

그렇다. 우리는 해냈다. 

구글의 파이어베이스가 나의 PC로 온 것이다.

자. 이제 코딩만 하면 된다.