52
백엔드 서버 구축 없이 모바일 앱 만들어보기 안세원 [email protected] GDG Korea Android

백엔드 서버 구축없이 모바일 앱앱 만들어보기

Embed Size (px)

Citation preview

Page 1: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

백엔드 서버 구축 없이 모바일 앱 만들어보기

안세원����������� ������������������  ����������� ������������������  [email protected]����������� ������������������  GDG����������� ������������������  Korea����������� ������������������  Android

Page 2: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

백 엔드 서버 안만들고 미리 만들어둔 컨텐츠를 제공하는 모바일 앱 만들어보기

진짜 제목은…

Page 3: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

발표자

• 안세원[email protected]����������� ������������������  

• GDG����������� ������������������  Korea����������� ������������������  Android����������� ������������������  

• 다음카카오

3

Page 4: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

대박 앱, 나도 한번?

4

Page 5: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

개인 앱 만들기 프로세스

5

서버����������� ������������������  필요?[아니오] [예]

앱을����������� ������������������  만든다 서버를����������� ������������������  만든다.

헐����������� ������������������  대박!

Page 6: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

서버를 만들자!

6

Page 7: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

서버를 만들자!

7

Page 8: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

서버를 만들자!

8

Page 9: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

서버를 만들자!

9

아 놔!! 내가 페이스북을 만들자고 이러는 것도 아닌데!!!

Page 10: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

아주 동적인 컨텐트를 제공하지 않는다면 좀 쉬운 방법이 있지 않을까?

Page 11: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

발표자 (다시)

• 안세원[email protected]����������� ������������������  

• GDG����������� ������������������  Korea����������� ������������������  Android����������� ������������������  

• 다음카카오

11

Page 12: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

12

PS4 NEWShttp://goo.gl/RVsQvx

느린 소니 사이트에서 게임목록 확인하기 짜증난다! 앱으로 한번 만들어보자! !• 모든 사람에게 동일한 게임 목록을 보여주고 싶고 • 게임 가격, 평가 등등은 어느정도 동적으로 만들자! • 근데 겨우 이거 만드는데 서버까지 구현해야 할까?

Page 13: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

Google Apps Script 출동!• 자바스크립트로����������� ������������������  작성����������� ������������������  

• 닥스,����������� ������������������  드라이브,����������� ������������������  지메일����������� ������������������  등����������� ������������������  구글����������� ������������������  서비스와����������� ������������������  손쉽게����������� ������������������  연동����������� ������������������  

• 간단한����������� ������������������  디버거����������� ������������������  제공����������� ������������������  

• URL����������� ������������������  Fetch,����������� ������������������  Preference����������� ������������������  등����������� ������������������  다양한����������� ������������������  API����������� ������������������  제공����������� ������������������  

• 웹����������� ������������������  앱����������� ������������������  (doGet,����������� ������������������  doPost)����������� ������������������  으로����������� ������������������  퍼블리싱����������� ������������������  가능����������� ������������������  

• 트리거를����������� ������������������  이용해����������� ������������������  주기적인����������� ������������������  갱신����������� ������������������  가능

13

https://developers.google.com/apps-script/

Page 14: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

PS4 News 적용사례 - 데이터

14

게임 데이터는 스프레드 시트로 관리!… 입력은 수작업 노가다

스크립트로 관리 메뉴 추가

Page 15: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

PS4 News 적용사례 - 스크립트

15

매 시 소니 사이트에서 가격정보 업데이트!매 시 metacritic 점수 평점 업데이트!스프레드 시트 정보를 구글 드라이브에 json 포맷으로 저장!스프레드 시트에 편의 메뉴 추가

Page 16: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

PS4 News 적용사례 - 앱 연동

16

구글 드라이브의 호스팅 기능으로 json 제공!앱은 이 url 호출

Page 17: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

17

오늘의 이슈http://goo.gl/6sNWLc

• 24시간 동안의 다음 인기 검색어 목록 조회 • 현재 인기 검색어 목록 조회 • 9시/19시에 푸시 발송 • 해당 검색어에 대한 댓글 남기기 기능

트랜디한 현대인의 필수 앱!!

Page 18: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

18

오늘의 이슈http://goo.gl/6sNWLc

…⋯은����������� ������������������  아니고����������� ������������������  그냥����������� ������������������  이번����������� ������������������  발표용����������� ������������������  샘플����������� ������������������  앱

• 24시간 동안의 다음 인기 검색어 목록 조회 • 현재 인기 검색어 목록 조회 • 9시/19시에 푸시 발송 • 해당 검색어에 대한 댓글 남기기 기능

트랜디한 현대인의 필수 앱!!

Page 19: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

