iT邦幫忙

鐵人檔案

2018 iT 邦幫忙鐵人賽
回列表
Modern Web

JavaScript 30實作心得筆記 系列

JavaScript 30 是國外著名的JS開發者Wes Bos提供的免費30天課程,課程不只有JS的使用,更包括Html,Css的相互運用。希望透過Js30的實作讓我更加理解JS的運作,並寫點心得與筆記跟大家一起探討Js的世界。

鐵人鍊成 | 共 30 篇文章 | 44 人訂閱 訂閱系列文 RSS系列文 團隊好想工作室第一屆鐵人賽
DAY 1

Day1 JS: Drum Kit

Day1 JS: Drum Kit Demo 第1天的實作是建立一個類似打鼓就產生音效的網頁,當點擊鍵盤時會讓網頁的element產生音效和動態的畫面效果。 首...

2017-12-20 ‧ 由 洪文明 分享
DAY 2

Day2 JS + CSS Clock

Day2 JS + CSS Clock Demo 在網頁畫面產生一個時鐘,能及時呈現目前的時間。 並且類似時鐘會有3個指針,每個指針會隨著時間的變化,有著相對應...

2017-12-21 ‧ 由 洪文明 分享
DAY 3

Day3 Playing with CSS Variables and JS

Day3 Playing with CSS Variables and JS Demo 在網頁產生三個控制元件<input type="rang...

2017-12-22 ‧ 由 洪文明 分享
DAY 4

Day4 Array Cardio Day 1

Day4 Array Cardio Day 1 ​ Demo 這一個章節主要是利用Javascript的Array物件中方法做資料處理,在第四天會有幾個語法的練...

2017-12-23 ‧ 由 洪文明 分享
DAY 5

Day5 Flex Panels Image Gallery

Day5 Flex Panels Image Gallery Demo 使用Css的flex來製作動態收縮展開的畫面。 在畫面會有五張圖<div>垂...

2017-12-24 ‧ 由 洪文明 分享
DAY 6

Day6 Ajax Type Ahead

Day6 Ajax Type Ahead Demo 第六天的實作是練習Javascript非同步執行。 首先利用fetch物件建立接收資料的接口,fetch物件...

2017-12-25 ‧ 由 洪文明 分享
DAY 7

Day7 Array Cardio Day 2

Day7 Array Cardio Day 2 Demo 這一個章節跟第四天一樣主要是利用Javascript的Array物件中方法做資料處理。 第一個語法是...

2017-12-26 ‧ 由 洪文明 分享
DAY 8

Day8 Fun with HTML5 Canvas

Day8 Fun with HTML5 Canvas Demo 第8天的實作是網頁做出類似畫布,滑鼠在上方拖移會有顏色的產生,顏色會隨著滑鼠移動而變化,大小也是...

2017-12-27 ‧ 由 洪文明 分享
DAY 9

Day9 14 Must Know Dev Tools Tricks

Day9 14 Must Know Dev Tools Tricks Demo 第九天主要學習的是console的運用。 何為console? 主要功能為:...

2017-12-28 ‧ 由 洪文明 分享
DAY 10

Day10 Hold Shift to Check Multiple Checkboxes

Day10 Hold Shift to Check Multiple Checkboxes Demo 第10天的實作目標是在列表中,當點選其中一個選項後,再按s...

2017-12-29 ‧ 由 洪文明 分享