우선 Ionic을 이용해서 앱개발을 하고 서버에 배포를 할때 무엇을 사용할까 고민하다가
여러 사이트들을 돌아본 결과 firebase가 쉬운 배포와 실시간 데이터 베이스등 여러가지를 고려해봤을 때
좋은 조합을 만들수 있을 것같아서 적용해 보기로 한다.
우선은 당연하겠지만
https://console.firebase.google.com
에서 firebase에 가입한다.
그리고 프로젝트를 만들고
firebas CLI를 설치한다.
(이것을 통해서만 배포가 가능하고 배포한 소스를 다운받거나 할 수는 없다고한다. 하지만 롤백기능은 제공하고 있다. 그래서 소스관리는 git이나 SVN을 통해서 하면 좋을 것같다.)
$ npm install -g firebase-tools
$ firebase -V
3.0.4
파이어베이스 CLI를 설치후 ionic을 빌드한다.
$ ionic cordova build browser
물론 이미 플랫폼을 추가 해 놓으신 분도 있겠지만 웹빌드를 위한 명령어이다. 그러면 www폴더가 생성된다.
그리고 현재 폴더 (앱 root 폴더안 )에서
$ firebase init
명령어를 실행한다.
위와 같은 화면이 나오면서 몇가지 질문에 답하면 된다.
우리는 지금 호스팅을 할거기 때문에 몇개의 리스트 중에서(()DATABASE, ()HOSTING...... 등등)
중에서 HOSTING을 선택하고 아까 웹콘솔에서 생성한 앱을 선택하고 넘어가면 .firebaserc와 firebase.json파일이 생성된다.
이파일들이 배포할때 기준이 되기때문에 잘보관해야한다.
다른 사이트에서는 몇가지 질문들 public directory 경로라거나 url이라거나 404page 덮어씌울꺼냐거나 index.html 덮어씌울꺼냐 거나 ..
하지만 난 그런질문이 나오지 않았다. 혹시 버전 차이 일수 있기때문에 예전 버전에서 물어본다면.(왜냐면 난 오늘 설치했으니 최신이라 믿고..)
첫번째 public directory경로는 우리는 root>www폴더가 웹으로 배포할때 사용하는 폴더이므로 www 라고 적어 주면 되고 나머지는
NO라고 단호하게 대답해 주면 되시겠다.
그리고 .firebaserc와 firebase.json파일을 까보면 .firebaserc에는 프로젝트 명과 alias(설정했다면.. 굳이 안해도 되는듯)이름이 들어가 있고
firebase.json에는 원래 호스팅 정보가 있어야 하지만 내꺼에는 {} 두개의 중괄호만이 나를 맞이했다...
그래서 내가 수동으로 써줬다. ..
{ "hosting": { "public": "www", "ignore": [ "firebase.json", "**/.*", "**/node_modules/**" ] } }
원래는 아마 질문에 입력하면서 해당 정보를 알아서 작성해주는것같은데 나는... 뭘잘못한거지.. 모르니까 우선 위와 같이 수정하면 된다.
그리고 나서 디플로이를 하려고 명령어를 누르면 에러발생....
호스팅키가 없네 어쩌네.. 하는것 같은데 중간에 있는 명령어를 입력하라길래 시키는대로 했음
firebase tools:migrate
그랬더니 새로운 설정으로 덮어씌울거냐고 물어봐서 냉큼 예라고 대답하니까 또 알아서 설정파일을 다듬어(?)주는 것 같았다..
암튼 그리고 나서 혹시 CLI 로그인을 안하셨다면..(당연히 안했겠지.. 위에 없으니.. 내가 이미 한상태라서.. 까먹고 있었습니다. 지송..)
$ firebase login
저렇게 하면 기본브라우져가 뜨면서 firebase login succeeded라고 뜬다. 그럼 로그인 성공.
하고 나서 . 대망의 배포...
$ firebase deploy
이명령어 한방이면 설정에 맞춰서 배포 주루루룩 물론 콘솔에 로그인 되어 있으면 배포 상황이나 누가 배포했는지도 다 나온다.
껄껄껄 이렇게 편할수가.. AWS에 배포할라고.. 몰라서 겁나 손발 고생했는데.. 이렇게 쉽다니 감사. 역시 구글 감사.. ㅋㅋㅋㅋㅋ
다른 분들은 그런 고생하지 마시길 ㅎㅎㅎ
(참고 https://medium.com/google-developer-experts/deploy-your-app-to-firebase-in-seconds-b3a9a37dff47)
'프로그래밍 > IONIC' 카테고리의 다른 글
[IONIC]background image blur (0) | 2018.01.18 |
---|---|
[IONIC]아이콘과 splash 이미지 만들기 (0) | 2018.01.11 |
[IONIC]ionic 명령어로 ios platform 실행하기 (0) | 2018.01.07 |
[IONIC]adb 사용을 위한 환경설정 (0) | 2018.01.07 |