할일 목록• 인기����������� ������������������  검색어를����������� ������������������  가져와서(페이지����������� ������������������  스크레이핑)����������� ������������������  시트에����������� ������������������  추가����������� ������������������  

• 매����������� ������������������  시����������� ������������������  인기����������� ������������������  검색어����������� ������������������  가져오도록����������� ������������������  트리거����������� ������������������  작성����������� ������������������  

• 시트����������� ������������������  내용을����������� ������������������  구글����������� ������������������  드라이브에����������� ������������������  저장����������� ������������������  

• 인기����������� ������������������  검색어����������� ������������������  파싱����������� ������������������  결과를����������� ������������������  바로����������� ������������������  가져오는����������� ������������������  웹����������� ������������������  앱����������� ������������������  작성����������� ������������������  

• 특정����������� ������������������  시점에����������� ������������������  푸시����������� ������������������  발송����������� ������������������  

• 이슈에����������� ������������������  댓글����������� ������������������  남기기����������� ������������������  구현

19

Page 20: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

구글 앱스 스크립트 시작하기

• 구글����������� ������������������  드라이브에����������� ������������������  스프레드시트를����������� ������������������  생성����������� ������������������  

• Tools����������� ������������������  >����������� ������������������  Script����������� ������������������  editor����������� ������������������  선택

20

Page 21: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

구글 앱스 스크립트 시작하기

21

Page 22: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

구글 앱스 스크립트 시작하기

22

슬슬 짜 봅시다!

Page 23: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

할일 목록

• 인기����������� ������������������  검색어를����������� ������������������  가져와서(페이지����������� ������������������  스크레이핑)����������� ������������������  시트에����������� ������������������  추가����������� ������������������  

• 매����������� ������������������  시����������� ������������������  인기����������� ������������������  검색어����������� ������������������  가져오도록����������� ������������������  트리거����������� ������������������  작성����������� ������������������  

• 시트����������� ������������������  내용을����������� ������������������  구글����������� ������������������  드라이브에����������� ������������������  저장����������� ������������������  

• 인기����������� ������������������  검색어����������� ������������������  파싱����������� ������������������  결과를����������� ������������������  바로����������� ������������������  가져오는����������� ������������������  웹����������� ������������������  앱����������� ������������������  작성����������� ������������������  

• 특정����������� ������������������  시점에����������� ������������������  푸시����������� ������������������  발송����������� ������������������  

• 이슈에����������� ������������������  댓글����������� ������������������  남기기����������� ������������������  구현

23

Page 24: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

인기 검색어 페이지 스크레이핑

24

Page 25: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

시트에 스크레이핑 정보 기록

25

Page 26: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

할일 목록

✓ 인기����������� ������������������  검색어를����������� ������������������  가져와서(페이지����������� ������������������  스크레이핑)����������� ������������������  시트에����������� ������������������  추가����������� ������������������  

• 매����������� ������������������  시����������� ������������������  인기����������� ������������������  검색어����������� ������������������  가져오도록����������� ������������������  트리거����������� ������������������  작성����������� ������������������  

• 시트����������� ������������������  내용을����������� ������������������  구글����������� ������������������  드라이브에����������� ������������������  저장����������� ������������������  

• 인기����������� ������������������  검색어����������� ������������������  파싱����������� ������������������  결과를����������� ������������������  바로����������� ������������������  가져오는����������� ������������������  웹����������� ������������������  앱����������� ������������������  작성����������� ������������������  

• 특정����������� ������������������  시점에����������� ������������������  푸시����������� ������������������  발송����������� ������������������  

• 이슈에����������� ������������������  댓글����������� ������������������  남기기����������� ������������������  구현

26

Page 27: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

트리거 등록

27

Page 28: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

트리거 등록

28

ScriptApp의 메서드를 이용하면 프로그램적으로 트리거를 등록/삭제할 수 있음

Page 29: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

할일 목록

✓ 인기����������� ������������������  검색어를����������� ������������������  가져와서(페이지����������� ������������������  스크레이핑)����������� ������������������  시트에����������� ������������������  추가����������� ������������������  

✓ 매����������� ������������������  시����������� ������������������  인기����������� ������������������  검색어����������� ������������������  가져오도록����������� ������������������  트리거����������� ������������������  작성����������� ������������������  

• 시트����������� ������������������  내용을����������� ������������������  구글����������� ������������������  드라이브에����������� ������������������  저장����������� ������������������  

• 인기����������� ������������������  검색어����������� ������������������  파싱����������� ������������������  결과를����������� ������������������  바로����������� ������������������  가져오는����������� ������������������  웹����������� ������������������  앱����������� ������������������  작성����������� ������������������  

• 특정����������� ������������������  시점에����������� ������������������  푸시����������� ������������������  발송����������� ������������������  

