iT邦幫忙

鐵人檔案

2024 iThome 鐵人賽
回列表
佛心分享-SideProject30

和鱷魚組長的坐牢30天之vue的簡易todolist和Astro的簡易部落格實現 系列

就單純的被自己的同學邀進來參加鐵人30天然後就來寫文章了QQ,因為不知道要分享甚麼只好拿過去自己做的todolist來做簡易拆解,回顧自己過去所使用的技術,以及記錄自己在youtube上看到的Astro教學影片然後跟著動手做的成果

鐵人鍊成 | 共 30 篇文章 | 6 人訂閱 訂閱系列文 RSS系列文 團隊跟著2魚一起坐牢
DAY 1

和2魚坐牢的第一天-一個簡單的自我介紹

大家好,我是Tim,一個一直在當滑水菜鳥的前端工程師。 莫名其妙就被曾經的同學,此次鐵人賽的組長2魚拉著挑戰人生第一次鐵人賽(而且她還那麼鬼的要分享一個全端專案...

2024-09-10 ‧ 由 lockon1248 分享
DAY 2

和2魚坐牢的第二天-先來建個專案

因為當初受訓學的是 vue ,所以接下來的日子也會先以 vue 為開頭開始寫第一個專案,而自2020年尤雨溪推出了 vite 這個打包工具後,現今主流的打包工具...

2024-09-11 ‧ 由 lockon1248 分享
DAY 3

和2魚坐牢的第三天-Tailwind CSS

建立專案看到vite的畫面只是第一步,接下來便是開始設計出想要的畫面了,由於我們只是寫一個簡單的 todolist 來做練手,所以我們並不要求要有甚麼好看的畫面...

2024-09-12 ‧ 由 lockon1248 分享
DAY 4

和2魚坐牢的第四天-Tailwind插件和apply

續接上回,當我們開始用 tailwind 開始進行我們 css 的撰寫時,假設若對 tailwind 所定義好的 class 類名不瞭解,就會變成要反覆去看 t...

2024-09-13 ‧ 由 lockon1248 分享
DAY 5

和2魚坐牢的第五天-antdesign.vue和Font Awesome

在進行切板之前我們還需要安裝紅圈的套件:antdesign.vue,還有黃圈的套件:Font Awesome antdesign.vue 我們這次選用的UI套...

2024-09-14 ‧ 由 lockon1248 分享
DAY 6

和2魚坐牢的第六天-Tailwind的自定義任意值和自定義內容

首先先看一下這次預計要完成的畫面,一個簡單的 todolist,並帶有增刪改查(CRUD)的基本功能,並且還將會有多語系切換的功能: 在開始刻劃版面之前,我們...

2024-09-15 ‧ 由 lockon1248 分享
DAY 7

和2魚坐牢的第七天-vite-plugin-svg-icons

除了用常見的Font Awesome套件以外,接下來要額外介紹的是 vite-plugin-svg-icons 套件,以往我們在使用 icon 都會優先想到...

2024-09-16 ‧ 由 lockon1248 分享
DAY 8

和2魚坐牢的第八天-todolist畫面切版

終於來到我們的正式切版畫面了,今天的目標是我們大概會切出一個這樣子的簡單版型,藉以熟悉tailwind CSS 的應用 在初期規劃版型上面,我們將預計分成三個...

2024-09-17 ‧ 由 lockon1248 分享
DAY 9

和2魚坐牢的第九天-todolist畫面切版之列表部分及無資料畫面

今天我們要來完成列表的部分,還有無資料的時候的畫面 首先是無資料的時候: <template> <div class="min-...

2024-09-18 ‧ 由 lockon1248 分享
DAY 10

和2魚坐牢的第十天-todolist之新增功能

今天我們要來實做新增功能的部分: 也就是說當我們在input框中輸入文字在點擊按鈕(click事件)時能夠將資料新增到下裂的列表裡,首先讓我們在script標...

2024-09-19 ‧ 由 lockon1248 分享