趣玩 Kyiplay
  • 親子飯店
  • 親子景點
  • 親子餐廳
  • 育兒好物
  • 育兒經驗
  • 生活

Archives

  • 2025 年 9 月
  • 2025 年 8 月
  • 2025 年 6 月
  • 2025 年 5 月
  • 2025 年 3 月
  • 2023 年 4 月
  • 2023 年 3 月
  • 2023 年 2 月
  • 2022 年 12 月
  • 2022 年 11 月
  • 2021 年 1 月
  • 2020 年 12 月
  • 2020 年 11 月
  • 2020 年 10 月
  • 2020 年 9 月
  • 2020 年 8 月
  • 2020 年 5 月
  • 2020 年 4 月
  • 2020 年 3 月
  • 2020 年 2 月
  • 2020 年 1 月
  • 2019 年 10 月
  • 2019 年 9 月

Categories

  • 懶人包
  • 生活
  • 研究
  • 程式
  • 育兒好物
  • 育兒經驗
  • 行銷
  • 親子景點
  • 親子海外行
  • 親子餐廳
  • 隨筆
趣玩 Kyiplay
趣玩 Kyiplay
  • 親子飯店
  • 親子景點
  • 親子餐廳
  • 育兒好物
  • 育兒經驗
  • 生活

W3-切版實作、期末考驗收|Alpha Camp 學期一 心得


這是我記錄自學程式,Alpha Camp 學期一的W3。

回顧:

  • Alpha Camp 學期一 心得,W1-入門磚
  • Alpha Camp 學期一 心得,W2-初遇程式挫折

上週的課程提到基礎HTML/CSS以及DevTools,為理解寫網頁前端打下基礎。而這週的課程重點有兩個:

  • 以「履歷切版」專案實際走過一遍切版流程
  • 課程結束後,有個學期一的期末考,作為學習驗收

履歷切版

在開始說明履歷切版前,不得不說Alpha Camp的課程設計真的很新手友善。

在HTML/CSS開始的課程前,準備了一個讓學員們心態轉換的章節。避免學員掉入「求甚解」的追究坑裡,一不小心就花太多時間。

因為接下來的課程HTML/CSS較偏重先實作出東西,先了解有某個語法,可以後面透過多練習再深入理解,避免當下陷進去。與先前JavaScript的較偏重邏輯思考有著較大的差異。

以世界觀解釋JavaScript與HTML/CSS的差異

我很喜歡課程中用世界觀的比喻來解釋:

  • JavaScript:
    在課程中,造物主把難度分為簡單/中等/困難,我們一開始都只會碰到簡單的關卡,碰到及所需的資訊量都不會太多,可以完整解完關卡。並隨著等級提高所需資訊量才會逐步提高。
  • HTML/CSS:
    一開始就是個完整的開放世界,新手可以隨意亂跑、自由探索,一不小心就會跑去高等區,所以新手時期先在能力範圍裡打怪就好。有些語法即使不知其所以然,但不管先拿來用,等升級之後,能力提升了(隨著更多的練習),自然就會看懂了。

學習切版

學習切版的章節設計,按部就班的說明了:

  • 本次專案「履歷頁面」所需觀念
    • HTML/CSS,結構及語法詳細說明
    • 如何引用外部資源
  • 綜合練習
  • 更深入的CSS觀念


本次專案「履歷頁面」所需觀念

對本次專案裡HTML/CSS的從結構、語法、功能及需要引用的外部資源,條理的以影片+圖文的方式,學員可以自己自由選擇學習的方式:只看影片、只看圖文或者兩者互相搭配。課程細節就不破梗,有興趣的朋友,可以參考Alpha Camp學期一。

另外特別想提,儘管前面有轉換心態的章節提醒:「先了解有這個語法,可以後面透過多練習再深入理解。」

但個性使然,我一開始還是在單一章節花太多時間想搞清楚每個步驟。於是我調整的由一部影片先從頭看完後再回想如何實作,改成:「將影片拆成幾個段落,每完成一個段落,趁記憶還在時跟著做,最後再透過教材文字複習」,否則學習時間拉太長,挫折感增加,陷入太多語法想搞清楚的陷阱裡。

綜合練習

前面老師講完課,綜合練習就是給學員的實作驗收。

並且還在實作的章節,偷偷塞了一個遇到問題時候的小錦囊:

  1. 先確認問題,聚焦還是發散
    1. 聚焦問題: 已遇到實際問題,有想法要達成什麼目標(想讓文字置中),Google 關鍵字尋找解法
    2. 發散問題: 暫時沒有新的想法,需要尋求靈感,Website Template 觀摩他人作品
  2. 共同解法:使用DevTools,查看或測試程式碼是不是自己要的功能。

課程的練習作品:履歷頁面

更深入的CSS觀念

針對課程中約略提到的排版概念:inline、block以及flex再次深入講解。

覺得這樣的設計也很棒,若在課程中提太多,主題(做出履歷)容易失焦。因此放到綜合練習做出成品後,再用來補充說明。

flex也是在近年(2015)開始讓網頁前端爆炸性成長的一項功能。

我的簡易筆記如下:
因為flex的排版方式多了:flex-direction、flex-wrap、justify-content、align-items……,讓計算前端的尺寸時不再是一道數學題。否則以往排版都只能inline、block或inline-block,非常花時間。

學期一期末考:技術重點複習

期末考上面的預計課程時間是四小時,本來是想預想可以利用昨天一天的下午時間完成作答,期末考總共分成三題:

  1. 切版,切出一個導覽列
  2. 邏輯題:驗證三角形
  3. 進階邏輯題:驗證等腰三角形

