iT邦幫忙

vue.js相關文章
共有 1414 則文章
鐵人賽 影片教學 DAY 3
Nuxt 3 快速入門 系列 第 3

技術 [影片教學] Nuxt 3 + ESLint + Prettier 環境建置

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗,👇下方是本篇教學的相關筆記。 設置 ESLint 環境 安裝 ESLint 套件 npm...

鐵人賽 Vue.js DAY 3
Nuxt 3 實戰筆記 系列 第 3

技術 [Day 03] Nuxt 3 解放 Nuxt 開發者體驗 - Nuxt DevTools 視覺化工具系列

前言 Nuxt 是一個強大且完整的框架,但也因此框架的複雜程度可能導致學習與除錯成本的提升,當我們在開發上遇到錯誤或需要調整驗證的地方,可能就需要在龐大的專案內...

鐵人賽 Modern Web DAY 12

技術 【Day 12】傳遞state給子層用props,但props不只用來傳遞state

在了解state怎麼定義、怎麼操作後,還有一個很重要的部分,就是state在元件中傳遞的方式。這個部分也就是大家普遍都很熟悉的props,不只在Vue中是使用p...

鐵人賽 Vue.js DAY 3

技術 DAY 3 - 踏上 Vue.js 的世界,為什麼選擇 Vue.js ?

DAY 3 - 踏上 Vue.js 的世界,為什麼選擇 Vue.js ? 你不可不知使用 Vue.js 理由 那為什麼會選擇 Vue.js 呢 ? 你不可...

鐵人賽 Vue.js DAY 4

技術 V04_在Vue之前_必備的JS基礎(1)_模組 module 的操作

V04_在Vue之前_必備的JS基礎(1)_模組module的操作 今天來好好探索一下,在vue的框架中,常見的JS的語法及概念前面這幾篇的學習,算是在打好基礎...

鐵人賽 Vue.js DAY 2
Vue3歡樂套件箱耶 系列 第 2

技術 開箱2:最愛跟你拖拖拉拉了~vue.draggable範例應用

本篇開箱的是vue.draggable.next,是一款簡單上手vue3的拖曳插件也就是vue.draggable升級版本。 ▲ 官方典型範例示意圖 介紹...

鐵人賽 影片教學 DAY 2
Nuxt 3 快速入門 系列 第 2

技術 [影片教學] Nuxt 3 - nuxi (Nuxt CLI) 指令介紹

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗,👇下方是本篇教學的相關筆記。 前置作業 為了確保 Nuxt CLI 不存在快取或版本上的差...

鐵人賽 Vue.js DAY 2
Nuxt 3 實戰筆記 系列 第 2

技術 [Day 02] Nuxt 3 使用 nuxi 快速建立模板檔案

前言 在 Nuxt 3 開發過程中,在建立頁面、元件甚至是 Server API,我們會需要為建立檔案來完成實作,如果你還不熟悉檔案在專案放置位置,或是需要模板...

鐵人賽 Vue.js DAY 2

技術 DAY 2 - 飛越時代前端大進化 ,三大框架差異 ?

DAY 2 - 飛越時代前端大進化 ,三大框架差異 ? 大家都知道前端有三大框架,Vue、Recat、Angular,那為什麼要選擇 Vue 呢?為甚麼我們...

鐵人賽 Vue.js DAY 3

技術 V03_直接在網頁上使用Vue

V03_直接在網頁上使用Vue 今天要來探索直接在網頁上使用Vue的方法首先同樣參考Vue官網上 Quick Start 上的說明https://vuejs.o...

鐵人賽 Modern Web DAY 11

技術 【Day 11】Vue的雙向綁定v-model!React也辦得到嗎?

v-model是vue框架裡面很常見的一種雙向綁定的用法,主要會實作在input、textarea、select等的這些表單標籤上,目的是為了實現資料的雙向同步...

鐵人賽 影片教學 DAY 1

技術 Day01-建立ChatGPT帳號

