iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
Vue.js

從0開始學習30天可以到什麼程度? 系列

雖然是因為課程原因選擇參賽,但也希望可以藉由這次的機會挑戰自己可不可以真的做到連續30天都自主學習並發佈紀錄,以及30天連續的自主學習到底可以讓自己對一項新的工具熟悉與應用到什麼程度。雖然之前沒有接觸過vue.js但有課程製作網頁前端的基礎,希望能成功在最後完成一個實作項目。

參賽天數 15 天 | 共 30 篇文章 | 1 人訂閱 訂閱系列文 RSS系列文
DAY 1

D1: 前言與基本概念

前言 作為這項30天挑戰的開始,我想先說明我為什麼會選擇學習Vue.js。我選擇學習這項技術,主要基於上學期學長姐的實習分享會,他們多次將這項工具放在它們在實習...

2023-09-16 ‧ 由 michellel 分享
DAY 2

D2: Vue.js在VSCode上的基本建置

今天要進行的是Vue.js在VSCode上的建置,並測試網頁是否能正常運作。 步驟 1:下載和安裝VSCode 前往VSCode的官方網站:https://c...

2023-09-17 ‧ 由 michellel 分享
DAY 3

D3: Vue.js的數據綁定與常見指令

數據綁定 在昨天的程式裡面有寫道的這一段 <div id="app"> {{ message }} </div>...

2023-09-18 ‧ 由 michellel 分享
DAY 4

D4: Vue.js的常見指令(後半)

昨天我已經了解兩個Vue.js中常用的指令今天將學習剩下的指令並嘗試它們的功能。 常見指令 'v-for': 它通常用於迭代數據,例如: 遍歷數組或指定對象中...

2023-09-19 ‧ 由 michellel 分享
DAY 5

D5: 嘗試製作簡單網頁(1)

我今天想要用前幾天學到的一些常用指令來建立一個小網站,因為目前還在學習使用功能階段所以並不會特別排版或關注網頁的美觀。 試做網頁 我想要做的是一個可以讓用戶表達...

2023-09-20 ‧ 由 michellel 分享
DAY 6

D6: 嘗試製作簡單網頁(2)

昨天繞了一大圈完成了個小進展,今天要繼續豐富我的網頁。昨天運用了'v-model'與'v-if'的組合來控制用戶的input與''有序排列的輸出,讓輸出按照用戶...

2023-09-21 ‧ 由 michellel 分享
DAY 7

D7: 重新整理再出發

前六天的學習我都選擇使用chatGPT建議我的學習內容,如果我有看不懂的地方再在網路上尋找相關資料。或者我自己寫一些程式遇到問題我再向chatGPT詢問解決方法...

2023-09-22 ‧ 由 michellel 分享
DAY 8

D8: Vue.js2 -> Vue.js3

今天我會先將我之前寫得Vue.js2程式碼改為Vue.js3,然後邊學習它們不同的地方。 第一個不一樣的肯定是引入的資源庫,要從Vue2改為Vue3。 &l...

2023-09-23 ‧ 由 michellel 分享
DAY 9

D9: data共用

在昨天的最後有提到可以使用"data"的屬性來對狀態進行操作,先來看一下實作的案例: const count1 = Vue.createAp...

2023-09-24 ‧ 由 michellel 分享
DAY 10

D10: template & methods

template模板 關於Vue.js的模板,我之前都是直接使用html模板在裡定義好,而在Vue.js裡我們也可以選擇將template的屬性在Options...

2023-09-25 ‧ 由 michellel 分享