Google 服務 / 生產力工具

# Google 服務 / 生產力工具  ## Lesson 1：記帳（所需天數：3 天） :::info 課程目標：以實際生活例子（記帳）教學生如何使用試算表、用 Google 表單再寫點程式碼（Google App Script）讓記帳更方便 ![image](https://hackmd.io/_uploads/r1Wu0-rPex.png) ::: :::success ### Day 1 ::: > ###### 以下用 Google 版 Excel 簡稱試算表 #### 為什麼要記帳 > ###### 先問小朋友有沒有零用錢或壓歲錢、都怎麼花 - 記帳不是大人專用、很困難的東西，是每個人都可以用的小超能力 - 記帳只是為了讓你看見零用錢去了哪裡，如果你有想存錢買的東西，記帳會讓你更知道該怎麼把錢省下來 - 不要把記帳想成限制自己這不能花那不能花，也不要因為記了帳之後就一直自責自己怎麼亂花錢 > ###### 介紹完之後，給小朋友看成品，告訴他們這堂課最後會教你們設計出像這樣的記帳本 *** #### 一個可以記帳的表需要有什麼東西 > ###### 這一部分提問小朋友，讓小朋友共同回答 - 要記錄這筆帳的日期 - 要記錄帳的類型 - 要記錄帳有多少錢 - 有個備註欄，某些帳可以寫一下這是花在什麼東西上 - 要能統計某個類型的支出，或某個時段（比如每個禮拜、每個月）的支出 *** #### 用 Google 版 Excel 做出一個帳表 (Part. 1) 1. 註冊 Gmail 1. 先登入 Google 然後新增一張表 2. 輸入每欄名稱 3. 帳的「類型」那邊需要下拉式選單，教他們怎麼弄 <img src="https://hackmd.io/_uploads/B1ni9lSDee.png" style="display: block; margin: auto; width: 22%;" /> :::success ### Day 2 ::: #### 用 Google 版 Excel 做出一個帳表 (Part. 2) 4. 教他們輸入公式，統計某個類型的支出 5. 教他們輸入公式，統計某個禮拜的支出 6. 製作圓餅圖、長條圖 *** #### 用 Google 表單 + Google App Script 讓你可以用填表單的方式記帳 (Part. 1) > ###### 這段話不是給小朋友看的：Google App Script 是一個可以讓你用程式自動使用 Google 服務的工具，包括試算表、文件、簡報、雲端硬碟、自動送出 email，程式的語法是 JavaScript > ###### 介紹最後弄出來的表單給小朋友看，告訴他們只要填表單就可以把你的帳自動輸入到 excel 1. 在原本的試算表新建表單 2. 教他們設計表單欄位 3. 讓他們試用，讓他們在 excel 內看得到表單送出的結果 :::success ### Day 3 ::: #### 用 Google 表單 + Google App Script 讓你可以用填表單的方式記帳 (Part. 2) 4. 寫一點 Google App Script - 當偵測到表單送出時，讀取日期、帳的類型、帳的金額、備註 - 確認這筆帳有沒有填錯，比如帳的金額是一個數字、不能是負數 - 把這筆帳寫到帳本 6. 設定觸發器，把表單跟原本設計好的帳本串接起來  ## Lesson 2：做筆記、寫文章（所需天數：2 天） :::info > ###### 這段話不是給小朋友看的：一個網站是由 html + css 渲染出來的，markdown 讓你能用一些簡單易懂、符合直覺的符號來讓你不需要寫 html + css 就能輕鬆排版出一篇好看的文章。 > ###### HackMD 是一個讓你儲存 markdown 文章的平台，有幾個特點： > ###### 1. 好上手 > ###### 2. 可以選擇把文章公開（Google 搜尋得到）或設為私人文章 > ###### 3. 使用書本模式，可以讓你把類似主題的文章統整在同一個介面，相當於你自己的部落格 > ###### 4. 上述功能完全免費 > ###### markdown 已經越來越廣泛了，幾乎大部分部落格平台、引擎都支援，現在就連 Windows 記事本也可以寫 markdown 課程目標：教小朋友 markdown 語法，並且教他們怎麼把文章設為公開。最後延伸會提到： - 一些建置部落格的引擎（Hexo、Astro、Hugo、Next.js），以及「創建一個部落格的學習路徑」，這些引擎讓你寫部落格文章可以用 markdown 寫，但建置比較複雜，可以讓有一定程式基礎的小朋友自行探索 - 目前很紅的筆記軟體 Obsidian、Notion，這些軟體的每篇筆記都是用 markdown 寫，不需要程式基礎。 ![image](https://hackmd.io/_uploads/ByHyGdUvxe.png) ::: :::success ### Day 1 ::: #### 為什麼要學 markdown markdown 是一個可以簡單排版文章的工具（標題、粗體、斜體、清單、圖片、連結）。 - 平常用 FB、IG、Threads 排版出來的文章都是純文字可能沒那麼漂亮，要排版的話得手動打符號（比如📍❶❷❸📌）、還要一直打空格喬文字的位置 - 用 word 排版非常麻煩 - 學會 HackMD 就像你有一個自己的「數位筆記本」或「部落格小天地」，而且你可以公開你的文章讓所有人都搜尋得到，你可以拿來寫： - 遊戲攻略 - 食記 - 旅遊攻略 - 學習筆記 --- #### 快速上手 HackMD - 註冊 HackMD - 設定 HackMD 頭像（這個教學寫在講義上，讓他們自己回家更改） - 新增一個筆記 --- #### HackMD 常用語法 (Part. 1) - 標題：`# 標題`, `## 小標題`, `### 小小標題` - 粗體斜體：`**粗體**`, `*斜體*` - 刪除線：`~~刪除字~~` - 清單：`1.`, `-`, 可以縮排 - 連結：[這是 Google](https://www.google.com) - 引用文字：`>` - 打勾框框：`- [ ]` - 有顏色的框框： ``` :::info 一段文字 ::: ``` :::info 一段文字 ::: :::success ### Day 2 ::: #### HackMD 常用語法 (Part. 2) - 表格： | Column 1 | Column 2 | Column 3 | | -------- | -------- | -------- | | Text | Text | Text | - 圖片： - `![替代文字](圖片網址)` - 可調整大小、置中的語法： ```html <div style="text-align:center;"> <img src="圖片網址" width="30%"/> </div> ``` <div style="text-align:center;"> <img src="https://hackmd.io/_uploads/SJ7f1PIPge.png" width="30%"/> </div> --- #### 管理文章 - 把文章加上標籤 - 將文章設為公開 - 使用書本模式 --- #### 後續延伸 > ###### 貼一些學習資源，讓有興趣的小朋友自行探索 - 顯示數學公式：LaTeX（例如 $x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}$） - 顯示程式語言： ```python= for i in range(10): print("Hello, world!") ``` - 一些建置部落格的引擎（Hexo、Astro、Hugo、Next.js），以及「創建一個部落格的學習路徑」 - 筆記軟體 Obsidian、Notion。