Skip to content

Commit 0710601

Browse files
guahsuguahsu
committed
update readme.md
1 parent e0a6643 commit 0710601

File tree

1 file changed

+36
-61
lines changed

1 file changed

+36
-61
lines changed

‎readme.md‎

Lines changed: 36 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
## JavaScript30
22
是一個來自加拿大的工程師WES BOS製作的一系列純javascript練習，
33
共有30個主題，每個主題有一個教學影片及範例檔案。
4-
>[[WES BOS的GitHub]](https://github.com/wesbos/JavaScript30)
5-
[[JavaScript30官網]](https://javascript30.com/)
4+
>[WES BOS的GitHub] | [筆記](https://github.com/wesbos/JavaScript30)
5+
[JavaScript30官網] | [筆記](https://javascript30.com/)
66

77
## 目的
88
實作範例，並紀錄每個練習的過程。
@@ -18,63 +18,38 @@
1818
並在每個練習加上index-GuaHsu.html來放置我所完成的版本。
1919

2020
## 其他
21-
我會放在自己的[部落格(https://guahsu.io)](https://guahsu.io)一份，並在GitHub上也留存一份。
22-
若有任何錯誤或指教請在PR給我，謝謝:)!
23-
24-
## 題目
25-
[01 - JavaScript Drum Kit 心得](https://github.com/guahsu/JavaScript30/tree/master/01_Java-Script-Drum-Kit)
26-
| [[DEMO]](https://guahsu.io/JavaScript30/01_Java-Script-Drum-Kit/index-GuaHsu.html)
27-
[02 - JS and CSS Clock 心得](https://github.com/guahsu/JavaScript30/tree/master/02_JS-and-CSS-Clock)
28-
| [[DEMO]](https://guahsu.io/JavaScript30/02_JS-and-CSS-Clock/index-GuaHsu.html)
29-
[03 - CSS Variables 心得](https://github.com/guahsu/JavaScript30/tree/master/03_CSS-Variables)
30-
| [[DEMO]](https://guahsu.io/JavaScript30/03_CSS-Variables/index-GuaHsu.html)
31-
[04 - Array Cardio Day 1 心得](https://github.com/guahsu/JavaScript30/tree/master/04_Array-Cardio-Day-1)
32-
| [[DEMO]](https://guahsu.io/JavaScript30/04_Array-Cardio-Day-1/index-GuaHsu.html)
33-
[05 - Flex Panel Gallery 心得](https://github.com/guahsu/JavaScript30/tree/master/05_Flex-Panel-Gallery)
34-
| [[DEMO]](https://guahsu.io/JavaScript30//05_Flex-Panel-Gallery/index-GuaHsu.html)
35-
[06 - Type Ahead 心得](https://github.com/guahsu/JavaScript30/tree/master/06_Type-Ahead)
36-
| [[DEMO]](https://guahsu.io/JavaScript30/06_Type-Ahead/index-GuaHsu.html)
37-
[07 - Array Cardio Day 2 心得](https://github.com/guahsu/JavaScript30/tree/master/07_Array-Cardio-Day-2)
38-
| [[DEMO]](https://guahsu.io/JavaScript30/07_Array-Cardio-Day-2/index-GuaHsu.html)
39-
[08 - Fun with HTML5 Canvas 心得](https://github.com/guahsu/JavaScript30/tree/master/08_Fun-with-HTML5-Canvas)
40-
| [[DEMO]](https://guahsu.io/JavaScript30/08_Fun-with-HTML5-Canvas/index-GuaHsu.html)
41-
[09 - Dev Tools Domination 心得](https://github.com/guahsu/JavaScript30/tree/master/09_Dev-Tools-Domination)
42-
| [[DEMO]](https://guahsu.io/JavaScript30/09_Dev-Tools-Domination/index-GuaHsu.html)
43-
[10 - Hold Shift and Check Checkboxes 心得](https://github.com/guahsu/JavaScript30/tree/master/10_Hold-Shift-and-Check-Checkboxes)
44-
| [[DEMO]](https://guahsu.io/JavaScript30/10_Hold-Shift-and-Check-Checkboxes/index-GuaHsu.html)
45-
[11 - Custom Video Player 心得](https://github.com/guahsu/JavaScript30/tree/master/11_Custom-Video-Player)
46-
| [[DEMO]](https://guahsu.io/JavaScript30/11_Custom-Video-Player/index-GuaHsu.html)
47-
[12 - Key Sequence Detection 心得](https://github.com/guahsu/JavaScript30/tree/master/12_Key-Sequence-Detection)
48-
| [[DEMO]](https://guahsu.io/JavaScript30/12_Key-Sequence-Detection/index-GuaHsu.html)
49-
[13 - Slide in on Scroll 心得](https://github.com/guahsu/JavaScript30/tree/master/13_Slide-in-on-Scroll)
50-
| [[DEMO]](https://guahsu.io/JavaScript30/13_Slide-in-on-Scroll/index-GuaHsu.html)
51-
[14 - JavaScript References VS Copying](https://github.com/guahsu/JavaScript30/tree/master/14_JavaScript-References-VS-Copying)
52-
| [[DEMO]](https://guahsu.io/JavaScript30/14_JavaScript-References-VS-Copying/index-GuaHsu.html)
53-
[15 - LocalStorage](https://github.com/guahsu/JavaScript30/blob/master/15_LocalStorage/)
54-
| [[DEMO]](https://guahsu.io/JavaScript30/15_LocalStorage/index-GuaHsu.html)
55-
[16 - Mouse Move Shadow](https://github.com/guahsu/JavaScript30/tree/master/16_Mouse-Move-Shadow)
56-
| [[DEMO]](https://guahsu.io/JavaScript30/16_Mouse-Move-Shadow/index-GuaHsu.html)
57-
[17 - Sort Without Articles](https://github.com/guahsu/JavaScript30/tree/master/17_Sort-Without-Articles)
58-
| [[DEMO]](https://guahsu.io/JavaScript30/17_Sort-Without-Articles/index-GuaHsu.html)
59-
[18 - Adding Up Times with Reduce](https://github.com/guahsu/JavaScript30/tree/master/18_Adding-Up-Times-with-Reduce)
60-
| [[DEMO]](https://guahsu.io/JavaScript30/18_Adding-Up-Times-with-Reduce/index-GuaHsu.html)
61-
[19 - Webcam Fun](https://github.com/guahsu/JavaScript30/tree/master/19_Webcam-Fun)
62-
| [[DEMO]](https://guahsu.io/JavaScript30/19_Webcam-Fun/index-GuaHsu.html)
63-
[20 - Speech Detection](https://github.com/guahsu/JavaScript30/tree/master/20_Speech-Detection)
64-
| [[DEMO]](https://guahsu.io/JavaScript30/20_Speech-Detection/index-GuaHsu.html)
65-
[21 - Geolocation](https://github.com/guahsu/JavaScript30/tree/master/21_Geolocation)
66-
| [[DEMO]](https://guahsu.io/JavaScript30/21_Geolocation/index-GuaHsu.html)
67-
[22 - Follow Along Link Highlighter](https://github.com/guahsu/JavaScript30/tree/master/22_Follow-Along-Link-Highlighter)
68-
| [[DEMO]](https://guahsu.io/JavaScript30/22_Follow-Along-Link-Highlighter/index-GuaHsu.html)
69-
[23 - Speech Synthesis](https://github.com/guahsu/JavaScript30/tree/master/23_Speech-Synthesis)
70-
| [[DEMO]](https://guahsu.io/JavaScript30/23_Speech-Synthesis/index-GuaHsu.html)
71-
[24 - Sticky Nav](https://github.com/guahsu/JavaScript30/tree/master/24_Sticky-Nav)
72-
| [[DEMO]](https://guahsu.io/JavaScript30/24_Sticky-Nav/index-GuaHsu.html)
73-
[25 - Event Capture, Propagation, Bubbling and Once](https://github.com/guahsu/JavaScript30/tree/master/25_Event-Capture-Propagation-Bubbling-and-Once)
74-
| [[DEMO]](https://guahsu.io/JavaScript30/25_Event-Capture-Propagation-Bubbling-and-Once/index-GuaHsu.html)
75-
26 - Stripe Follow Along Nav
76-
27 - Click and Drag
77-
28 - Video Speed Controller
78-
29 - Countdown Timer
79-
30 - Whack A Mole
21+
我會放在自己的[部落格(https://guahsu.io) | [筆記](https://guahsu.io)一份，並在GitHub上也留存一份。
22+
若有任何錯誤或指教請在告知，謝謝:)!
8023

24+
| No | 主題 | 筆記 | DEMO |
25+
| --- | --- | --- | --- |
26+
| 01 | JavaScript Drum Kit | [筆記](https://guahsu.io/2017/05/JavaScript30-01-Java-Script-Drum-Kit/) | [DEMO](https://guahsu.io/JavaScript30/01_Java-Script-Drum-Kit/index-GuaHsu.html) |
27+
| 02 | JS and CSS Clock | [筆記](https://guahsu.io/2017/05/JavaScript30-02-JS-and-CSS-Clock/) | [DEMO](https://guahsu.io/JavaScript30/02_JS-and-CSS-Clock/index-GuaHsu.html) |
28+
| 03 | CSS Variables | [筆記](https://guahsu.io/2017/05/JavaScript30-03-CSS-Variables/) | [DEMO](https://guahsu.io/JavaScript30/03_CSS-Variables/index-GuaHsu.html) |
29+
| 04 | Array Cardio Day 1 | [筆記](https://guahsu.io/2017/05/JavaScript30-04-Array-Cardio-Day-1/) | [DEMO](https://guahsu.io/JavaScript30/04_Array-Cardio-Day-1/index-GuaHsu.html) |
30+
| 05 | Flex Panel Gallery | [筆記](https://guahsu.io/2017/05/JavaScript30-05-Flex-Panel-Gallery/) | [DEMO](https://guahsu.io/JavaScript30//05_Flex-Panel-Gallery/index-GuaHsu.html) |
31+
| 06 | Type Ahead | [筆記](https://guahsu.io/2017/05/JavaScript30-06-Type-Ahead/) | [DEMO](https://guahsu.io/JavaScript30/06_Type-Ahead/index-GuaHsu.html) |
32+
| 07 | Array Cardio Day 2 | [筆記](https://guahsu.io/2017/05/JavaScript30-07-Array-Cardio-Day-2/) | [DEMO](https://guahsu.io/JavaScript30/07_Array-Cardio-Day-2/index-GuaHsu.html) |
33+
| 08 | Fun with HTML5 Canvas | [筆記](https://guahsu.io/2017/06/JavaScript30-08-Fun-with-HTML5-Canvas/) | [DEMO](https://guahsu.io/JavaScript30/08_Fun-with-HTML5-Canvas/index-GuaHsu.html) |
34+
| 09 | Dev Tools Domination | [筆記](https://guahsu.io/2017/06/JavaScript30-09-Dev-Tools-Domination/) | [DEMO](https://guahsu.io/JavaScript30/09_Dev-Tools-Domination/index-GuaHsu.html) |
35+
| 10 | Hold Shift and Check Checkboxes | [筆記](https://guahsu.io/2017/07/JavaScript30-10-Hold-Shift-and-Check-Checkboxes/) | [DEMO](https://guahsu.io/JavaScript30/10_Hold-Shift-and-Check-Checkboxes/index-GuaHsu.html) |
36+
| 11 | Custom Video Player | [筆記](https://guahsu.io/2017/07/JavaScript30-11-Custom-Video-Player/) | [DEMO](https://guahsu.io/JavaScript30/11_Custom-Video-Player/index-GuaHsu.html) |
37+
| 12 | Key Sequence Detection | [筆記](https://guahsu.io/2017/07/JavaScript30-12-Key-Sequence-Detection/) | [DEMO](https://guahsu.io/JavaScript30/12_Key-Sequence-Detection/index-GuaHsu.html) |
38+
| 13 | Slide in on Scroll | [筆記](https://guahsu.io/2017/08/JavaScript30-13-Slide-in-on-Scroll/) | [DEMO](https://guahsu.io/JavaScript30/13_Slide-in-on-Scroll/index-GuaHsu.html) |
39+
| 14 | JavaScript References VS Copying | [筆記](https://guahsu.io/2017/08/JavaScript30-14-JavaScript-References-VS-Copying/) | [DEMO](https://guahsu.io/JavaScript30/14_JavaScript-References-VS-Copying/index-GuaHsu.html) |
40+
| 15 | LocalStorage | [筆記](https://guahsu.io/2017/09/JavaScript30-15-LocalStorage/) | [DEMO](https://guahsu.io/JavaScript30/15_LocalStorage/index-GuaHsu.html) |
41+
| 16 | Mouse Move Shadow | [筆記](https://guahsu.io/2017/10/JavaScript30-16-Mouse-Move-Shadow/) | [DEMO](https://guahsu.io/JavaScript30/16_Mouse-Move-Shadow/index-GuaHsu.html) |
42+
| 17 | Sort Without Articles | [筆記](https://guahsu.io/2017/10/JavaScript30-17-Sort-Without-Articles/) | [DEMO](https://guahsu.io/JavaScript30/17_Sort-Without-Articles/index-GuaHsu.html) |
43+
| 18 | Adding Up Times with Reduce | [筆記](https://guahsu.io/2017/10/JavaScript30-18-Adding-Up-Times-with-Reduce/) | [DEMO](https://guahsu.io/JavaScript30/18_Adding-Up-Times-with-Reduce/index-GuaHsu.html) |
44+
| 19 | Webcam Fun | [筆記](https://guahsu.io/2017/10/JavaScript30-19-Webcam-Fun/) | [DEMO](https://guahsu.io/JavaScript30/19_Webcam-Fun/index-GuaHsu.html) |
45+
| 20 | Speech Detection | [筆記](https://guahsu.io/2017/10/JavaScript30-20-Speech-Detection/) | [DEMO](https://guahsu.io/JavaScript30/20_Speech-Detection/index-GuaHsu.html) |
46+
| 21 | Geolocation | [筆記](https://guahsu.io/2017/10/JavaScript30-21-Geolocation/) | [DEMO](https://guahsu.io/JavaScript30/21_Geolocation/index-GuaHsu.html) |
47+
| 22 | Follow Along Link Highlighter | [筆記](https://guahsu.io/2017/10/JavaScript30-22-Follow-Along-Link-Highlighter/) | [DEMO](https://guahsu.io/JavaScript30/22_Follow-Along-Link-Highlighter/index-GuaHsu.html) |
48+
| 23 | Speech Synthesis | [筆記](https://guahsu.io/2017/10/JavaScript30-23-Speech-Synthesis/) | [DEMO](https://guahsu.io/JavaScript30/23_Speech-Synthesis/index-GuaHsu.html) |
49+
| 24 | Sticky Nav | [筆記](https://guahsu.io/2017/10/JavaScript30-24-Sticky-Nav/) | [DEMO](https://guahsu.io/JavaScript30/24_Sticky-Nav/index-GuaHsu.html) |
50+
| 25 | Event Capture, Propagation, Bubbling and Once | [筆記](https://guahsu.io/2017/10/JavaScript30-25-Event-Capture-Propagation-Bubbling-and-Once/) | [DEMO](https://guahsu.io/JavaScript30/25_Event-Capture-Propagation-Bubbling-and-Once/index-GuaHsu.html) |
51+
| 26 | Stripe Follow Along Nav | [筆記](https://guahsu.io/2017/10/JavaScript30-26-Stripe-Follow-Along-Nav/) | [DEMO](http://guahsu.io/JavaScript30/26_Stripe-Follow-Along-Nav/index-GuaHsu.html) |
52+
| 27 | Click and Drag | [筆記](https://guahsu.io/2017/10/JavaScript30-27-Click-and-Drag/) | [DEMO](http://guahsu.io/JavaScript30/27_Click-and-Drag/index-GuaHsu.html) |
53+
| 28 | Video Speed Controller | [筆記](https://guahsu.io/2017/10/JavaScript30-28-Video-Speed-Controller/) | [DEMO](http://guahsu.io/JavaScript30/28_Video-Speed-Controller/index-GuaHsu.html) |
54+
| 29 | Countdown Timer | 筆記 | DEMO |
55+
| 30 | Whack A Mole | 筆記 | DEMO |

0 commit comments

Comments
 (0)