그냥 개발자 블로그

푸시 사용 준비하기 (FCM) - 안드로이드 모바일웹으로 하이브리드앱 만들기 2 본문

프로그래밍팁/android

푸시 사용 준비하기 (FCM) - 안드로이드 모바일웹으로 하이브리드앱 만들기 2

마음이파파 2017. 6. 11. 20:28

모바일웹을 기반으로한 하이브리드앱을 만들때 네거티브앱에서 지원하는 일부 기능들이 필요할때가 있습니다.


대표적인 예로 푸시 기능이 있습니다.


여기서는 GCM이 아닌 FCM 방식을 이용한 푸시기능을 만들어 보겠습니다.


단, 안드로이드 폰으로 푸시 데이터를 보내는 서버 제작 방법은 별도로 다루겠습니다.






1. 우선 구글의 개발자 계정이 필요합니다. 개발자 계정 생성 방법은 별도로 검색해 보시기 바랍니다. https://console.firebase.google.com/ 페이지로 엽니다.







2. 처음 firebase를 방문했다면 프로젝트 추가를 클릭합니다. (처음 방문했다면 application 이라는 내용은 보이지 않습니다.)








3. 프로젝트 이름은 application, 국가/지역은 대한민국으로 설정하고 프로젝트를 만들었습니다. 프로젝트 안에 여러 개의 어플이 들어갈수 있습니다. 프로젝트는 그룹이라고 생각해주시면 됩니다.











4. 위에서 만들어진 프로젝트를 선택 합니다.







5. 다른 앱 추가를 클릭합니다. 만들 어플을 등록하여 주는 과정 입니다.







6. 안드로이드를 클릭 합니다.








7. 프로젝트 생성 하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 1 에서 만든 패키지 이름과 앱 닉네임을 작성 합니다. 앱 닉네임은 firebase에서 관리하기 편한 이름를 아무렇게나 만드시면 됩니다.










8. 디버그 서명 인증서 SHA-1 을 작성해줘야하는데 이 부분은 터미널을 통해서 추출해줘야 합니다. 만드는 방법은 물음포 아이콘을 눌러서 나오는 링크를 클릭하여 확인하실 수 있습니다. 만드는 방법은 맥과 윈도우 두가지 방법 모두 있으며 개발 환경에 맞는 방법을 선택해서 만들어 줍니다.












8-1. 저의 개발환경은 맥입니다. 맥에서 터미널에서 아래와 같이 명령어를 작성하여 실행 합니다.







8-2. 비밀번호를 입력하라는 메시지 입니다. 비밀번호는 android 입니다.





8-3. SHA1 부분을 복사 합니다. (보안을 이유로 일부 내용을 모자이크 처리 하였습니다.)






9. 8-3에서 복사한 내용을 붙여 넣은 후 앱등록을 클릭 합니다.










10. google-servies.json 파일을 다운로드 받아 프로젝트 생성 하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 1설치 합니다. 설치 방법은 팝업에서 자세하게 안내하고 있음으로 그대로 따라하시면 됩니다.













11. 다음페이지에서 SDK 추가하는 방법에 대해서 자세하게 설명되어 있습니다. 그대로 따라 해주시면 됩니다.











11-1. build.gradle (Project: myapp) 파일을 아래와 같이 추가합니다.












11-2. build.gradle (Module: app) 파일을 아래와 같이 추가합니다.











11-3. Sync Now 를 클릭 해줍니다.








12. AndroidManifest.xml 에 서비스를 추가 합니다.









[안드로이드 앱 제작 문의]








[목차]


1. 프로젝트 생성 하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 1


2. 푸시 사용 준비하기 (FCM) - 안드로이드 모바일웹으로 하이브리드앱 만들기 2


3. 푸시 기능 만들기 (FCM) - 안드로이드 모바일웹으로 하이브리드앱 만들기 3


4. 푸시 테스트 하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 4


5. 웹뷰추가하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 5


6. 웹뷰에서 자바스크립트 동작 처리하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 6


7. 뒤로 버튼 눌렀을때 동작 처리하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 7


8. 인트로(스플레시) 만들기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 8


9. 아이콘 설정하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 9


10. 테스트용 APK 추출하기 - 안드로이드 모바일웹으로 하이브리드앱 만들기 10





[앱제작문의]




copyright (c) 2017 워크식스