And_181203 아이오닉+앵귤러JS 세팅

참고 사이트 

http://superwony.tistory.com/

코르도바 + AJAX 조합 : 카톡인증 

아이오닉 + 앵글러JS 조합 + 구글 파이어베이스 

아이오닉설치 

https://ionicframework.com/docs/intro/installation/

4버전은 아직 안정화가 안됨 

CLI 방식으로 인스톨 

코르도바는 이미 설치했으므로 

만약 잘못설치해서 ionic4 가 설치가 되었다면 먼저 삭제해준다.

npm uninstall -g ionic

그리고 다시 1버전으로 설치

npm install -g cordova ionic@1.7.16

출처: http://haru.kafra.kr/61 [어제도 오늘도 내일도 언제나 하루]

$ npm install -g ionic

$ ionic start helloWorld blank

핼로 월드는 프로젝트 이름 블랭크는 빈 프로젝트 형태

y는 4로 설치하냐고 물어봄 y/n

n을 누름

아이오닉 SDK 쓸거냐고 물어봄 firebase를 사용할거기 때문에 n 

$ cd helloWorld

해당 프로젝트로 이동

ionic cordova platform add android

--설정파일에 안드로이드 설정을 설정함 

ionic cordova build android

$ ionic serve

이렇게 하면

화면이 뜬다

파이어베이스

https://firebase.google.com/?refresh=1

프로젝트 생성후 좌측상단 문서로이동 클릭후  Authentication에

더미 확인용 이메일을 입력

문서로 이동

자바스크립트 프로젝트에 Firebase 추가

https://firebase.google.com/docs/web/setup?hl=ko

비주얼스튜디오 코드 설치

파이어베이스 이용으로 서버로 기능을 맞기기때눔에 비주얼 스튜디오 코드로 화면만 작성한다.

http://ithub.tistory.com/43

비주얼스튜디오코드 실행후 해당폴더 오픈

id가 유니크 해야하므로 바꿔준다

https://ko.wikipedia.org/wiki/%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8

설정파일 

https://firebase.google.com/docs/web/setup?hl=ko 에서 임포트 사이에 넣고 스크립트 태그를 지운다 

cmd 를 킨다 

npm install firebase@4.8.1 --save

import * as firebase from "firebase";

를 추가하고 

contructor에 firebase.initalize(config)를 넣는다 그러면 생성과 동시에 파이어베이스와 연동된다. 

cmd 에 입력

ionic g page login 

페이지만들때는 cmd에 위와 같은 방식으로 만든다. 

import 해줌

cmd 에 다시 ionic serve 문제 

Cannot find module '@firebase/app-types/private'.

모듈이랑 부트스트랩에도 추가한다 

다시 

ionic serve 하면  login페이지가 떠야한다 아무것도 작성하지 않아서 빈 화면이긴하다 .