# 03/28 教學股內驗

## pygame

- [x] ㄟ 這個肯定沒有練習過
一驗而已？或許才剛做完簡報
是啦，下次就要先練習

### 1. 開場

開場不透順暢，沒有做到吸引大家注意，分心的話開場的意義就不見了，不如不要開場

> 可以去 youtube 找參考
> [name=uier]

前面有提到目標但不是很流暢
**目標：給你一個盤面，找到下一步要下哪裡**

> 或許就直接給他一張簡報，把上面這行打上去
> [name=bogay]

- [x] schedule 可以把一二天標出來

### 2. 競賽規則

找一個沒聽過你講解的人說給他聽，找個同學、學長姐弟妹、外系的

> 還蠻長的，就我個人來說挺難聽進去的
> [name=bogay]

我剛剛好像看到競賽不是這節課的活動，那有需要現在講？
但競賽規則可能會影響決策？如果他們比較專業的話
會先需要知道規則的話，或許也可以這堂課結束再講，到正式競賽期間去想？

它好像快講完了？

- [x] > 左上角是活三
可以把他圈出來，或是用個什麼去標註他
> 補上動畫？
或是一個 pattern 一頁，用文字補上一些理由

比賽規則或許可以等到要實際寫 code 的時候來介紹，因為到那個時候才會需要考慮決策

### 建議從演算法的介紹下手

1. 偵測連續的棋子
3. 什麼會用到函式、陣列、迴圈
- 有哪些 pattern，直的、橫的
4. input/output 的講解給點範例

如果要講解程式碼，一定要拆解成 Block，不要超過 10 行左右

善用你的簡報，簡報是你的工具，簡報派不上用場再白板

code 看起來可以多加些註解？如果同學打算自己理解的話會比較容易

有講到一個好習慣是 LEFT=0（不要 magic number），或許之後可以說明為什麼這樣做

講解程式碼的時候，不要一直盯著螢幕比較好，可能會變得很像是自言自語
要寫白板的時候也一樣，要對著同學講話而不是跟自己講話

要多熟悉程式碼，幫自己做好小抄可以避免自己臨時想不起來要講啥

講解程式碼的時候我看不清楚變數名稱或是程式的架構（有螢幕投影的話或許會好點？
或是就給出連結

### 從已知到未知

- 他們學過迴圈？ 那如何從有迴圈的概念去控制陣列，進而檢查連續棋子
- 先在沒有程式碼的情況讓他們知道你要做什麼，再拿出程式碼
- 權重！！！！他們還不知道什麼是權重吧？

排好一個流程，有邏輯地讓他們從無到有
- 先講什麼
- 再講什麼
- 注意同學已有的知識包含哪些？避免突然講太多超出他們認知範圍的東西

所有範例都事先想好，然後做成簡報，
或許目前是準備時間還不夠，但希望之後記得補上

- [x] 注意畫面大小
code 字體可以調大？
~~換成 dark theme~~

## 版本控制與自動化 --- Git · GitHub

> 08:04 開始
> 08:27 結束

### 開場

- 動機？你們會得到什麼？
- 版本控制是什麼 QQ
- GitHub 是什麼 QQ
- 範例
- 字太多了，打幾個關鍵字或放點迷因效果就不錯了
- 他們或許對於文字編輯器沒啥概念，我不確定這會不會增加理解的成本
- 個人認為以遊戲存檔做為比喻或許不錯？
- 我覺的隨便舉例 windows 記事本之類的就好了
> 記事本可沒有辦法保存多個存檔
> 可以解釋說平常在保存資料可能要在那邊很白痴的複製貼上改檔名之類的？
> 那要他們有在玩需要存檔的遊戲，年代不同了
> steam 上面都要ㄅ= =
> 我大學才開始用 steam
> 手遊也要啊，單機的話，有嗎，傳說對決就沒有
- 共編 + 版控的話，用 Google Doc 來舉例也蠻好的
- 看圖說故事
- 程式耦合度那些好像有點太難（專有名詞出現的必要性？）
- 畫重點：一個 commit 就是一個狀態
- 未知的東西太多了
- repository
- remote
- commit
- 雜湊
- 唯一的編號
- branch
- pull request
- pull
- 這些定義是不是值得打下來？

<span style="font-size: 180px"> ＨＥＡＤ </span>

