Profile
Planner
FrontEnd
Daily
Contact

文章目錄

❤

手帳 / Planner
0

用 Obsidian 設計自己的週計畫與週誌

Notion 小工具四款各具特色的番茄鐘

在 Notion 使用熱力圖工具 Heat Map 呈現各種打卡追蹤數據

怎麼在 Notion 繪製流程圖、心智圖、圓餅圖，象限圖 … 等各種圖表

使用手帳幫你評估任務完成度，並復盤本週進度

如何用 Notion 資料庫做專案管理：甘特圖、月週計畫、待辦事項與文件的五種格式

如何規劃我的自律生活？輕鬆用行事曆 APP 搞定提醒、重複與筆記等功能

我的 2024 手帳：綠的事務暮光之絮八分割 A5 週誌 (薰衣草)

Evernote 逃難潮？Notion、Obsidian 該如何選擇？

WORD UP：輕鬆建立單字卡，幫助記憶單字的便利APP

善用 Notion 行事曆，一次規劃行程與待辦事項

自製 Notion 模板分享：英文學習日誌，建立自己的英文單字資料庫

無痛轉移 Notion 帳號，資料跟 Domain 都能完整保留

用 Notion 製作歷年領的紅包紀錄

2022 年重回活頁手帳的懷抱

向月光族說掰掰，我最常用的 5 種存錢法 (含格式下載)

我的 2022 手帳：APJ Finie B6 週誌兩日一頁 (海軍藍)

2021 年月行事曆規劃分享

韓系手帳風的復盤與反思

我的股票觀察日誌 : 紀錄，復盤與反思

用 Notion 製作年度回顧表

我畫過的子彈筆記格式分享

我的 2021 手帳：綠的事務日日好方格 A5 週誌 (酡顏)

8. 用手帳做旅行前的資料準備

7. 用月記事做專案控管

6. 用手帳做會議記錄與專案管理

5. 製作讀書計畫成為備考高手

到底要有很多本手帳？還是一本就夠了？

用螢光筆快速畫出可愛的書櫃(BookShelf)

Mobiscribe 電子筆記本，隨身做筆記與塗鴉的好幫手

2020 年曆行事曆 PDF 免費下載 (A5 尺寸)

201911 子彈筆記規劃與手帳分享

手帳輕旅行這樣玩，烏來二日遊也要認真記

2020 台灣行事曆 PDF 免費下載 (A5 TN 尺寸)

4. 專屬於你的學習筆記

整合手帳的 Keny 萬用手冊開箱與自製活頁分享

印出你的 52 週存錢挑戰表，2020 年這樣存錢最聰明

用 Notion 製作讀書清單

用 Notion Template 製作時間管理四象限

3. 日本品牌手帳介紹

2. 台灣本土手帳介紹

1. 從挑手帳開始

利用手帳達成學習目標

技術文章 / FrontEnd
0

如何製作 GitHub issue 和 PR 的 template

如何使用 GitHub 的 Actions 自動產生 Release 文件

Zeabur：簡單好用的一鍵部署服務，支援前後端與多語言，讓部署變得輕鬆簡單

Vue3 如何用 defineModel 實作 props/ emit 的父子元件傳值，讓傳值變得更方便簡單

如何重構一個已上線且完整的功能或程式設計

初探 Singleton Pattern 設計模式

在 Vue.js 設定多個入口網址，並顯示對應的網站標題

如何在 Vue.js 中不使用 CSS 框架(ex.Element Plus )，自行寫出表格和分頁功能

7. 使用 MUI X 的 Data Grid 製作台股報價資料

使用 Element Plus 分頁處理前端的大量資料，並使用工廠函式優化程式碼

6. Next.js 完善 Server actions 至前端呼叫 API 的錯誤處理

用 Next.js 的 Server Components 時，該用 fetch() 還是 axios 呼叫 api？

5. Next.js 串接 TradingView 開發的圖表套件，並透過 Server 端呼叫外部的富果 API

4. 用 Next.js 的 App Router 建置路由

如何讓使用 CDN 的 Tailwind CSS 也能在 VS Code 啟用 Tailwind CSS Intellisense 套件

在 Next.js 碰到 Text content does not match 的解決辦法

不重新整理網頁，讓 Vue3 強制更新當前路由並重新渲染頁面

用 React Context API 實作跨組件傳值的功能

vw 進化了！更好用的 CSS 自適應字體大小

客製化 Quill 編輯器，並搭配 ant design 製作所見即所得編輯器

使用 Google Analytics 4 (GA4) 和 Google Tag Manager(GTM) 設計並追蹤自訂事件

