0%

做出一個網頁版的番茄鐘

總體的步驟

  • 先寫出想做什麼
    • 想有什麼功能
      • 最好詳細形容一下 比較好做
    • 畫面大概長怎樣
      • 可以找出頁面的範本
      • 或是畫示意圖
  • HTML CSS 先做出畫面
  • JS 寫功能
    • 可以將功能 分成1.0 以及 2.0版本
    • 先做出1.0 最簡單的頁面
    • 再慢慢進階到2.0
  • JS 遇到不會寫的功能 先記下來
    • 查不會的部分
      1. 將查到資料的寫在筆記
      2. 寫一個簡單的頁面作為實驗
      3. 將成果記錄到notion
      4. 整合到項目裡面
  • 其他Tips
    • 想到新的點子就先寫下來 之後再安排時間實踐
    • 每天反思今天的工作流程
    • 每天總結今天自己做出的事情
    • 每天將作品push 到Git hub上面 當作紀錄
    • 注意休息 一定要有時間放空 可以讓腦袋自己去整理思緒

想寫出的功能

  • 計時功能

    • 點擊開始計時 就要開始這個鬧鐘
    • 鬧鐘結束之後要自動進入下一個鬧鐘
    • 結束工作鬧鐘之後 要累計時間
      • 設定local storage存到裡面
    • 暫停的按鈕 跟功能
    • 可設定循環次數 自動撥放循環幾次
  • 輸入

    • 抓到輸入的數字 變成計時時間
      • 設定的數字不能小於0
    • 設定結束提醒 將文字轉成語音 播放出來
  • 版面

    • 顯示倒數計時
    • 設定默認工作時間
    • 可以設定靜音模式
    • 設定開始聲音
    • 設定計時聲音
    • 工作時間紅色 / 休息時間綠色
  • 累積工作時間