前兩題,切版用了半個小時完成、驗證三角形則花了我一個小時。心想就算是進階,還有兩個半小時,應該也夠我解吧?沒想到…事情完全不如預期。

題目是這樣的:「列出3邊之和20以內的所有等腰三角形(不包含正三角形)」,並已有提示需要使用雙重迴圈來解題。

於是我開始拆解解題的方式,並列出、排除了可能的方法,但最後一直卡在不曉得如何下雙重迴圈的條件,就是這個卡…我從下午一路卡,卡到晚上吃完晚餐還在卡。卡到懷疑自己的智商…,我的心理歷程是這樣的:

  1. 先不要Google好了,又是期末考跟邏輯題,想先靠自己解出
  2. 不行了,真的沒辦法,我需要求救,來Google看看要怎麼辦…
  3. Google不到答案,找不到類似的問題…(這時又更加對人生感到懷疑…)
a-ha moment !
a-ha moment !
  1. 答案往往發生在想不到的地方,將一開始被我排除的方式拿去Youtube上搜尋,終於找到相近的說明,最後再花了約半個小時才終於把解法寫出…

從這個經歷再次了解:解決問題時,下對關鍵字的重要性…
雖然過程前半段很痛苦,但最後開始寫出解法的部分,擊敗大魔王的感覺,真的很痛快!


Total
0
Shares
0
0
0
0
0
Related Topics
  • alpha camp
  • 學程式
Yi

Previous Article

離職心得-正式登出三年四個月的第一份廣告代理商工作

觀看文章
Next Article

程式新手入門的第一堂課|Alpha Camp 學期一 心得

觀看文章
You May Also Like
觀看文章
  • 程式

用逐周ORID紀錄學習變化|Alpha Camp 學期 2-3 心得

  • Yi
  • 2020-12-23
觀看文章
  • 程式

認識 JavaScript 的物件導向|Alpha Camp 學期 2-2 心得

  • Yi
  • 2020-12-05
觀看文章
  • 懶人包
  • 程式

歷時九個月,我在學程式的路上|Alpha Camp 全學期心得

  • Yi
  • 2020-11-29
觀看文章
  • 程式

用ORID回顧自己的進步|Alpha Camp 學期 2-2期末驗收

  • Yi
  • 2020-11-25
觀看文章
  • 程式

event loop 是什麼?|Alpha Camp 學期 2-2期末驗收

  • Yi
  • 2020-11-25
觀看文章
  • 程式

認識API, HTTP, Ajax|Alpha Camp 學期 2-2心得

  • Yi
  • 2020-11-08
觀看文章
  • 程式

羅馬數字轉換 Integer to Roman|Alpha Camp 學期2-1期末驗收

  • Yi
  • 2020-10-29
觀看文章
  • 程式

打造一個會動的網頁|Alpha Camp 學期 2-1 心得

  • Yi
  • 2020-10-21

發佈留言 取消回覆

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

追蹤趣玩 Kyiplay,不漏掉親子旅遊資訊
追蹤趣玩
Facebook 0
Instagram 0

Recent Posts

  • 親子遊紐西蘭自駕心得|租車公司推薦、保險選擇與爆胎自救經驗
  • 紐西蘭親子自由行|帶2歲半小孩玩南北島17天心得|行前準備、景點行程、花費、租車自駕一篇看懂
  • 台南東區托嬰中心推薦|蓓森兩年就讀心得:令人安心的托育選擇
  • 台南一日遊親子行程|樹谷科學館、樹谷農場、玏食早午餐、有時候杏仁豆腐冰
  • 完整防災避難指南|戰備物資、通訊、撤離準備清單
Featured Posts
  • 親子遊紐西蘭自駕心得|租車公司推薦、保險選擇與爆胎自救經驗 1
    親子遊紐西蘭自駕心得|租車公司推薦、保險選擇與爆胎自救經驗
  • 紐西蘭冬季親子自由行|帶2歲半小孩玩南北島17天經驗分享|行程花費、自駕心得、親子景點、行前準備一次看懂 2
    紐西蘭親子自由行|帶2歲半小孩玩南北島17天心得|行前準備、景點行程、花費、租車自駕一篇看懂
  • 台南東區托嬰中心推薦-蓓森托嬰中心 3
    台南東區托嬰中心推薦|蓓森兩年就讀心得:令人安心的托育選擇
  • 台南一日遊親子行程|樹谷科學館、樹谷農場、玏食早午餐、有時候杏仁豆腐冰 4
    台南一日遊親子行程|樹谷科學館、樹谷農場、玏食早午餐、有時候杏仁豆腐冰
  • 完整防災避難指南|戰備物資、通訊、撤離準備清單 5
    完整防災避難指南|戰備物資、通訊、撤離準備清單
Categories
  • 懶人包 (4)
  • 生活 (30)
  • 研究 (21)
  • 程式 (13)
  • 育兒好物 (8)
  • 育兒經驗 (7)
  • 行銷 (6)
  • 親子景點 (1)
  • 親子海外行 (2)
  • 親子餐廳 (1)
  • 隨筆 (2)
趣玩 Kyiplay
  • 親子飯店
  • 親子景點
  • 親子餐廳
  • 育兒好物
  • 育兒經驗
  • 生活
COPYRIGHT © 趣玩 Kyiplay All rights reserved|Powered by Heart 2 Thriving

Input your search keywords and press Enter.