iT邦幫忙

2025 iThome 鐵人賽

DAY 1
1
Vue.js

每天一點 Vue.js,30 天做出一個雅思學習應用系列 第 1

專案介紹:Vue.js + 雅思學習目標

  • 分享至 

  • xImage
  •  

大家好!這是我參加鐵人賽的第一天文章 🎉。
這次我選擇的主題是 「Vue.js + 雅思學習目標」,為什麼會把前端框架和英文考試放在一起呢?
原因很簡單:一方面我想藉由實作來強化 Vue3 的使用經驗,另一方面也希望能透過程式的力量,設計一套能幫助自己備考雅思的練習工具。

我打算用 Vue.js 建立一個小型的「雅思學習平台」。這個平台會包含幾個模組:

  1. 單字發音:利用 Web Speech API 來做 TTS(Text-to-Speech),讓我可以快速聽單字發音。
  2. 聽力練習:支援音檔播放與題目答題區,模擬雅思聽力的場景。
  3. 口說模組:結合錄音與即時轉文字(STT),讓我能練習口說並檢查發音準確度。
  4. 寫作練習:Task 1 與 Task 2 的輸入區,內建字數統計器,未來甚至想嘗試加上文法錯誤提示。

透過這樣的專案,我不僅能每天寫一點 Vue.js 的程式碼,也能同時為雅思考試做準備。鐵人賽的30天,我會逐步分享從設計到實作的過程,包含元件拆解、API 使用、UI 設計思路,甚至是我在備考中遇到的心得。

希望最後能完成一個「可以真正拿來練習」的學習工具,也期待這段旅程能帶給正在學習 Vue.js 或準備雅思的你一些啟發!


系列文
每天一點 Vue.js,30 天做出一個雅思學習應用1
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言