只會寫程式的工程師，是個成功的工程師嗎？

CSS 表單樣式分享：Material UI 的 Label 標籤浮動縮放

Vue3 使用 watch 監聽路由變化，支援瀏覽器的上一頁 / 下一頁按鈕切換

3. 客製化我的 Material UI (MUI) 設定

2. 建構 React 與安裝套件

1. 前言與工具選擇

透過 img object-fit 屬性取代 CSS 的 background 語法，輕鬆實現圖片背景的效果

在 Vite 專案中按需引入檔案，並自訂 chunk 分割代碼

用 v-html 來載入語系檔案的缺點與解決方案

Vue 父元件傳遞 API 資料給子元件

用 CSS 製作垂直滾動的跑馬燈

用 React Hook 規劃路由

使用 Vue 自定義指令(custom directive)製作網站權限

使用 Vite 整合 axios 攔截器與 axios proxy

封裝並按需引入 Apache ECharts，圖表的寬高自動使用父層的寬高

用 VueUse 套件修改 CSS Var 變數

在本機以及 GitLab CI/CD 整合效能監測工具 Google LightHouse

整合 TailwindCSS 與 Element Plus 的 CSS class 變數

在 Vue3 + Vite 專案下設定亮色與暗色主題

在 Vue3 + Vite 專案下安裝使用 SASS/ SCSS 以及 CSS Module

Vue3 安裝 TypeScript 的 Vue-i18n 多國語系

用 Vue3 + Vite + TypeScript + TailwindCSS + ESLint 新增專案

VSCode 的好用註解套件，高亮註解顏色，將註解變成 TODO 待辦事項

使用 SCSS each 與 CSS var 變數，調整 Bootstrap, Element UI 的 CSS 樣式

vue 在離開頁面時，會取消所有的 api 請求，使用 axios 搭配 AbortController signal API

在 gitlab push 後使用 CI/CD 自動更新版本號與發布 release

在 JS 檔案引用 Vue3 的實體

使用 BroadcastChannel 讓 sessionStorage 的資料可以跨分頁同步讀取

解決 eslint 出現 no-multiple-template-root 的錯誤

JavaScript 的 this 到底指向誰？

Vue 3 整合 Vuex 與使用 Axios 攔截器

用 Vue Cli 規劃 Tailwind CSS 架構

Vue3 做原生的 HTML5 表單驗證

設定 Vue Router 讓巢狀路由的 parmas 與靜態路由同層級

用 v-select 製作關聯台灣鄉鎮市區的下拉選單

git rebase 步驟記錄

Vue3 載入外部的 JS 檔案

Vue 自製 breadcrumb 導航麵包屑元件

Vue3 如何載入 Router 以及 Vuex

Vue CLI 搭配 Vue3 + Tailwind CSS3 開發

用 Vue + TailwindCSS 時，變數 class 沒有作用

區網連線下，用手機觀看 Nuxt.js 開發的專案

將 Nuxt.js 串接的資料改寫成多國語系

用 Nuxt.js 串接 data 做下拉式選單

用 Vue + Express 建置前後端網站

在 Vue 使用所有的 Font Awesome icon

我的 Visual Studio Code 編輯器設定記錄 (佈景與模組)

用 Express + nodemon 建一個乾淨的 NodeJS 樣板

讓 WordPress 內建的分隔符號(HR)區塊可以完整顯示樣式

讓 CSS 讀取 Vue i18n 的語系並顯示對應的樣式

難解的 CSS 排版：認識對齊(下)

難解的 CSS 排版：認識對齊(上)

建立 Vue Cli 3 專案的設定介紹

CSS Grid 語法筆記

Bootstrap 4 的 Grid 應用介紹

傾囊相授 ! MUKI 的 RWD 入門與實戰課程分享

利用 SVN 更新 WordPress 外掛

CSS Flexbox 介紹與解析

原生 CSS 的預處理器：Myth 介紹與使用

inline element 與 padding 的二三事

SASS, LESS 退散，原生 CSS 可以使用變數啦！

設計網站版面最重要的一環

漂亮的 WordPress 標籤雲外掛 : Muki Tag Cloud

將檔案快速 push 到 gh-pages branch

我的 Brackets 編輯器設定 (佈景與外掛)

讓 WordPress 的 RSS Feed 也能讀到自訂的文章類型 (post type)

用 Bootstrap 3 製作高度相同的 div (column)

jQuery Ajax API 實作以及 Template 介紹

超級初心者適用的 JavaScript 觀念 (暫停更新)

codyhouse 的 tooltip 線上教學筆記與心得

讓 Facebook 社交小工具(Page Plugin)能有 RWD 的效果

