---
# System prepended metadata

title: JS v.s. 介面
tags: [學期一]

---

###### tags: `學期一`

# JS v.s. 介面

目標：Week 2 在 LH 上看到足夠熱鬧的討論，同時不會製造出對某個主題的偏好（不會建立 JS、介面 二選一的 bias）30+ 留言、

how?

- 設計容易參與、不涉及技術、沒有對錯的 engagement 項目
- 讓他們在 engage 的時候能有機會在 LH 上帶出他自己的經驗（know them as people）

➡️ 不能是二選一的 PK 問題
填空題？

三選一？

a. 目前我比較喜歡 JS，因為＿
b. 目前我比較喜歡介面打造，因為＿
c. 目前我對 JS 或是介面還沒有很明確的偏好，因為＿

學習（JS / 介面）讓（從事 xx 工作 / 過去是 xx 背景的我）想起（做什麼事情）的感覺


透過刻意強調本週同時學習了兩大主題（JS 和介面），邀請同學們思考、比較兩個主題的差別，分享出自己反思的成果，並
觀摩其他同學的反思與見解，作為後續學習的參考 / 考量？

week 2 engagement revise 目前有哪些點子？

- revise PK 賽 ➡️ 學完兩個主題後，分享你學習兩個主題中令你最有成就感的一份作業
- 自修室 / 讀書會
- debug 大賽
- Html/CSS/JavaScript 問答大賽（Kahoot）
- 在社群平台上跟大家面對面（互相認識）

LH engagement key elements

重點在 engagement
重點讓他們意識到 / 強調這週兩個主題的差異（先 raise awareness，下週接球跟他說要調整學習方法）

key success factors

容易參與（guided comment）
透過容易讓他們想到兩個主題差異的問題（但不用讓他們選邊站，有也不要太強烈）

- 你覺得哪個主題的操作對你來說比較直觀？比較跟你過去的經驗相似？why？
- 你比較可以接受哪個主題的卡關狀況？（一直撞牆，什麼東西都出不來 v.s. 有畫面，可是一直不知道怎麼把畫面調成想要的樣子）
- 你覺得兩個主題的學習有什麼差別？
- 分享你的筆記

CTA：分享一個在學習兩個主題時，你覺得學習上差別最大的點

如果看到其他人的分享也有共鳴，不要忘記幫其他人 upvote 喔！

outline

- highlight 本週有兩個主題
- 問他學起來有沒有什麼感覺？
- CTA

# 🔥 JS v.s. 介面 PK 賽🔥

看完前面學長們的分享，想必同學們也都可以感受到兩位學長都對介面學習很有一套 😎 話雖如此，許多同學們在本週同時經歷過程式邏輯（JS）以及介面（HTML/CSS）的洗禮後，應該還是這兩個主題有迥然不同的感受吧！

<div style="width:100%;"><img style="max-width:1000px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/15823/_____2021-06-04___8.25.13.png"></div>

#### JS v.s. 介面 PK 賽，正式開打！

我們都知道：未來要打造一個完整的 Web App 時，無論是 JS 還是介面技術都是不可或缺的能力

<!-- 不過，在看了這麼多單元、跟這麼多份作業纏鬥之後，教練想邀請你一起來分享： -->

不過，在本週難得一口氣體驗了程式邏輯（JS）以及介面（HTML/CSS）這兩個運作方式、學習方式都相去甚遠的主題後，教練想邀請你緩下腳步，花點時間思考：<b>你對哪個主題比較有感覺？</b>

- 你對哪個主題比較有感覺？
- 你比較喜歡哪個主題？
- 你覺得兩者學習上最大的差異是？

<!-- 你可以透過以下的問題引導你回想：

- JS 和介面有什麼不同
- JS 和介面共同給你的感受是？
- JS 和介面給你什麼不同的感受？
- 學習 JS 和學習介面的時候，你的學習方法有任何變化嗎？（看單元、寫作業、做筆記等等的方法都可以回想看看！） -->

