iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
自我挑戰組

30天小老闆系列(1)--線上排班小工具 系列

轉業中的新手前端工程師,還沒找到工作,所以先來做Side Project增加實戰作品累積。
目前主要使用框架是Vue,但對於Vuex、Nuxt.js尚未學習,此次會針對這兩個工具做深入研究。
後端的部分會嘗試用JSON Server模擬 RESTful API。

鐵人鍊成 | 共 30 篇文章 | 4 人訂閱 訂閱系列文 RSS系列文
DAY 1

DAY1 起手式--建置 Nuxt.js 環境

Nuxt.js是什麼?可以吃嗎? 每一個工具的誕生,都是為了"解決問題",而 Nuxt.js 是用來解決什麼問題呢? 解決 SPA ( Single Page...

2021-09-01 ‧ 由 RedbeanHong 分享
DAY 2

DAY2 起手式--Nuxt.js目錄結構

目錄結構落落長是怎樣!? 沒關係,一起簡單了解 上篇我們建立了 Nuxt.js 環境,應該可以看到資料夾內變得琳瑯滿目,多了一堆資料夾跟文件,看的灰煞煞。別緊張...

2021-09-02 ‧ 由 RedbeanHong 分享
DAY 3

DAY3 起手式--Nuxt.js路由設定

Nuxt.js 跟 Vue-Router 是什麼關係? 有使用過 vue-router 的捧由,別緊張,就當作我們用的就是 vue-router 沒有錯啦!Nu...

2021-09-03 ‧ 由 RedbeanHong 分享
DAY 4

DAY4 起手式--Nuxt.js(細)說pages(上)

你知道 pages 的 vue 元件多了什麼功能嗎? 經過昨天的介紹,我們都知道 pages 是拿來放各頁面的 vue 元件,也知道 router 會依照 pa...

2021-09-04 ‧ 由 RedbeanHong 分享
DAY 5

DAY5 起手式--Nuxt.js(細)說pages(下)

layout 属性 我們可以使用 layout 屬性來套用放置於 layouts 的布局。 export default { layout: 'FrontE...

2021-09-05 ‧ 由 RedbeanHong 分享
DAY 6

DAY6 起手式--Nuxt.js常用套件安裝

前言 不論在哪個環境開發,都會使用到一些插件、套件,我們應該如何在 Nuxt.js 使用呢?又要如何配置呢?今天將針對常用的一些套件,像是預處理器( SCSS...

2021-09-06 ‧ 由 RedbeanHong 分享
DAY 7

DAY7 資料室--Vuex是個蝦咪東東?

前言 曾幾何時,你有沒有對元件中資料調用感到困擾呢?同階層的元件資料傳遞,需要使用 Event Bus,確實滿不好管理的。或是相同的資料,需要在很多元件中去做變...

2021-09-07 ‧ 由 RedbeanHong 分享
DAY 8

DAY8 資料室--Vuex的那些方法

前言 昨天我們在 Vuex 入門研究了 State 、 Mutation 的功能與使用方法只是想提醒各位捧由,昨天的範例並不完全是正確用法哦! 由這張 Vuex...

2021-09-08 ‧ 由 RedbeanHong 分享
DAY 9

DAY9 資料室--Vuex初創Store

前言 前面兩篇我們已經大約了解了 Vuex 的運作模式,所以現在讓我們來用個簡單的例子實際運用看看吧! 初創Store 設定 Store首先我們來建立一個 s...

2021-09-09 ‧ 由 RedbeanHong 分享
DAY 10

DAY10 資料室--Vuex模組化

為什麼需要Vuex模組化? 試想一個電商網站,頁面繁多,資料的部分前台會有購物車、商品、評價、促銷活動,後台部分有訂單、折扣碼、帳務等等等…眾多的資料如果都放在...

2021-09-10 ‧ 由 RedbeanHong 分享