110 上學期 計畫
Jump to Section
| 計畫名稱 | Vanilla JavaScript 練習 |
|---|---|
| 相關學科/領域 | 科技領域 |
| 對應大學學群 | 資訊學群 |
| 內容說明 | 學習主題是 Vanilla JavaScript 的練習，跟著網路上的 30 Day Vanilla JS Challenge (https://s.sk5s.cyou/js30 ) 做練習，它是由加拿大的全端工程師Wes Bos建立的一系列課程，主旨在不使用任何外部框架與函式庫來完成30個純JavaScript的練習，本次預計做前8個。 |
| 預期成果 | 8個 30 Day Vanilla JS Challenge 中的專案網站，及製作紀錄。 |
| 週次 | 自學內容 | 學習心得 |
|---|---|---|
| 2 | - 班上學習計劃填寫 | 計畫修正，於第一週計畫將開始時，先進行計畫可行性評估，修改計畫至可以執行。 |
| 3 | 01 - JavaScript Drum Kit | 這周完成了第一堂課、第二堂課和第三堂課。 【作品連結網址】 https://self-study.sk5s.cyou/vanilla-js/day-01/ |
| 4 | 02 - JS and CSS Clock | 今日完成了第四堂課，因為第四堂課的內容多出了一些新的東西，所以用了較多的時間。 【作品連結網址】 https://self-study.sk5s.cyou/vanilla-js/day-02/ |
| 5 | 03 - CSS Variables | 今日完成第五堂課。 【作品連結網址】 https://self-study.sk5s.cyou/vanilla-js/day-03/ |
| 6 | 01~03改進及緩衝、心得撰寫 | 前三個練習作業是鼓組、指針時鐘、Javascript 操縱 css 變數，雖然比較簡單，但都是很重要的 Javascript 功能運用。這些看似簡單的內容其實也出現不少問題，不過主要是 CSS 問題。 |
| 8 | 04 - Array Cardio Day 1、07 - Array Cardio Day 2 | 今日完成第七堂課和第八堂課。 【作品連結網址】 https://self-study.sk5s.cyou/vanilla-js/day-04/ |
| 10 | 05 - Flex Panel Gallery | 今日完成第六堂課。 【作品連結網址】 https://self-study.sk5s.cyou/vanilla-js/day-05/ |
| 11 | 06 - Type Ahead | Svelte練習，雖然和這次的主題好像沒什麼關係，不過也能練習Javascript。 【作品連結網址】 https://self-study.sk5s.cyou/vanilla-js/day-06/ |
| 13 | 彈性調整、心得撰寫 | 雖然按照原來的課程，第四課和第七課的練習在觀看成果時是使用者需要手動打開瀏覽器 console 的設計，但是為了能更簡易的關看輸出內容，後來花了一些時間找到了可以直接把輸出內容顯示在畫面的方法。 【作品連結網址】 https://self-study.sk5s.cyou/vanilla-js/day-07/ |
| 14 | 08 - Fun with HTML5 Canvas | 製作所有練習的主頁選單，插入介紹影片。 【作品連結網址】 https://self-study.sk5s.cyou/vanilla-js/day-08/ |
| 15 | 04~08改進及緩衝、心得撰寫 | 為了能讓使用者可以快速的在不同的課次練習間切換，所以本週製作一個統一的導覽列。 |
| 17 | 圖文處理、心得撰寫 | 製作介紹用圖文。 |
| 20 | - 期末考週 | 簡述填寫，因為下星期為學校期末考，所以暫停一週，就只執行心得填寫。 |