iT邦幫忙

2025 iThome 鐵人賽

DAY 15
0

不知不覺,我的鐵人賽挑戰已經來到第 15 天,等於整整完成了一半。回顧這段時間,其實每天都在跟程式碼、Bug、CSS 排版苦戰,但同時也一步步把腦中的構想變成實際的網頁,感覺非常充實。


我學到了什麼?

  1. HTML 與 CSS 的基礎應用
    從一開始的首頁卡片,到後來的專輯頁面,我慢慢熟悉了 HTML 的結構化設計,也學會怎麼用 CSS 控制排版、配色、hover 效果。雖然還不算專業,但至少能做出一個完整的頁面。

  2. JavaScript 的邏輯思維
    一開始看到 album.js 那些程式碼時,覺得「邏輯」這兩個字好抽象。但隨著實作,我開始理解程式的流程:

    • 先定義好資料結構(專輯物件)
    • 再讀取網址參數
    • 然後把資料動態渲染到網頁上
      這種「步驟分解」的想法,讓我更能理解程式是如何運作的。
  3. 錯誤與 Debug 的過程
    這半個月,我遇到不少小插曲:

    • 滑動效果做不出來
    • 專輯只出現一半,無法完整呈現

接下來的目標

雖然已經完成一半,但後面還有 15 天,我希望能繼續做到:

  • 新增更多的區塊,比如說「單曲」、「合作歌曲」
  • 新增歌詞頁面
  • 嘗試新增更多互動功能(例如隨機播放)

總結

半個月下來,我學到的不只是程式技術,還有「每天進步一點點」的力量。雖然過程中難免卡關、抱怨,但看到成果慢慢長出來,真的會很有成就感。
接下來 15 天,我會繼續努力,讓這個專案更完整,也希望能在最後一天交出一個令自己滿意的作品。


上一篇
製作歌曲頁面
系列文
打造專屬於歌手的音樂資訊網頁:從零開始的前端實作與技術分享15
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言