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

  • View
    2.094

  • Download
    0

  • Category

    Software

Preview:

Citation preview

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

안세원����������� ������������������  ����������� ������������������  kingori@gmail.com����������� ������������������  GDG����������� ������������������  Korea����������� ������������������  Android

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

진짜 제목은…

발표자

• 안세원kingori@gmail.com����������� ������������������  

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

• 다음카카오

3

대박 앱, 나도 한번?

4

개인 앱 만들기 프로세스

5

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

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

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

서버를 만들자!

6

서버를 만들자!

7

서버를 만들자!

8

서버를 만들자!

9

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

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

발표자 (다시)

• 안세원kingori@gmail.com����������� ������������������  

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

• 다음카카오

11

12

PS4 NEWShttp://goo.gl/RVsQvx

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

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

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

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

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

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

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

13

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

PS4 News 적용사례 - 데이터

14

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

스크립트로 관리 메뉴 추가

PS4 News 적용사례 - 스크립트

15

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

PS4 News 적용사례 - 앱 연동

16

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

17

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

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

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

18

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

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

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

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

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

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

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

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

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

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

19

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

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

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

20

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

21

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

22

슬슬 짜 봅시다!

할일 목록

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

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

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

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

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

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

23

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

24

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

25

할일 목록

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

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

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

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

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

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

26

트리거 등록

27

트리거 등록

28

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

할일 목록

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

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

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

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

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

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

29

구글 드라이브에 파일 저장

30

구글 드라이브에 파일 저장

31

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

어떻게 접근하지?

구글 드라이브에 파일 저장

32

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

호스팅!

구글 드라이브에 파일 저장

33

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

할일 목록

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

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

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

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

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

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

34

웹 앱 작성

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

35

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

웹 앱 작성

36

웹 앱 작성

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

37

할일 목록

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

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

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

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

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

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

38

푸시 발송

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

39

https://parse.com/products/push

푸시 발송 - 수신

• AndroidManifest.xml

40

푸시 발송 - 수신

• Application.java

41

푸시 발송 - 수신

• ParsePushBroadcastReceiver.java

42

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

43

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

푸시 발송 - 발송 요청

44

할일 목록

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

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

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

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

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

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

45

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

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

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

댓글 남기기 구현

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

47

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

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

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

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

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

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

48

제약사항 / 더 공부할 내용

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

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

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

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

49

참고자료

• 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

51

고맙습니다.

kingori@gmail.com https://plus.google.com/+SewonAnn

Recommended