Download as PDF, PPTX
Uploaded byKAI CHU CHUNG
COSCUP 2020 Google 技術 x 公共參與 x 開源 口罩地圖技術開源
The document outlines the organization and development of the Mask Map project involving various GDG (Google Developer Groups) members across Taiwan. It includes details on project management, technical selection, development timelines, and issues encountered, particularly with backend and mobile app components. Key principles emphasized are effective team management, technical simplification, and the importance of responsive communication.
![[Image Results] Java Build Tools: Part 2 - A Decision Maker's Guide Compariso...](https://cdn.slidesharecdn.com/ss_thumbnails/java-build-tools-part-2-maven-gradle-ant-ivy-140121040954-phpapp01-thumbnail.jpg?width=640&height=640&fit=bounds)
![Let Grunt do the work, focus on the fun! [Open Web Camp 2013]](https://cdn.slidesharecdn.com/ss_thumbnails/2013-gruntjs-openwebcamp-130715113721-phpapp02-thumbnail.jpg?width=640&height=640&fit=bounds)
COSCUP 2020 Google 技術 x 公共參與 x 開源 口罩地圖技術開源
- 1. Mask map KAI CHUCHUNG GDE Cloud GDG Cloud Taipei co-organizers @CageChung https://kaichu.io Howard Wu GDG Tainan Organizers https://www.facebook.com/chanwei.wu 房志剛 GDG Kaohsiung Organizer https://github.com/abc873693 Kevin Yang GDE Angular / MVP GDG Taichung Organizer Angular Taiwan ex-oranizer https://blog.kevinyang.net Ahdaa Yeh GDG Taipei Organizer https://mosil.space Kevin Chiu GDG Taipei co-Organizer https://github.com/kevin6449
- 2. Mask map PM HowardWu GDG Tainan Organizers https://www.facebook.com/chanwei.wu
- 3. ● Background ● Howto manage Experts’ team Agenda
- 4. ● 午餐的機緣 ● 社群夥伴的(被)推坑 ●Team members ○ PM - Howard ○ Web Frontend - Kevin Yang ○ Backend - Cage ○ APP - Ahdaa, 志剛 ○ AoG - Wolke, Kevin Chiu Background 臨時組建的 side project
- 5. ● 提出方針，說明做事情的意義，而非實作細節 ● 勿妄自菲薄，勇於做決定 ●對內溝通不是問題，對外做好窗口角色 ● 除了他們的專業外，其他都是我的事 ● 扛載壓力，盡可能爭取時間、資源 ● 既然擁有技術能力，就適當的擔任替補 How to manage Experts’ team 最好的管理就是不管理(誤)
- 6. Mask map Frontend KevinYang GDE Angular / MVP GDG Taichung Organizer Angular Taiwan ex-oranizer https://blog.kevinyang.net
- 7. ● Tech Selection ●Trips and Tips Agenda
- 8.
- 9. ● Angular v9 ●Angular Material ● Angular Google Maps Component ● AngularFire Tech Select
- 10.
- 11. ● 透過 RxJS的幫助可以將畫面互動與呼叫 API 撈取資料的動作，做有系統的整合 Tips #1 善用 RxJS
- 13. ● 雖然可以將所有的藥局標是在畫面上，但過多的訊息除了會讓使用者混淆外，也會讓網 頁的顯示效能降低 ● 減少畫面重新繪製的工作，資料前後的差異比較，只處理有異動的部分(map marker) Tips #2 減少顯示在畫面上的物件
- 14. ● 過往很多很好用的應用程式到後期都壞掉都是因為加上過多的功能 ● Keepit simple, 以解決問題為優先考量，而非製造問題 Tips #3 功能需求，要採減法而非加法
- 15. 房志剛 GDG Kaohsiung Organizer https://github.com/abc873693 Maskmap Mobile Ahdaa Yeh GDG Taipei Organizer https://mosil.space
- 16. ● 技術選擇 ● 開發時程 ●遇到的問題 Agenda
- 17.
- 18. ● 初版 2/5 ●改善UI 2/12 ● 最新消息 2/21 ● 回報機制 2/25 ● 修BUG 2/29 開發時程
- 19. ● 功能 ■ GoogleMaps plugin ■ mask api ■ Firebase ■ UI ● Android 上架 ● iOS審查中 初版
- 20. ● 過濾器 ● BottomSheet ●Firebase ● UI 改善UI
- 21. ● Firebase RemoteConfig ● 提供政府的最新消息 最新消息
- 22. ● mask feedbackapi ● UI 回報機制
- 23. ● iOS無法上架 ● GoogleMaps plugin 遇到的問題
- 24.
- 25. ● Flutter 官方維護的plugin ● Develper preview ● 手勢偵測無效 ● 特定情況下Marker會消失 Google Maps plugin
- 26. Mask AoG Kevin Chiu GDGTaipei co-Organizer https://github.com/kevin6449
- 27. ● 技術選擇 ● 開發時程 ●遇到的問題 Agenda
- 28.
- 29. ● 初版 2月7日週五上午00:00開始開發 ● 送審 2月7日 週五 上午2:06 ● 上架 2月7日 週五 上午6:10 開發時程
- 30. ● Goolge Assistant需要地理位置 (DiaglogFlow) ● iOS Goolge Assistant 需要地理位置 遇到的問題
- 31. KAI CHU CHUNG GDECloud GDG Cloud Taipei co-organizers @CageChung https://kaichu.io Mask map backend
- 32. ● Backend Story ●Insights ● Infrastructure ● Trips and Tips Agenda
- 33.
- 34. Backend Story Join maskbackend project 2/5 4PM Mask backend project kick off 2/5 10PM First version backend API and website launch 2/6 6AM 33 versions delivery 3/5
- 35.
- 36.
- 37.
- 38.
- 39.
- 40.
- 41.
- 42. Infrastructure Pharmacies Backend App Engine Autoscaling CloudSQL psql Cloud Storage Feedback Backend App Engine Autoscaling Website Backend App Engine Autoscaling Data broker Compute Engine Cloud Load Balancing gsutil cp hook Swagger docs App Engine Mobile Devices Push Notifications wget Cloud Build Release trigger deploy Stackdriver Kiang Cloud Build
- 43. Infrastructure Pharmacies Backend App Engine Autoscaling CloudSQL psql Cloud Storage Feedback Backend App Engine Autoscaling Website Backend App Engine Autoscaling Data broker Compute Engine Cloud Load Balancing gsutil cp Swagger docs App Engine Mobile Devices Push Notifications wget Cloud Build Release trigger deploy Stackdriver Kiang Cloud Build
- 44. dispatch: - url: "*/favicon.ico" module:default - url: "*/api/pharmacies*" module: pharmacy - url: "*/docs*" module: docs - url: "*/api/feedback*" module: feedback - url: "*/googleae8f4bcce8bec00c.html" module: ownership - url: "mask-9999.appspot.com/" module: default Mask map backend Services
- 45. # sync by30 seconds * 0-15,22-23 * * * ( sleep 1; /root/project/data-broker/run.sh >> /tmp/run.log) * 0-15,22-23 * * * ( sleep 31; /root/project/data-broker/run.sh >> /tmp/run.log) #!/bin/bash TARGET_BUCKET=gs://mask-9999-pharmacies ... RAW_URL=https://raw.githubusercontent.com/kiang/pharmacies/master/json/points.json ... echo Job start `date` echo Pull from github wget "$RAW_URL?ts=`date +%s`" -O $DATA_PATH echo =========================== echo Sync data to GCS... gsutil cp -r $DATA_PATH $TARGET_BUCKET/points.json # call hook echo =========================== echo Call GAE hook... curl -X POST https://mask-9999.appspot.com/api/pharmacies/sync_handler Data broker Cron Job
- 46. ├── cmd │ ├──docs │ ├── feedback │ ├── ownership │ └── pharmacy ├── internal │ ├── app │ │ ├── docs │ │ ├── feedback │ │ └── pharmacy │ └── pkg │ ├── errors │ ├── level │ ├── postgres │ ├── responses │ └── util ├── website ├── Makefile ├── cloudbuild.mask-web.yaml ├── dispatch.yaml ... Mask backend project layout go-kit ├── internal │ ├── app │ │ └── pharmacy │ │ ├── endpoints │ │ │ ├── endpoints.go │ │ │ ├── middleware.go │ │ │ ├── requests.go │ │ │ └── responses.go │ │ ├── model │ │ │ └── pharmacy.go │ │ ├── postgres │ │ │ └── pharmacy.go │ │ ├── service │ │ │ ├── logging.go │ │ │ ├── service.go │ │ │ └── version.go │ │ └── transports │ │ └── http.go ...
- 47. steps: - name: 'gcr.io/cloud-builders/gcloud' entrypoint:'bash' args: - '-c' - | curl -d '{"branchName":"mask-web-release"}' -X POST -H "Content-type: application/json" -H "Authorization: Bearer $(gcloud config config-helper --format='value(credential.access_token)')" https://cloudbuild.googleapis.com/v1/projects/mask-9999/triggers/a54e5cb6-e7f4-4e83-a125-1be3d032a 2fb:run Mask-web cloudbuild.yaml
- 48.
- 49. SELECT *, point($1,$2) <@> point(longitude, latitude)::point as distance FROM (select * from %s where longitude >= $3 and longitude <= $4 and latitude >= $5 and latitude <= $6) as a ORDER BY distance limit $7; CREATE EXTENSION if not exists cube; CREATE EXTENSION if not exists earthdistance;
- 50. gcloud sql exportcsv $CLOUDSQL_INSTANCE $TARGET_BUCKET/feedbacks/`date --date="-1 day" +%Y_%m%d`.csv --database=ma sk --query='select o.name, f.description, f.user_id, f.pharmacy_id, f.created_at from feedback_'`date --date="-1 da y" +%Y_%m%d`' as f inner join options as o on f.option_id = o.id;'
- 51. Frontend https://github.com/gdg-twhk/mask-web Backend https://github.com/gdg-twhk/mask-gae MobileApp https://github.com/gdg-twhk/mask-app MaskAoG https://github.com/gdg-twhk/mask-aog Q & A
- 52. Thank You! KAI CHUCHUNG GDE Cloud GDG Cloud Taipei co-organizers @CageChung https://kaichu.io Howard Wu GDG Tainan Organizers https://www.facebook.com/chanwei.wu 房志剛 GDG Kaohsiung Organizer https://github.com/abc873693 Kevin Yang GDE Angular / MVP GDG Taichung Organizer Angular Taiwan ex-oranizer https://blog.kevinyang.net Ahdaa Yeh GDG Taipei Organizer https://mosil.space Kevin Chiu GDG Taipei co-Organizer https://github.com/kevin6449