• 이슈에����������� ������������������  댓글����������� ������������������  남기기����������� ������������������  구현

29

Page 30: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

구글 드라이브에 파일 저장

30

Page 31: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

구글 드라이브에 파일 저장

31

파일은 만들었는데 다른 사람은

어떻게 접근하지?

Page 32: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

구글 드라이브에 파일 저장

32

https://support.google.com/drive/answer/2881970?hl=en

호스팅!

Page 33: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

구글 드라이브에 파일 저장

33

https://googledrive.com/host/0B7tMtjE6yzGjMlhTdmc5N3Y0UTQhttps://googledrive.com/host/0B7tMtjE6yzGjMlhTdmc5N3Y0UTQ

Page 34: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

할일 목록

✓ 인기����������� ������������������  검색어를����������� ������������������  가져와서(페이지����������� ������������������  스크레이핑)����������� ������������������  시트에����������� ������������������  추가����������� ������������������  

✓ 매����������� ������������������  시����������� ������������������  인기����������� ������������������  검색어����������� ������������������  가져오도록����������� ������������������  트리거����������� ������������������  작성����������� ������������������  

✓ 시트����������� ������������������  내용을����������� ������������������  구글����������� ������������������  드라이브에����������� ������������������  저장����������� ������������������  

• 인기����������� ������������������  검색어����������� ������������������  파싱����������� ������������������  결과를����������� ������������������  바로����������� ������������������  가져오는����������� ������������������  웹����������� ������������������  앱����������� ������������������  작성����������� ������������������  

• 특정����������� ������������������  시점에����������� ������������������  푸시����������� ������������������  발송����������� ������������������  

• 이슈에����������� ������������������  댓글����������� ������������������  남기기����������� ������������������  구현

34

Page 35: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

웹 앱 작성

• 요청이����������� ������������������  올����������� ������������������  때����������� ������������������  바로바로����������� ������������������  요청을����������� ������������������  처리����������� ������������������  →����������� ������������������  웹����������� ������������������  앱!

35

https://developers.google.com/apps-script/guides/web

Page 36: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

웹 앱 작성

36

Page 37: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

웹 앱 작성

• 코드����������� ������������������  수정����������� ������������������  후엔����������� ������������������  새로운����������� ������������������  버전을����������� ������������������  지정해����������� ������������������  줘야함

37

Page 38: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

할일 목록

✓ 인기����������� ������������������  검색어를����������� ������������������  가져와서(페이지����������� ������������������  스크레이핑)����������� ������������������  시트에����������� ������������������  추가����������� ������������������  

✓ 매����������� ������������������  시����������� ������������������  인기����������� ������������������  검색어����������� ������������������  가져오도록����������� ������������������  트리거����������� ������������������  작성����������� ������������������  

✓ 시트����������� ������������������  내용을����������� ������������������  구글����������� ������������������  드라이브에����������� ������������������  저장����������� ������������������  

✓ 인기����������� ������������������  검색어����������� ������������������  파싱����������� ������������������  결과를����������� ������������������  바로����������� ������������������  가져오는����������� ������������������  웹����������� ������������������  앱����������� ������������������  작성����������� ������������������  

• 특정����������� ������������������  시점에����������� ������������������  푸시����������� ������������������  발송����������� ������������������  

• 이슈에����������� ������������������  댓글����������� ������������������  남기기����������� ������������������  구현

38

Page 39: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

푸시 발송

• 앱스����������� ������������������  스크립트론����������� ������������������  해결����������� ������������������  못함����������� ������������������  →����������� ������������������  외부����������� ������������������  서비스를����������� ������������������  이용!

39

https://parse.com/products/push

Page 40: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

푸시 발송 - 수신

• AndroidManifest.xml

40

Page 41: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

푸시 발송 - 수신

• Application.java

41

Page 42: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

푸시 발송 - 수신

• ParsePushBroadcastReceiver.java

42

Page 43: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

푸시 발송 - 사용자 설정 저장

43

자세한 내용은 parse.com의 도움말 참조

Page 44: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

푸시 발송 - 발송 요청

44

Page 45: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

할일 목록

✓ 인기����������� ������������������  검색어를����������� ������������������  가져와서(페이지����������� ������������������  스크레이핑)����������� ������������������  시트에����������� ������������������  추가����������� ������������������  

✓ 매����������� ������������������  시����������� ������������������  인기����������� ������������������  검색어����������� ������������������  가져오도록����������� ������������������  트리거����������� ������������������  작성����������� ������������������  

✓ 시트����������� ������������������  내용을����������� ������������������  구글����������� ������������������  드라이브에����������� ������������������  저장����������� ������������������  