WooCommerce 系列教學 (3/3)：串接第三方金流

WooCommerce 系列教學 (2/3)：商品上架流程

WooCommerce 系列教學 (1/3)：安裝與使用

從 CSS sprite 進化到 SVG sprite

初探 Sass Maps 與使用介紹

如何設計好的使用者介面 (Good UI) ?

將 Google 搜尋框整合至 WordPress

使用 sass 有效控管 z-index 圖層順序

用 css 讓區塊水平垂直置中

利用純 CSS3 做出自適應的 lightbox

display: table-cell 無法使用 margin/ padding 的解法

動手更換 Facebook 的新版面

利用 css 讓 ul div 置中

使用 CSS:not 與 data-index 即時搜尋頁面

用 data-* 屬性做出純 CSS 的 tooltip

在 wp nav menu 前後增加自定義連結

強烈推薦收藏好物 – CSS Specificity (CSS 權重一覽)

使用 CSS nth-child 必須要注意的事情

想從設計走到前端？先了解前端在幹嘛吧！

WordPress 內建階層選單製作

淺談 section 運用以及與 outline 間的關聯

讓 WordPress 留言能顯示 HTML 標籤

WebSocket 簡單介紹與 jQuery 實作應用

讓 float 的 div 高度相同

使用 HTML5 和 jQuery 簡易存取資料

無法讀取及訂閱 WordPress Feed 問題修正

輕鬆寫 WordPress 模組 / 選單

修改 WordPress 留言表單的文字

CSS Media Queries 介紹與基礎應用

深入 CSS 之 line-height 應用

我的 reset.css 是這麼寫的

常見的 CSS + DIV 問題整理

解決「側邊欄掉下去」的問題

快速寫好 CSS 的 5 種方法

輕鬆上手CSS(III) – 基本語法傳授!!

CSS 選擇器概略說明

基本的 css 語法縮寫

輕鬆上手CSS(II) – 叫叫ABC篇

輕鬆上手css(I) – 不可不知篇

學css前要準備什麼?

日常 / Daily
0

陸劇大理寺少卿遊觀後心得：躲過了高玄，避掉了賀喬宴，卻在邱慶之身上栽了

omega 系列強勢回歸，omegaBook 新版設計上線

寫文章該注意的事情

陸劇蓮花樓觀後心得：小舟從此逝，江海寄人生

大人學破局思考：從關鍵小事看出職場大局 <作者：姚詩豪，張國洋> 推薦給對職場感到迷惘的你

美夢與熱望 <作者：桃子茶本茶> 當孤獨的女騎士碰到孤獨的龍，除了男女主外其他 CP 都意難平

我是我自已的情敵 <作者：書了了> 腦洞大開的時空閉鎖小說：我所做的決定，都只為了離你更近一步

陸劇閃耀的她觀後心得

陸劇天才基本法觀後心得

HPX Life23 座談，參加資深部落客工頭堅「十年長路」座談會有感

KOL Academy 第一屆區塊鏈學院聽講心得

復仇者聯盟 4: 終局之戰

我看過的原創小說一覽

iOS APP 程式入門課程紀錄

蝙蝠俠對超人：正義曙光

原來，這只是兩個人的互相取暖

被時光掩埋的秘密最美的時光 (小說、電視劇整理)

MOPCON 2015 會後感想

NodeSchool 一日感想與學習紀錄

獻給阿爾吉儂的花束情商與智商的失衡

蜘蛛人驚奇再起 2

網站大改版，omegaM Plus 重新出發

X 戰警: 未來昔日

2014 哥吉拉 3D

美國隊長 2 酷寒戰士

新書 WordPress七天速成班心得與介紹

救救菜英文

台劇愛的生存之道 1~12 觀後感

陰兒房第 2 章陰魂守舍

殭屍哪有這麼帥

那些 WebConf 沒說完的秘密 (Design Point)

關於 WebConf 的那些大事

少年PI的奇幻漂流

消失的子彈

蝙蝠俠開戰時刻黑暗騎士黎明昇起

蜘蛛人驚奇再起 1

復仇者聯盟

靈異第六感

007 量子危機

再說一次我愛你

蝙蝠俠：黑暗騎士

邪降：惡魔的藝術

尋找新樂園

命運好好玩

Copyright © 2008 ~ 2024 MUKI space* / omegaBook theme All Rights Reserved.

2015.05.13

服務項目

姓名(必填)

E-mail(必填)

洽詢項目

你是不是機器人？請回答 MUKI 是男生還是女生？

Δ

歡迎給我點鼓勵，讓我知道你來過：）

發生錯誤。