- # ＨＥＡＤ <- 要大寫吧？ 夠大嗎 哇幹大
- tag
- fork
- 感覺講義要附辭典 :rolling_on_the_floor_laughing:
- branch 那張圖感覺很適合做迷因欸
- tag 叫做 "the-ultimately-really-final-version" 之類的
- 對啊，這比較現實
- 如果有人看得懂 1.0.0-pre.1 是什麼，那他不需要這堂課
- 或許可以科普一下 semver 跟 git flow？課後閱讀
- 當然可以科普，就看有沒有時間ㄅ
- 不要放在課程內的話我覺得算適合
- 我認為缺乏軟體開發的概念的話，這整段應該都很難聽懂，但我不知道怎麼改善
- 拿故事比喻，再帶到專有名詞如何？
- 有要讓同學實作的部分嗎？不然聽完感覺就忘光光了
- 我覺得 CLI 比較有效率啊...
- 你說說看
- 我覺得
- 可以設定關卡讓他們挑戰，用有樹狀圖的軟體去看結果
- 就操作軟體的 Lab

~~- 原理好晚才講，比較檔案差異，這個應該在最前面講時光機的時候~~
我記得前面好像講過...嗎？

這堂課感覺比較像軟體工程課助教補充的內容
軟工真的應該來講講這個= =

### 不認識的名詞

- 耦合度
- CLI
- 靜態網頁，有點難啊
- GitHub Actions
- 自動化的好處，例如，簡單的講一下啦
- > 光 DevOps 就可以講一堂了= =
> [name=bogay]
- 這邊我有請他斟酌要不要講
- 我猜同學應該不會很在意 worker 的 distro
- 我也 TM 不在意
- 連結其他的東西
- youtube
- 分享到 Facebook

### 簡報

話說怎麼不是用 slidev 做簡報

有些顏色看不到
e.g. branch 那張的 master 我就看不到
他說是故意的

字少的話，可以放大一些

## HTML5

> 08:27 開始

### Intro.

> 08:34 結束

我不知道這邊是否要給同學一個目標比較好？
也可不要啦，我不知道有沒有要帶實作
tag 這種東西，感覺用到再查比較有效率

https://hackmd.io/@Adam7066/cyberbug2021-ppt#/1
^ 去年 markdown 的簡報

有 code 要搭配結果
> 對極了
>
> 雖然 HTML ~~應該~~不是語言？
> 是啊 是標記語言，不是程式語言，markdown, html, xml -> markup language

旁邊的文字感覺沒啥必要？

從簡單的地方開始？先講 body，最後有空再說 head
- 連 HTML 跟瀏覽器的關聯有講到嗎？
- 可以說平常瀏覽的FB/IG都是這駝垃圾組起來的

感覺還是透過舉例讓同學有個大致的瞭解比較好，不然我是高中生的話現在應該已經掉線了

雖然覺得不大可能，但需要解釋瀏覽器是啥嗎？搞不好有人不知道...？
> ㄜ

感覺不大需要在這邊解釋每種 tag 的用途
> 他既重要又不重要

從 attribute 講到 class，講到選擇器，好難
正常流程：你想要用 CSS 改一堆東西 -> 了解選擇器 -> 了解 class -> 知道可以透過加 attribute
class & id，需求是很多東西都一樣，所以都在這個 class，套用一樣的規則

話說如果 id 重複會怎樣？
select by id 的東西會有問題ㄅ，不確定會不會 compile error
我微弱的記憶是不會
那就是 semantic error

目標是啥，有需要知道這麼多？
它目標是要用到 Vue, 但要做出啥成品就 IDK 了
哇 你也有盤古之白，我親眼看到你在 IDK 兩側加空白
我看你們都加就加了

https://github.com/sparanoid/chinese-copywriting-guidelines
把這個傳給學弟們
~~放在新生手冊，沒看完不給進系館~~
我先下了 電腦沒電

你不用講解 Spec
或許把 W3School 丟給他們就好...嗎？

### Tags

> 08:39 結束

### CSS

> 08:48 結束

`element:event` <- event 這邊應該改偽元素比較對？

regex 之前有講過？
NO
:thinking_face:

### Other

建議編輯器 (IDE?) 用 VSCODE, 全部人都統一用 VSC 在上面裝套件就好

盡量嘗試讓課程內容跟同學的生活經驗產生連結，e.g. Word 的操作 & HTML

從問題出發，再教他們解決辦法

## JS

> 09:04 結束

我不行了

經過了 45 分鐘，我終於可以摸到鍵盤了

這個目標的仙貝知識過 <span style="font-size: 128px;">大</span>

我故意打錯的好嗎


所以我 python 學過一次的概念這邊還要再來一次？
或許流程控制可以快速帶過？

重點是目標

Promise？我覺得他們應該很長一段時間都不會碰到= =

What is promise? Java 的 future?
差不多吧，可以被 await 的咚咚

variable hoisting？我猜他們大學畢業了還不見得會知道= =
不是很重要

我覺得非同步的概念對高中生應該是難到靠北