以下是過去學長的分享範例：

<div style="width: 100%; background-color: #ccdaff; padding: 16px">

學習 JS 時語法還不是很多，但看到 HTML 和 CSS 一口氣多這麼多語法，實在很吃不消<br>
不過共同點是都卡關蠻久的⋯⋯然後 debug 也弄了很久⋯⋯<br>
後來覺得介面語法那麼多怎麼可能記起來，決定開始做介面筆記，就不用自己背了！<br>

</div>

#### 立即參賽！

<!-- ✏️ 鼓勵你仔細比較，具體分享出兩者的關鍵差異，對於未來在學習不同主題時也會有所幫助喔！ -->

✏️ 複製以下的模板，

1. 跟 JS 相比

👀 也不要忘記看看其他同學的分享，如果令你產生共鳴，不要忘記去 upvote 或留言喔！

----------
outline

- 擂台照片
- 分享內容的 template
- 1-2 則具體的分享內容

# 🔥 JS v.s. 介面 PK 賽🔥

<div style="width:100%;"><img style="max-width:1000px; width:100%;" src="https://assets-lighthouse.alphacamp.co/uploads/image/file/15083/broculos_fight.jpg"></div>
<br>

看完前面學長們的分享，想必同學們也都可以感受到兩位學長都對介面學習很有一套 😎 話雖如此，許多同學們在本週同時經歷過程式邏輯（JS）以及介面（HTML/CSS）的洗禮後，應該還是能明確感受到自己對哪個主題比較有熱情 🔥🔥🔥

####  JS v.s. 介面 PK 賽，正式開打！

你比較享受在 JavaScript 的學習，喜歡在苦思一番後感佩於自己聰明的腦袋；還是更享受在介面 HTML/CSS 的學習，喜歡隨寫隨看，著迷於親手打造頁面的成就感中呢？

在連續克服了 JS 的邏輯挑戰後，突然又踏入一個全新領域，從 0 開始學習介面（HTML/CSS）的時刻：你對於這兩個運作方式、學習方式都相去甚遠的主題，分別有什麼樣的看法，又<b>對哪個主題比較有感覺呢？</b>

#### 邀請你到一起來參與這場 JS v.s. 介面的世紀大對決！

在你心目中如果 JS 和 HTML/CSS PK，究竟誰會獲勝呢？

✏️ 請你複製以下的模板，一起參加這場盛會吧！

<!-- 1. 在我心目中⋯⋯ HTML/CSS （大贏 or 大輸）！
2. 學習 or 實作介面的時候有什麼感覺
3. 這個感覺，讓（你的學科背景）出身的我想起（以前上課或上班時的什麼經驗） -->

1. 目前學下來，我比較喜歡（JS/介面）部分的學習，因為＿
2. 對於我沒那麼喜歡的（介面/JS），我決定要透過＿來克服！

以下是過去學長的分享範例：

<div style="width: 100%; background-color: #ccdaff; padding: 8px">

<!-- 在我心目中⋯⋯ HTML/CSS 大輸！<br>
學習 HTML/CSS 時，讓我非常痛苦<br>
這個感覺，讓商科出身的我想起以前死背會計的回憶 😭<br>
 -->
 
目前學下來，我比較喜歡介面部分的學習，因為寫出來的程式立刻就可以看到結果，這種即時回饋感超讚！<br><br>
對於我沒那麼喜歡的 JS，我決定要透過頻繁觀摩 👀 來克服！<br><br>寫 JS 題目時都覺得好像數學題，只要一個觀念不同就整題都寫不出來，最後卡關我也都是透過觀摩解決😅～為了讓觀摩學習更有效，之後我想要把每次的觀摩寫成心得記下來，幫自己累積更多解題技巧！
 
 
</div>

PK 賽的結果將於下週公布🤩🤩🤩 期待見到你的分享！