✓ 인기����������� ������������������  검색어����������� ������������������  파싱����������� ������������������  결과를����������� ������������������  바로����������� ������������������  가져오는����������� ������������������  웹����������� ������������������  앱����������� ������������������  작성����������� ������������������  

✓ 특정����������� ������������������  시점에����������� ������������������  푸시����������� ������������������  발송����������� ������������������  

• 이슈에����������� ������������������  댓글����������� ������������������  남기기����������� ������������������  구현

45

Page 46: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

댓글 남기기 구현• 안드로이드����������� ������������������  네이티브����������� ������������������  솔루

션이����������� ������������������  없으면����������� ������������������  웹뷰로!

46https://disqus.com/admin/create/

Page 47: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

댓글 남기기 구현

• 저는����������� ������������������  웹사이트가����������� ������������������  없는데요?����������� ������������������  →����������� ������������������  구글����������� ������������������  드라이브����������� ������������������  호스팅!

47

Page 48: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

요약• 모든����������� ������������������  사용자에게����������� ������������������  동일한����������� ������������������  컨텐트를����������� ������������������  제공하는����������� ������������������  앱의����������� ������������������  백엔드����������� ������������������  서

버는����������� ������������������  구글����������� ������������������  앱스����������� ������������������  스크립트를����������� ������������������  이용해����������� ������������������  간단히����������� ������������������  구현할����������� ������������������  수����������� ������������������  있다.����������� ������������������  

• 구글����������� ������������������  앱스����������� ������������������  스크립트는����������� ������������������  트리거,����������� ������������������  URLFetch,����������� ������������������  웹����������� ������������������  앱����������� ������������������  등의����������� ������������������  다양한����������� ������������������  도구를����������� ������������������  지원한다.����������� ������������������  

• 정적����������� ������������������  컨텐트는����������� ������������������  구글����������� ������������������  드라이브의����������� ������������������  호스팅����������� ������������������  기능을����������� ������������������  이용한다.����������� ������������������  

• 푸시는����������� ������������������  parse.com����������� ������������������  등의����������� ������������������  서비스를����������� ������������������  이용한다.����������� ������������������  

• 댓글은����������� ������������������  Disqus����������� ������������������  등의����������� ������������������  서비스를����������� ������������������  이용해����������� ������������������  웹뷰로����������� ������������������  제공한다.

48

Page 49: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

제약사항 / 더 공부할 내용

• 스크립트는����������� ������������������  timeout이����������� ������������������  존재한다.����������� ������������������  시간이����������� ������������������  오래걸리는����������� ������������������  스크립트는����������� ������������������  timeout을����������� ������������������  극복할����������� ������������������  방법을����������� ������������������  고민해야����������� ������������������  한다.ex)����������� ������������������  ����������� ������������������  timeout����������� ������������������  안날����������� ������������������  정도의����������� ������������������  처리����������� ������������������  단위로����������� ������������������  분리한����������� ������������������  후����������� ������������������  트리거����������� ������������������  호출����������� ������������������  /����������� ������������������  또다른����������� ������������������  외부����������� ������������������  서비스����������� ������������������  이용����������� ������������������  (응?����������� ������������������  결국����������� ������������������  서버����������� ������������������  코딩����������� ������������������  하라는����������� ������������������  거����������� ������������������  아냐?)����������� ������������������  

• parse.com은����������� ������������������  완전����������� ������������������  공짜����������� ������������������  아니다.����������� ������������������  대박나면����������� ������������������  그����������� ������������������  때����������� ������������������  고민하자����������� ������������������  

• parse.com은����������� ������������������  단순����������� ������������������  푸시����������� ������������������  발송용이����������� ������������������  아닌����������� ������������������  사용자����������� ������������������  데이터����������� ������������������  저장소로도����������� ������������������  충분히����������� ������������������  활용할����������� ������������������  수����������� ������������������  있다.����������� ������������������  

• 어드민����������� ������������������  관리를����������� ������������������  더����������� ������������������  효과적으로����������� ������������������  하기����������� ������������������  위해����������� ������������������  구글����������� ������������������  스프레드����������� ������������������  시트와����������� ������������������  앱����������� ������������������  스크립트의����������� ������������������  연동����������� ������������������  부분을����������� ������������������  더����������� ������������������  공부해보자.

49

Page 50: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

참고자료

• https://developers.google.com/apps-script/����������� ������������������  

• https://parse.com/docs/push_guide#top/Android����������� ������������������  

• https://www.parse.com/docs/android/api/����������� ������������������  

• https://disqus.com/����������� ������������������  

• https://gist.github.com/kingori/98420b577f082f7fc021

50

Page 51: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

51

Page 52: 백엔드 서버 구축없이 모바일 앱앱 만들어보기

고맙습니다.

[email protected] https://plus.google.com/+SewonAnn