The Complete JavaScript Course 2023

此頁以下內容為該課程的Project集

課程連結
  • 純粹標明出處,並非替該課程做商業宣傳
  • Project的HTML及CSS皆為課程提供
  • 版權歸於該課程的導師 Jonas Schmedtmann

Guess My Number

JavaScript對DOM Event的基礎使用練習

玩法:

  1. 在左下的猜數字欄輸入數字( 1 ~ 20 ),按下check後交由程式檢視
  2. 若沒猜對,玩家可依畫面右方的文字提示繼續猜想答案,直到猜中或分數歸零為止
  3. 分數計算:總分(score) = 20 - (玩家猜錯的次數)
網站連結前往觀賞
guess-number photo
pig-game photo

Pig Game

JavaScript對DOM Event的使用練習

  • 新增玩法說明(How To Play)
網站連結前往觀賞

Bankist App

JavaScript Array、Date、Math的使用練習

使用方法:

  • 可使用體驗帳戶:
    1. 帳戶名:js(PIN:1111)
    2. 帳戶名:jd(PIN:2222)
  • 登入後可使用轉帳給他人、貸款、刪除自己的帳戶等功能
  • 右下角有計時器,若2分鐘內無任何操作,將會自動被登出帳戶
網站連結前往觀賞
bankist-app photo
bankist-website photo

Bankist Website

JavaScript對DOM Event的進階使用練習

網站連結前往觀賞

Mapty App

JavaScript OOP, Leaflet library的使用練習

使用方法:

  • 需先開啟裝置定位才能使用
  • 點按地圖上位置後,可在左側的欄內建立新的運動紀錄(跑步、騎腳踏車)
  • 建立完的紀錄會在地圖上留下標記,並記錄於localStorage裡
網站連結前往觀賞
mapty-app photo