隨著臺灣雙薪家庭數量逐年攀升的趨勢，許多家庭因為父母雙方平日工作繁忙，選擇將他們學齡前的小孩交付給保母托育，保母與家長間的溝通重要性可見一斑。保母除了需要遵照衛福部相關規定紀錄小孩的日常狀況，仍須製作小孩成長歷程，在傳統使用紙本聯絡本的方式下，除了要照顧小孩，還需要耗費額外時間動手填寫，勞心勞力，保母家長雙方的溝通效率也很差。因此本論文透過設計線上托育聯絡本 — BabeWithYou來解決上述的溝通效率問題、減輕保母日常作業負擔。我們以按鈕式的表單設計便利快速填寫常用內容、每日排程推播通知來提醒保母填寫聯絡本或提醒家長查看聯絡本、加入托藥單表單增進小孩托育期間的用藥安全、提供小孩日常生活圖片、影片上傳並整合聯絡本匯出成 PDF 供家長收藏，除了降低保母負擔，更提升家長對小孩托育相關資訊的能見度。為了支援這些功能，我們在 AWS平台上搭配相關技術的輔助下建立可靠的後端系統，確保使用者資料可以永續留存，同時為了維持系統穩定，將請求根據所需的系統計算資源分成同步與非同步的處理方式。為了確保BabeWithYou 可以長久服務家長與保母，我們分析了以往的使用狀況後採納了對應的幾項成本節省策略，並成功降低接近60% 的每月費用。BabeWithYou 至今已累積有將近 5000 名的使用者，當中包含了 2200 名每月活躍使用者及 1000 的每日活躍使用者，也獲的許多使用者的正向回饋，並期待可以往更廣的服務範圍如小學、補習班推廣。在手機應用介面上還能再更近一步提升保母填寫效率、根據填寫內容設計更直覺的操作方式，我們會再收集並分析更多使用者的回饋來改善。

As the number of double-paying families in Taiwan climbs year by year, many families deliver their preschool children to nannies for childcare because both parents are busy working on weekdays. The importance of communication between childcare and parents is thus obvious. In addition to observing the daily conditions of children in accordance with the relevant regulations of the Ministry of Health and Welfare in Taiwan, nannies are as well required to make a child's growth history. In the traditional method of using a paper contact book, in addition to taking care of the children, it also takes extra time to fill in. The communication efficiency between the two parties is as a result degraded. Therefore, this thesis solves the aforementioned communication efficiency problems and reduces the daily work load of nannies by designing a cloud-based childcare contact book, BabeWithYou. We use a button-based form design to facilitate the quick filling of commonly used content, daily scheduled push notifications to remind nannies of filling out the contact book or remind parents of viewing the contact book, add a medicine list form to improve the safety of medication during child care, and provide daily life pictures and videos upload and integrated contact book export to PDF for parents to collect. Furthermore reduce the burden of nannies and improve parents' visibility of child care related information. In order to support these functions, we have established a reliable back-end system with the assistance of related technologies on AWS to ensure that user data can be durable and persisted. At the same time, in order to maintain system stability, requests are divided into synchronous and a synchronous according to the required system computing resources. In order to ensure that BabeWithYou can serve parents and nannies for a long time, we analyzed the past usage and employed several corresponding cost-saving strategies, and successfully reduced monthly costs by nearly 60%. BabeWithYou has accumulated nearly 5,000 users so far, including 2200 monthly active users and 1,000 daily active users approximately. It has also received positive feedback from many users and looks forward to a wider range of services such as elementary school and cram school. On the mobile phone application interface, we can further improve the fill-in efficiency of nannies and design a more intuitive operation method based on the content. We will collect and analyze more user feedback to improve it.

目錄
第一章　緒論	1
1.1 緣由	1
1.2 App 功能介紹	1
1.2.1資料雲端化	2
1.2.2快速填寫	3
1.2.3資訊掌握	4
1.2.4成長日記	5
1.2.5專屬月曆	6
1.2.6發展檢核表	7
1.3 居服中心管理後台	8
第二章　系統概觀	9
2.1系統架構	9
2.2 前端架構	10
2.3 後端架構	11
第三章　Tech Stack	13
3.1 React Native	13
3.2 NodeJS	14
3.3 NGINX	15
3.4 PHP	15
3.5 Docker	17
3.6 MySQL	18
3.7 Amazon EC2	18
3.8 Amazon S3	19
3.9 Amazon CloudFront	20
3.10 Amazon Athena	20
3.11 AWS Lambda	21
第四章　系統模組	22
4.1 畫面導覽模組	22
4.2 權限模組	23
4.3 下載模組	24
4.4 聯絡本模組	25
4.5 聯絡本匯出模組	27
4.6 圖影檔案處理模組	29
4.7 排程模組	30
第五章　服務成本節省策略	31
5.1 AWS Lambda 取代 AWS Elastic Transcoder	31
5.2設置 Amazon S3 物件儲存規則	33
5.3建立快取伺服器	34
第六章　結論及未來展望	37
6.1推廣現狀	37
6.2未來展望	39
參考文獻	40