今年其實很猶豫要不要參賽,想把去年的安裝教學做完,還是報名了。壓線最後一刻 ~~~(有可能不會完成30天的影片發文:P)(但會把Vue Cli和Node.js...

鐵人賽 Vue.js DAY 2

技術 V02_最小規模的Vue的開發流程

V02_最小規模的Vue的開發流程 建立vue專案 今天要來實際利用vite套件來建立vue專案延續參考vue官網上Quick Start的說明https://...

鐵人賽 影片教學 DAY 1
Nuxt 3 快速入門 系列 第 1

技術 [影片教學] Nuxt 3 - 使用 nuxi 建立第一個專案

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗,👇下方是本篇教學的相關筆記。 環境準備 Node.js - 建議安裝 v18 版本以上VS...

鐵人賽 Vue.js DAY 1
Nuxt 3 實戰筆記 系列 第 1

技術 [Day 01] Nuxt 3 nuxi 介紹 - Nuxt CLI 指令說明

前言 nuxi 全名為 (Nuxt CLI, Nuxt Command Line Interface),是由 Nuxt 提供開發的標準工具,Nuxt CLI 就...

鐵人賽 Vue.js DAY 1

技術 Day 1: Vue.js 簡介

前言 暑假因為實習而接觸到了 Vue 這個前端框架,剛好趁著這次鐵人賽,想整理這兩個月所學習到的知識和大家分享。 在這個系列中,我們將從 Vue 的基本觀念開始...

鐵人賽 Vue.js DAY 1

技術 DAY 1 - 開賽啦 ! 強化 Vue.js 30天之旅

DAY 1 - 開賽啦 ! 強化 Vue.js 30天之旅 我的背景 - 剛成功轉職的前端小菜鳥 <背景介紹>有點長可以當廢話跳過,只是希望分...

鐵人賽 Modern Web DAY 9

技術 【Day 9】Vue & React上的單向資料流的應用

關於單向資料流,昨天已經有針對這麼部分透過程式碼來了解是怎樣的資料流design pattern了,但是單向資料流究竟和Vue和React有什麼關係呢?就讓我們...

鐵人賽 Vue.js DAY 1

技術 V01_工欲善其事_Vue先裝起來

V01_工欲善其事_Vue先裝起來 在前端的世界中,我們都知道HTML, CSS, JS是三個主要的基石,不管各種上層的工具,套件,框架,最終都會透過瀏覽器來呈...

鐵人賽 Modern Web DAY 6

技術 【Day 6】元件的一生!Vue的生命週期 vs. React的生命週期

昨天看了渲染機制後,緊接著再往前一步來看看元件的生命週期吧!常寫Vue的朋友們應該對生命週期都不陌生,因為偶爾還是會遇到需要透過生命週期API來實現一些功能的時...

鐵人賽 Modern Web DAY 3

技術 【Day 3】可變特性與不可變特性&渲染的觸發與Virtual DOM的產生

不論是學習Vue或是學習React,除了學會怎麼使用它們的API或hook外,還必須了解它的渲染機制,這樣才可以避免出現一些預期外的bug而不自知,或是在需要某...

鐵人賽 Modern Web DAY 2

技術 【Day 2】這趟旅程,從認識mutable和immutable開始

我們先把什麼Vue不Vue的,React不React的放一旁,從一個很基礎,但很多初學者(包含我)卻沒有好好去理解的關鍵概念開始認識,那就是mutable和im...

鐵人賽 Vue.js DAY 7

技術 從入門到入土一條龍Vue.js Day07- To Do List(構思)

待辦清單 待辦清單是每位工程師入門程式語言時都會碰到的經典專案。透過這個簡單卻具代表性的應用,可以很直觀地評估和鞏固一個人對於某種語言或框架的掌握程度。不僅如此...

鐵人賽 Modern Web DAY 1

技術 【Day 1】為什麼我要從Vue學React?為什麼不只要會用,還要真的懂?

大家好!我是從韓文領域不務正業到軟體產業的文科少女,目前正在前端的世界努力中。因為希望自己能突破Junior的坎,所以為自己立下了一個參加鐵人賽的目標,希望透過...

鐵人賽 Vue.js DAY 6

技術 從入門到入土一條龍Vue.js Day06-指令進階用法(二)

v-for Vue 中的 v-for 指令允許我們基於數據渲染一個列表。上面的例子中,items 是一個包含三個物件的數組。v-for 會遍歷每個物件,並對每個...

鐵人賽 Vue.js DAY 5

技術 從入門到入土一條龍Vue.js Day05-指令進階用法(一)

Vue指令進階 在第三天我們說明了數據綁定的方法,分別是{{}}動態數據,v-bind屬性綁定和v-model表單數據綁定。除了前面的之外還有很多其他的指令,今...

鐵人賽 Vue.js DAY 4

技術 從入門到入土一條龍Vue.js Day04-基礎系列之Vue組件系統

什麼是組件? 在 Vue 中,組件可以被看作是一個可重用的 Vue 實例,帶有名稱。它們和常規的 Vue 實例很相似,只是它們用於定義可重用的代碼塊。組件是構建...

鐵人賽 Vue.js DAY 2

技術 從入門到入土一條龍Vue.js Day02-核心觀念介紹

重要說明-這是我個人了解之後白話文的解說 我們都知道Vue方便,那請問Vue方便在什麼地方?接下來假設我們要建立一個按鈕,按鈕按下去之後按鈕數字會增加。同樣的東...

鐵人賽 Vue.js DAY 1
重新認識 Vue.js 系列 第 1

技術 重新認識 Vue.js - Day 01:前言與大綱

陸陸續續前端也寫了一段時間了,除了怎麼用,總是要探討一下用什麼接下來的這段時間會介紹一些使用現代框架的原因以及差別,還有一些些的如何達成這些功能這邊就獻上大綱啦...

技術 在 Vue 中使用 Swiper Element (WebComponent)

知道這個套件一陣子了,但有一天要使用他的時候被官方文件寫的這段話嚇到。 Swiper Vue components will likely to be rem...