This web contains all my JavaScript 30 practices built with the React framework, and these 30 challenges on Javascript is designed by Wes Bos.
You can see the course here : https://javascript30.com/
My JS30 website : https://elynnachuang.github.io/js30/
運行此專案前，最好先確定 Node.js 的版本為 18.16.0 或是更新
You're going to need : Node.js v18.16.0 or newer
-
開啟終端機，將此專案複製至本機電腦
Open your terminal and clone this project to your computer.
git clone https://github.com/ElynnaChuang/js30.git -
進入專案資料夾
Go into js30 folder
cd js30 -
安裝套件
Install all packages
npm install // or run 'npm i' -
啟動程式
Start this project
npm run start -
專案成功在 http://localhost:3000/js30 啟動
You can now see the web is running at http://localhost:3000/js30
-
結束程式
End the web
ctrl + c
- Day 1 - JavaScript Drum Kit
- Day 2 - CSS + JS Clock
- Day 3 - Playing with CSS Variables and JS
- Day 4 - Array Cardio Day 1
- Day 5 - Flex Panels Image Gallery
- Day 6 - Ajax Type Ahead
- Day 7 - Array Cardio Day 2
- Day 8 - Fun with HTML5 Canvas
- Day 9 - 14 Must Know Dev Tools Tricks
- Day 10 - Hold Shift to Check Multiple Checkboxes
- Day 11 - Custom HTML5 Video Player
- Day 12 - Key Sequence Detection (KONAMI CODE)
- Day 13 - Slide In on Scroll
- Day 14 - Object and Arrays - Reference VS Copy
- Day 15 - LocalStorage and Event Delegation
- Day 16 - CSS Text Shadow Mouse Move Effect
- Day 17 - Sorting Band Names without articles
- Day 18 - Tally String Times with Reduce
- Day 19 - Unreal Webcam Fun
- Day 20 - Native Speech Recognition
- Day 21 - Geolocation based Speedometer and Compass
- Day 22 - Follow Along Links
- Day 23 - Speech Synthesis
- Day 24 - Sticky Nav
- Day 25 - Event Capture, Propagation, Bubbling and Once
- Day 26 - Stripe Follow Along Dropdown
- Day 27 - Click and Drag to Scroll
- Day 28 - Video Speed Controller UI
- Day 29 - Countdown Clock
- Day 30 - Whack A Mole Game