圖目錄
圖 1小孩資訊編輯畫面	2
圖 2小孩資訊共享畫面	2
圖 3聯絡本內容畫面	2
圖 4聯絡本紀錄項目選單	3
圖 5聯絡本紀錄飲食狀況	3
圖 6聯絡本紀錄活動狀況	3
圖 7填寫給家長的話	4
圖 8填寫拖藥單畫面	4
圖 9接收推播通知	4
圖 10成長日記內容	5
圖 11專屬月曆	6
圖 12預防針施打內容	6
圖 13聯絡本紀錄報表	6
圖 14檢核表選單	7
圖 15檢核表表單內容	7
圖 16居服中心管理後台	8
圖 17系統架構	9
圖 18前端 App 架構	10
圖 19前端App元件關聯	11
圖 20後端架構	11
圖 21 React Native 程式架構	13
圖 22容器與虛擬機架構 [5]	17
圖 23 Amazon CloudFront 全球節點分布 [10]	20
圖 24 Amazon Athena 操作介面	21
圖 25 Tab bar 示意圖	22
圖 26教學畫面	22
圖 27變更密碼畫面	22
圖 28請求推播權限畫面	23
圖 29請求相簿存取權限畫面	23
圖 30下載進度畫面	24
圖 31聯絡本資料關聯	25
圖 32聯絡本資料處理流程	26
圖 33聯絡本匯出檔案封面	27
圖 34聯絡本匯出文字內容	27
圖 35聯絡本匯出圖片內容	27
圖 36聯絡本匯出流程 sequence diagram	28
圖 37圖影檔案處理流程 sequence diagram	29
圖 38 Lambda 與 Elastic Transcoder 比較圖	31
圖 39西元2019全年上傳影片數量長條圖	32
圖 40西元2019年第四季 Elastic Transcoder 花費長條圖	32
圖 41 Amazon S3 儲存階層及規則示意	33
圖 42 CloudFront 物件存取統計	34
圖 43建立快取伺服器後圖影檔存取方式差異	35
圖 44西元2019年8月至2020年1月之CloudFront 每月成本長條圖	36
圖 45 CloudFront頭貼、成長日記圖片、影片存取統計	36
圖 46 Google Analytics 之活躍使用者比例	37
圖 47西元2019年11月底至12月中每月、每週、每日活躍使用者折線圖	37
圖 48向台北市社會局介紹 BabeWithYou	38
圖 49參加居服中心教育課程	38
圖 50社群上的使用者回饋	38

[1] 	F. Inc., "React Native Intro," 26 February 2020. [Online]. Available: https://reactnative.dev/.
[2] 	©. O. Foundation, "About Node.js," OpenJS Foundation, 26 February 2020. [Online]. Available: https://nodejs.org/en/about/.
[3] 	N. Inc., "NGINX Wiki," NGINX Inc., 26 February 2020. [Online]. Available: https://www.nginx.com/resources/wiki/.
[4] 	T. Sol, "PHP 5.6 vs PHP 7 Performance Comparison," 27 August 2019. [Online]. Available: https://gbksoft.com/blog/php-5-vs-php-7-performance-comparison/.
[5] 	D. Inc., "What is a Container?," 26 February 2020. [Online]. Available: https://www.docker.com/resources/what-container.
[6] 	O. C. a. i. affiliates, "Why MySQL?," Oracle Corporation, 26 February 2020. [Online]. Available: https://www.mysql.com/why-mysql/.
[7] 	I. Amazon Web Services, "Amazon EC2," Amazon Web Services, Inc., 26 February 2020. [Online]. Available: https://aws.amazon.com/ec2/.
[8] 	I. Amazon Web Services, "Amazon EC2 Instance Types," Amazon Web Services, Inc., 26 February 2020. [Online]. Available: https://aws.amazon.com/ec2/instance-types/.
[9] 	I. Amazon Web Services, "Amazon S3," Amazon Web Services, Inc., 26 February 2020. [Online]. Available: https://aws.amazon.com/s3/.
[10] 	I. Amazon Web Services, "Amazon CloudFront," Amazon Web Services, Inc., 26 February 2020. [Online]. Available: https://aws.amazon.com/cloudfront/.
[11] 	I. Amazon Web Services, "Amazon Athena," Amazon Web Services, Inc., 26 February 2020. [Online]. Available: https://aws.amazon.com/athena/.
[12] 	I. Amazon Web Services, "AWS Lambda," Amazon Web Services, Inc., 26 February 2020. [Online]. Available: https://aws.amazon.com/lambda/.