20240714

thomascsd · Jul 14, 2024 · f648b95 · f648b95
1 parent 9b008ee
commit f648b95
Show file tree

Hide file tree

Showing 50 changed files with 4,052 additions and 2,991 deletions.
diff --git a/320.885635a3e980bd07.js b/320.885635a3e980bd07.js
diff --git a/about/index.html b/about/index.html
diff --git a/assets/images/30/30-0.jpg b/assets/images/30/30-0.jpg
diff --git a/assets/images/30/30-1.png b/assets/images/30/30-1.png
diff --git a/assets/images/30/30-2.png b/assets/images/30/30-2.png
diff --git a/assets/images/30/30-3.png b/assets/images/30/30-3.png
diff --git a/assets/images/30/30-4.png b/assets/images/30/30-4.png
diff --git a/assets/images/bgBlog.png b/assets/images/bgBlog.png
diff --git a/assets/scully-routes.json b/assets/scully-routes.json
@@ -1 +1 @@
-[{"route":"/"},{"route":"/about"},{"route":"/blog/2017-06-20-HelloWorld","title":"Hello World!","published":true,"sourceFile":"2017-06-20-HelloWorld.md"},{"route":"/blog/2017-07-13-BuildBlogWithJekyll","title":"使用Jekyll建立Blog -1","published":true,"sourceFile":"2017-07-13-BuildBlogWithJekyll.md"},{"route":"/blog/2017-10-08-VuejsInAspnetMvc","title":"在asp.net MVC上使用vue.js需注意的事項","published":true,"sourceFile":"2017-10-08-VuejsInAspnetMvc.md"},{"route":"/blog/2017-12-23-VscodeDebugForNodejsAndnAgular","title":"使用VSCode偵錯Node.js及Angular的小技巧","published":true,"sourceFile":"2017-12-23-VscodeDebugForNodejsAndnAgular.md"},{"route":"/blog/2018-06-23-NuxtjsAndNuxtent","title":"使用Nuxt.js及Nuxtent建立Blog的心得","bgImageUrl":"assets/images/05/05-0.jpg","published":true,"sourceFile":"2018-06-23-NuxtjsAndNuxtent.md"},{"route":"/blog/2018-08-12-ExampleOfPromise","title":"從範例講解Promise概念","bgImageUrl":"assets/images/06/06-0.jpg","published":true,"sourceFile":"2018-08-12-ExampleOfPromise.md"},{"route":"/blog/2018-09-07-TutorialOfDraxtjs","title":"draxt.js-簡化存取檔案的小幫手","published":true,"sourceFile":"2018-09-07-TutorialOfDraxtjs.md"},{"route":"/blog/2018-10-31-ModulePattern","title":"談談JavaScript Module part1","bgImageUrl":"assets/images/08/08-0.jpg","published":true,"sourceFile":"2018-10-31-ModulePattern.md"},{"route":"/blog/2018-12-23-ModulePatternPart2","title":"談談JavaScript Module part2","bgImageUrl":"assets/images/08/08-0.jpg","published":true,"sourceFile":"2018-12-23-ModulePatternPart2.md"},{"route":"/blog/2019-02-20-CreateLibraryWithAngular","title":"於Angular中，建立Library的心得","bgImageUrl":"assets/images/10/10-0.jpg","published":true,"sourceFile":"2019-02-20-CreateLibraryWithAngular.md"},{"route":"/blog/2019-06-16-TutorialOfUppy","title":"Uppy - 最方便的上傳套件","bgImageUrl":"assets/images/11/11-0.jpg","published":true,"sourceFile":"2019-06-16-TutorialOfUppy.md"},{"route":"/blog/2019-09-01-TutorialOfVscodeExtension","title":"VSCode Extension的開發心得","bgImageUrl":"assets/images/12/12-0.jpg","published":true,"sourceFile":"2019-09-01-TutorialOfVscodeExtension.md"},{"route":"/blog/2019-11-30-SvgAndAngular","title":"SVG與Angular","bgImageUrl":"assets/images/13/13-0.jpg","published":true,"sourceFile":"2019-11-30-SvgAndAngular.md"},{"route":"/blog/2020-03-13-classValidatorAndNgxDynamicFormBuilder","title":"class-validator & ngx-dynamic-form-builder","published":true,"sourceFile":"2020-03-13-classValidatorAndNgxDynamicFormBuilder.md"},{"route":"/blog/2020-07-05-AngularLibrary","title":"6個推薦的Angular Library","bgImageUrl":"assets/images/15/15-0.jpg","published":true,"sourceFile":"2020-07-05-AngularLibrary.md"},{"route":"/blog/2020-08-03-BuildBlogUsingScully","title":"使用 Angular Static Generator - Scully 建立Blog的心得記錄","bgImageUrl":"assets/images/15/15-0.jpg","published":true,"sourceFile":"2020-08-03-BuildBlogUsingScully.md"},{"route":"/blog/2020-09-05-IntroducingDailyDev","title":"daily.dev - 整合各個技術文章的好用套件","bgImageUrl":"assets/images/17/17-0.jpg","published":true,"sourceFile":"2020-09-05-IntroducingDailyDev.md"},{"route":"/blog/2021-02-07-ExpressjssWithTypescript","title":"使用TypeScript建立Express.js","bgImageUrl":"assets/images/18/18-0.png","published":true,"sourceFile":"2021-02-07-ExpressjssWithTypescript.md"},{"route":"/blog/2021-04-24-AirtableAsDatabase","title":"將AirTable做為資料庫的心得","bgImageUrl":"assets/images/19/19-0.jpg","description":"開始寫自已的 Side Project 時，尋找了一些解決方案，發現AirTable符合我的需求","published":true,"sourceFile":"2021-04-24-AirtableAsDatabase.md"},{"route":"/blog/2021-06-12-AirTableWithDotnetCore","title":"將AirTable做為資料庫的心得 - .NET Core 篇","bgImageUrl":"assets/images/20/20-0.jpg","description":"尋找了一些解決方案，發現AirTable符合我的需求","published":true,"sourceFile":"2021-06-12-AirTableWithDotnetCore.md"},{"route":"/blog/2021-08-07-Codewars","title":"CodeWars - Coding Challenge Site","bgImageUrl":"assets/images/20/20-0.jpg","description":"可以練習平常很少接觸的題目，也可以練習演算法，並且除了 CodeWars 之外，還有其他的程式練習網站","published":true,"sourceFile":"2021-08-07-Codewars.md"},{"route":"/blog/2021-09-20-NetlifyFunctionTutorial","title":"Netlify functions 初體驗記錄","bgImageUrl":"assets/images/22/22-0.jpg","published":true,"sourceFile":"2021-09-20-NetlifyFunctionTutorial.md"},{"route":"/blog/2021-12-09-TutorialOfTsdx","title":"tsdx - 快速建立 npm 套件樣板的CLI工具","bgImageUrl":"assets/images/23/23-0.jpg","description":"快速建立 npm 套件，所以在 GitHub 上尋找有沒有方便的套件，結果發現到了 tsdx，這個方便的 CLI 工具","published":true,"sourceFile":"2021-12-09-TutorialOfTsdx.md"},{"route":"/blog/2022-05-20-WindowTeminalAndOhMyPosh","title":"我的Terminal 設定方式 - Windows Terminal & ohmyposh","bgImageUrl":"assets/images/24/24-0.jpg","description":"Windows Terminal 整合 cmd、PowerShell，並可 以自定樣式，但是還是希望和 oh my zsh一樣，可以顯示更多資訊，直到最近發現 ohmyposh可以讓 PowerShell 更好用","published":true,"sourceFile":"2022-05-20-WindowTeminalAndOhMyPosh.md"},{"route":"/blog/2022-09-08-AngularTypeform","title":"Angular TypeForm - 強型別Form的心得","bgImageUrl":"assets/images/25/25-0.jpg","description":"Angular v14 中最重要的 2 個功能，除了 Single Component 之外，就是 Typeform 了，而 Typeform 也就是在建立 Form 功能時，終於可以套用型別，方便開發及除錯，是期待很久的功能","published":true,"sourceFile":"2022-09-08-AngularTypeform.md"},{"route":"/blog/2023-02-06-Slidev","title":"建立簡報的工具 - Slidev 的介紹","bgImageUrl":"assets/images/26/26-0.jpg","description":"Slidev 是很好使用的工具，搭配 VSCode Exntension ，能快速輕鬆建立起簡報。而簡報所需的功能都有具備","published":true,"sourceFile":"2023-02-06-Slidev.md"},{"route":"/blog/2023-05-24-ExpressjsTypescriptTsed","title":"使用TypeScript建立Express.js-使用Ts.ED","bgImageUrl":"assets/images/27/27-0.jpg","description":"Ts.ED 是一個強大且易於使用的 framework，可以將 TypeScipt 與 Express.js整合，並使用 Controller 的方式建立 Express.js","published":true,"sourceFile":"2023-05-24-ExpressjsTypescriptTsed.md"},{"route":"/blog/2023-08-27-AngularOnChanges","title":"Angular判斷 DOM Render 是否完成","bgImageUrl":"assets/images/28/28-0.jpg","description":"使用 `ngOnChanges` 及`ngAfterViewChecked`這 2 個生命週期來判斷 DOM Render 是否完成","published":true,"sourceFile":"2023-08-27-AngularOnChanges.md"},{"route":"/blog/2023-12-29-TurorialOfCommnadLine","title":".NET 好用套件 - commandline","bgImageUrl":"assets/images/29/29-0.jpeg","description":"好用的套件 commandline，解析 CLI 參數，並使用Attribute來設定options","published":true,"sourceFile":"2023-12-29-TurorialOfCommnadLine.md"}]
+[{"route":"/"},{"route":"/about"},{"route":"/blog/2017-06-20-HelloWorld","title":"Hello World!","published":true,"sourceFile":"2017-06-20-HelloWorld.md"},{"route":"/blog/2017-07-13-BuildBlogWithJekyll","title":"使用Jekyll建立Blog -1","published":true,"sourceFile":"2017-07-13-BuildBlogWithJekyll.md"},{"route":"/blog/2017-10-08-VuejsInAspnetMvc","title":"在asp.net MVC上使用vue.js需注意的事項","published":true,"sourceFile":"2017-10-08-VuejsInAspnetMvc.md"},{"route":"/blog/2017-12-23-VscodeDebugForNodejsAndnAgular","title":"使用VSCode偵錯Node.js及Angular的小技巧","published":true,"sourceFile":"2017-12-23-VscodeDebugForNodejsAndnAgular.md"},{"route":"/blog/2018-06-23-NuxtjsAndNuxtent","title":"使用Nuxt.js及Nuxtent建立Blog的心得","bgImageUrl":"assets/images/05/05-0.jpg","published":true,"sourceFile":"2018-06-23-NuxtjsAndNuxtent.md"},{"route":"/blog/2018-08-12-ExampleOfPromise","title":"從範例講解Promise概念","bgImageUrl":"assets/images/06/06-0.jpg","published":true,"sourceFile":"2018-08-12-ExampleOfPromise.md"},{"route":"/blog/2018-09-07-TutorialOfDraxtjs","title":"draxt.js-簡化存取檔案的小幫手","published":true,"sourceFile":"2018-09-07-TutorialOfDraxtjs.md"},{"route":"/blog/2018-10-31-ModulePattern","title":"談談JavaScript Module part1","bgImageUrl":"assets/images/08/08-0.jpg","published":true,"sourceFile":"2018-10-31-ModulePattern.md"},{"route":"/blog/2018-12-23-ModulePatternPart2","title":"談談JavaScript Module part2","bgImageUrl":"assets/images/08/08-0.jpg","published":true,"sourceFile":"2018-12-23-ModulePatternPart2.md"},{"route":"/blog/2019-02-20-CreateLibraryWithAngular","title":"於Angular中，建立Library的心得","bgImageUrl":"assets/images/10/10-0.jpg","published":true,"sourceFile":"2019-02-20-CreateLibraryWithAngular.md"},{"route":"/blog/2019-06-16-TutorialOfUppy","title":"Uppy - 最方便的上傳套件","bgImageUrl":"assets/images/11/11-0.jpg","published":true,"sourceFile":"2019-06-16-TutorialOfUppy.md"},{"route":"/blog/2019-09-01-TutorialOfVscodeExtension","title":"VSCode Extension的開發心得","bgImageUrl":"assets/images/12/12-0.jpg","published":true,"sourceFile":"2019-09-01-TutorialOfVscodeExtension.md"},{"route":"/blog/2019-11-30-SvgAndAngular","title":"SVG與Angular","bgImageUrl":"assets/images/13/13-0.jpg","published":true,"sourceFile":"2019-11-30-SvgAndAngular.md"},{"route":"/blog/2020-03-13-classValidatorAndNgxDynamicFormBuilder","title":"class-validator & ngx-dynamic-form-builder","published":true,"sourceFile":"2020-03-13-classValidatorAndNgxDynamicFormBuilder.md"},{"route":"/blog/2020-07-05-AngularLibrary","title":"6個推薦的Angular Library","bgImageUrl":"assets/images/15/15-0.jpg","published":true,"sourceFile":"2020-07-05-AngularLibrary.md"},{"route":"/blog/2020-08-03-BuildBlogUsingScully","title":"使用 Angular Static Generator - Scully 建立Blog的心得記錄","bgImageUrl":"assets/images/15/15-0.jpg","published":true,"sourceFile":"2020-08-03-BuildBlogUsingScully.md"},{"route":"/blog/2020-09-05-IntroducingDailyDev","title":"daily.dev - 整合各個技術文章的好用套件","bgImageUrl":"assets/images/17/17-0.jpg","published":true,"sourceFile":"2020-09-05-IntroducingDailyDev.md"},{"route":"/blog/2021-02-07-ExpressjssWithTypescript","title":"使用TypeScript建立Express.js","bgImageUrl":"assets/images/18/18-0.png","published":true,"sourceFile":"2021-02-07-ExpressjssWithTypescript.md"},{"route":"/blog/2021-04-24-AirtableAsDatabase","title":"將AirTable做為資料庫的心得","bgImageUrl":"assets/images/19/19-0.jpg","description":"開始寫自已的 Side Project 時，尋找了一些解決方案，發現AirTable符合我的需求","published":true,"sourceFile":"2021-04-24-AirtableAsDatabase.md"},{"route":"/blog/2021-06-12-AirTableWithDotnetCore","title":"將AirTable做為資料庫的心得 - .NET Core 篇","bgImageUrl":"assets/images/20/20-0.jpg","description":"尋找了一些解決方案，發現AirTable符合我的需求","published":true,"sourceFile":"2021-06-12-AirTableWithDotnetCore.md"},{"route":"/blog/2021-08-07-Codewars","title":"CodeWars - Coding Challenge Site","bgImageUrl":"assets/images/20/20-0.jpg","description":"可以練習平常很少接觸的題目，也可以練習演算法，並且除了 CodeWars 之外，還有其他的程式練習網站","published":true,"sourceFile":"2021-08-07-Codewars.md"},{"route":"/blog/2021-09-20-NetlifyFunctionTutorial","title":"Netlify functions 初體驗記錄","bgImageUrl":"assets/images/22/22-0.jpg","published":true,"sourceFile":"2021-09-20-NetlifyFunctionTutorial.md"},{"route":"/blog/2021-12-09-TutorialOfTsdx","title":"tsdx - 快速建立 npm 套件樣板的CLI工具","bgImageUrl":"assets/images/23/23-0.jpg","description":"快速建立 npm 套件，所以在 GitHub 上尋找有沒有方便的套件，結果發現到了 tsdx，這個方便的 CLI 工具","published":true,"sourceFile":"2021-12-09-TutorialOfTsdx.md"},{"route":"/blog/2022-05-20-WindowTeminalAndOhMyPosh","title":"我的Terminal 設定方式 - Windows Terminal & ohmyposh","bgImageUrl":"assets/images/24/24-0.jpg","description":"Windows Terminal 整合 cmd、PowerShell，並可 以自定樣式，但是還是希望和 oh my zsh一樣，可以顯示更多資訊，直到最近發現 ohmyposh可以讓 PowerShell 更好用","published":true,"sourceFile":"2022-05-20-WindowTeminalAndOhMyPosh.md"},{"route":"/blog/2022-09-08-AngularTypeform","title":"Angular TypeForm - 強型別Form的心得","bgImageUrl":"assets/images/25/25-0.jpg","description":"Angular v14 中最重要的 2 個功能，除了 Single Component 之外，就是 Typeform 了，而 Typeform 也就是在建立 Form 功能時，終於可以套用型別，方便開發及除錯，是期待很久的功能","published":true,"sourceFile":"2022-09-08-AngularTypeform.md"},{"route":"/blog/2023-02-06-Slidev","title":"建立簡報的工具 - Slidev 的介紹","bgImageUrl":"assets/images/26/26-0.jpg","description":"Slidev 是很好使用的工具，搭配 VSCode Exntension ，能快速輕鬆建立起簡報。而簡報所需的功能都有具備","published":true,"sourceFile":"2023-02-06-Slidev.md"},{"route":"/blog/2023-05-24-ExpressjsTypescriptTsed","title":"使用TypeScript建立Express.js-使用Ts.ED","bgImageUrl":"assets/images/27/27-0.jpg","description":"Ts.ED 是一個強大且易於使用的 framework，可以將 TypeScipt 與 Express.js整合，並使用 Controller 的方式建立 Express.js","published":true,"sourceFile":"2023-05-24-ExpressjsTypescriptTsed.md"},{"route":"/blog/2023-08-27-AngularOnChanges","title":"Angular判斷 DOM Render 是否完成","bgImageUrl":"assets/images/28/28-0.jpg","description":"使用 `ngOnChanges` 及`ngAfterViewChecked`這 2 個生命週期來判斷 DOM Render 是否完成","published":true,"sourceFile":"2023-08-27-AngularOnChanges.md"},{"route":"/blog/2023-12-29-TurorialOfCommnadLine","title":".NET 好用套件 - commandline","bgImageUrl":"assets/images/29/29-0.jpeg","description":"好用的套件 commandline，解析 CLI 參數，並使用Attribute來設定options","published":true,"sourceFile":"2023-12-29-TurorialOfCommnadLine.md"},{"route":"/blog/2024-07-14-FirtstStepBulma","title":"Bulma的初體驗","bgImageUrl":"assets/images/30/30-0.jpg","description":"Bulma 確實是一個非常直觀且方便使用的 CSS 框架。它的開發者體驗（DX）優秀，對比 Bootstrap 有著更為簡潔的語法和設計。特別是在排版和元件設定方面，Bulma 可以來試試看","published":true,"sourceFile":"2024-07-14-FirtstStepBulma.md"}]
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		[{"route":"/"},{"route":"/about"},{"route":"/blog/2017-06-20-HelloWorld","title":"Hello World!","published":true,"sourceFile":"2017-06-20-HelloWorld.md"},{"route":"/blog/2017-07-13-BuildBlogWithJekyll","title":"使用Jekyll建立Blog -1","published":true,"sourceFile":"2017-07-13-BuildBlogWithJekyll.md"},{"route":"/blog/2017-10-08-VuejsInAspnetMvc","title":"在asp.net MVC上使用vue.js需注意的事項","published":true,"sourceFile":"2017-10-08-VuejsInAspnetMvc.md"},{"route":"/blog/2017-12-23-VscodeDebugForNodejsAndnAgular","title":"使用VSCode偵錯Node.js及Angular的小技巧","published":true,"sourceFile":"2017-12-23-VscodeDebugForNodejsAndnAgular.md"},{"route":"/blog/2018-06-23-NuxtjsAndNuxtent","title":"使用Nuxt.js及Nuxtent建立Blog的心得","bgImageUrl":"assets/images/05/05-0.jpg","published":true,"sourceFile":"2018-06-23-NuxtjsAndNuxtent.md"},{"route":"/blog/2018-08-12-ExampleOfPromise","title":"從範例講解Promise概念","bgImageUrl":"assets/images/06/06-0.jpg","published":true,"sourceFile":"2018-08-12-ExampleOfPromise.md"},{"route":"/blog/2018-09-07-TutorialOfDraxtjs","title":"draxt.js-簡化存取檔案的小幫手","published":true,"sourceFile":"2018-09-07-TutorialOfDraxtjs.md"},{"route":"/blog/2018-10-31-ModulePattern","title":"談談JavaScript Module part1","bgImageUrl":"assets/images/08/08-0.jpg","published":true,"sourceFile":"2018-10-31-ModulePattern.md"},{"route":"/blog/2018-12-23-ModulePatternPart2","title":"談談JavaScript Module part2","bgImageUrl":"assets/images/08/08-0.jpg","published":true,"sourceFile":"2018-12-23-ModulePatternPart2.md"},{"route":"/blog/2019-02-20-CreateLibraryWithAngular","title":"於Angular中，建立Library的心得","bgImageUrl":"assets/images/10/10-0.jpg","published":true,"sourceFile":"2019-02-20-CreateLibraryWithAngular.md"},{"route":"/blog/2019-06-16-TutorialOfUppy","title":"Uppy - 最方便的上傳套件","bgImageUrl":"assets/images/11/11-0.jpg","published":true,"sourceFile":"2019-06-16-TutorialOfUppy.md"},{"route":"/blog/2019-09-01-TutorialOfVscodeExtension","title":"VSCode Extension的開發心得","bgImageUrl":"assets/images/12/12-0.jpg","published":true,"sourceFile":"2019-09-01-TutorialOfVscodeExtension.md"},{"route":"/blog/2019-11-30-SvgAndAngular","title":"SVG與Angular","bgImageUrl":"assets/images/13/13-0.jpg","published":true,"sourceFile":"2019-11-30-SvgAndAngular.md"},{"route":"/blog/2020-03-13-classValidatorAndNgxDynamicFormBuilder","title":"class-validator & ngx-dynamic-form-builder","published":true,"sourceFile":"2020-03-13-classValidatorAndNgxDynamicFormBuilder.md"},{"route":"/blog/2020-07-05-AngularLibrary","title":"6個推薦的Angular Library","bgImageUrl":"assets/images/15/15-0.jpg","published":true,"sourceFile":"2020-07-05-AngularLibrary.md"},{"route":"/blog/2020-08-03-BuildBlogUsingScully","title":"使用 Angular Static Generator - Scully 建立Blog的心得記錄","bgImageUrl":"assets/images/15/15-0.jpg","published":true,"sourceFile":"2020-08-03-BuildBlogUsingScully.md"},{"route":"/blog/2020-09-05-IntroducingDailyDev","title":"daily.dev - 整合各個技術文章的好用套件","bgImageUrl":"assets/images/17/17-0.jpg","published":true,"sourceFile":"2020-09-05-IntroducingDailyDev.md"},{"route":"/blog/2021-02-07-ExpressjssWithTypescript","title":"使用TypeScript建立Express.js","bgImageUrl":"assets/images/18/18-0.png","published":true,"sourceFile":"2021-02-07-ExpressjssWithTypescript.md"},{"route":"/blog/2021-04-24-AirtableAsDatabase","title":"將AirTable做為資料庫的心得","bgImageUrl":"assets/images/19/19-0.jpg","description":"開始寫自已的 Side Project 時，尋找了一些解決方案，發現AirTable符合我的需求","published":true,"sourceFile":"2021-04-24-AirtableAsDatabase.md"},{"route":"/blog/2021-06-12-AirTableWithDotnetCore","title":"將AirTable做為資料庫的心得 - .NET Core 篇","bgImageUrl":"assets/images/20/20-0.jpg","description":"尋找了一些解決方案，發現AirTable符合我的需求","published":true,"sourceFile":"2021-06-12-AirTableWithDotnetCore.md"},{"route":"/blog/2021-08-07-Codewars","title":"CodeWars - Coding Challenge Site","bgImageUrl":"assets/images/20/20-0.jpg","description":"可以練習平常很少接觸的題目，也可以練習演算法，並且除了 CodeWars 之外，還有其他的程式練習網站","published":true,"sourceFile":"2021-08-07-Codewars.md"},{"route":"/blog/2021-09-20-NetlifyFunctionTutorial","title":"Netlify functions 初體驗記錄","bgImageUrl":"assets/images/22/22-0.jpg","published":true,"sourceFile":"2021-09-20-NetlifyFunctionTutorial.md"},{"route":"/blog/2021-12-09-TutorialOfTsdx","title":"tsdx - 快速建立 npm 套件樣板的CLI工具","bgImageUrl":"assets/images/23/23-0.jpg","description":"快速建立 npm 套件，所以在 GitHub 上尋找有沒有方便的套件，結果發現到了 tsdx，這個方便的 CLI 工具","published":true,"sourceFile":"2021-12-09-TutorialOfTsdx.md"},{"route":"/blog/2022-05-20-WindowTeminalAndOhMyPosh","title":"我的Terminal 設定方式 - Windows Terminal & ohmyposh","bgImageUrl":"assets/images/24/24-0.jpg","description":"Windows Terminal 整合 cmd、PowerShell，並可以自定樣式，但是還是希望和 oh my zsh一樣，可以顯示更多資訊，直到最近發現 ohmyposh可以讓 PowerShell 更好用","published":true,"sourceFile":"2022-05-20-WindowTeminalAndOhMyPosh.md"},{"route":"/blog/2022-09-08-AngularTypeform","title":"Angular TypeForm - 強型別Form的心得","bgImageUrl":"assets/images/25/25-0.jpg","description":"Angular v14 中最重要的 2 個功能，除了 Single Component 之外，就是 Typeform 了，而 Typeform 也就是在建立 Form 功能時，終於可以套用型別，方便開發及除錯，是期待很久的功能","published":true,"sourceFile":"2022-09-08-AngularTypeform.md"},{"route":"/blog/2023-02-06-Slidev","title":"建立簡報的工具 - Slidev 的介紹","bgImageUrl":"assets/images/26/26-0.jpg","description":"Slidev 是很好使用的工具，搭配 VSCode Exntension ，能快速輕鬆建立起簡報。而簡報所需的功能都有具備","published":true,"sourceFile":"2023-02-06-Slidev.md"},{"route":"/blog/2023-05-24-ExpressjsTypescriptTsed","title":"使用TypeScript建立Express.js-使用Ts.ED","bgImageUrl":"assets/images/27/27-0.jpg","description":"Ts.ED 是一個強大且易於使用的 framework，可以將 TypeScipt 與 Express.js整合，並使用 Controller 的方式建立 Express.js","published":true,"sourceFile":"2023-05-24-ExpressjsTypescriptTsed.md"},{"route":"/blog/2023-08-27-AngularOnChanges","title":"Angular判斷 DOM Render 是否完成","bgImageUrl":"assets/images/28/28-0.jpg","description":"使用 `ngOnChanges` 及`ngAfterViewChecked`這 2 個生命週期來判斷 DOM Render 是否完成","published":true,"sourceFile":"2023-08-27-AngularOnChanges.md"},{"route":"/blog/2023-12-29-TurorialOfCommnadLine","title":".NET 好用套件 - commandline","bgImageUrl":"assets/images/29/29-0.jpeg","description":"好用的套件 commandline，解析 CLI 參數，並使用Attribute來設定options","published":true,"sourceFile":"2023-12-29-TurorialOfCommnadLine.md"}]
		[{"route":"/"},{"route":"/about"},{"route":"/blog/2017-06-20-HelloWorld","title":"Hello World!","published":true,"sourceFile":"2017-06-20-HelloWorld.md"},{"route":"/blog/2017-07-13-BuildBlogWithJekyll","title":"使用Jekyll建立Blog -1","published":true,"sourceFile":"2017-07-13-BuildBlogWithJekyll.md"},{"route":"/blog/2017-10-08-VuejsInAspnetMvc","title":"在asp.net MVC上使用vue.js需注意的事項","published":true,"sourceFile":"2017-10-08-VuejsInAspnetMvc.md"},{"route":"/blog/2017-12-23-VscodeDebugForNodejsAndnAgular","title":"使用VSCode偵錯Node.js及Angular的小技巧","published":true,"sourceFile":"2017-12-23-VscodeDebugForNodejsAndnAgular.md"},{"route":"/blog/2018-06-23-NuxtjsAndNuxtent","title":"使用Nuxt.js及Nuxtent建立Blog的心得","bgImageUrl":"assets/images/05/05-0.jpg","published":true,"sourceFile":"2018-06-23-NuxtjsAndNuxtent.md"},{"route":"/blog/2018-08-12-ExampleOfPromise","title":"從範例講解Promise概念","bgImageUrl":"assets/images/06/06-0.jpg","published":true,"sourceFile":"2018-08-12-ExampleOfPromise.md"},{"route":"/blog/2018-09-07-TutorialOfDraxtjs","title":"draxt.js-簡化存取檔案的小幫手","published":true,"sourceFile":"2018-09-07-TutorialOfDraxtjs.md"},{"route":"/blog/2018-10-31-ModulePattern","title":"談談JavaScript Module part1","bgImageUrl":"assets/images/08/08-0.jpg","published":true,"sourceFile":"2018-10-31-ModulePattern.md"},{"route":"/blog/2018-12-23-ModulePatternPart2","title":"談談JavaScript Module part2","bgImageUrl":"assets/images/08/08-0.jpg","published":true,"sourceFile":"2018-12-23-ModulePatternPart2.md"},{"route":"/blog/2019-02-20-CreateLibraryWithAngular","title":"於Angular中，建立Library的心得","bgImageUrl":"assets/images/10/10-0.jpg","published":true,"sourceFile":"2019-02-20-CreateLibraryWithAngular.md"},{"route":"/blog/2019-06-16-TutorialOfUppy","title":"Uppy - 最方便的上傳套件","bgImageUrl":"assets/images/11/11-0.jpg","published":true,"sourceFile":"2019-06-16-TutorialOfUppy.md"},{"route":"/blog/2019-09-01-TutorialOfVscodeExtension","title":"VSCode Extension的開發心得","bgImageUrl":"assets/images/12/12-0.jpg","published":true,"sourceFile":"2019-09-01-TutorialOfVscodeExtension.md"},{"route":"/blog/2019-11-30-SvgAndAngular","title":"SVG與Angular","bgImageUrl":"assets/images/13/13-0.jpg","published":true,"sourceFile":"2019-11-30-SvgAndAngular.md"},{"route":"/blog/2020-03-13-classValidatorAndNgxDynamicFormBuilder","title":"class-validator & ngx-dynamic-form-builder","published":true,"sourceFile":"2020-03-13-classValidatorAndNgxDynamicFormBuilder.md"},{"route":"/blog/2020-07-05-AngularLibrary","title":"6個推薦的Angular Library","bgImageUrl":"assets/images/15/15-0.jpg","published":true,"sourceFile":"2020-07-05-AngularLibrary.md"},{"route":"/blog/2020-08-03-BuildBlogUsingScully","title":"使用 Angular Static Generator - Scully 建立Blog的心得記錄","bgImageUrl":"assets/images/15/15-0.jpg","published":true,"sourceFile":"2020-08-03-BuildBlogUsingScully.md"},{"route":"/blog/2020-09-05-IntroducingDailyDev","title":"daily.dev - 整合各個技術文章的好用套件","bgImageUrl":"assets/images/17/17-0.jpg","published":true,"sourceFile":"2020-09-05-IntroducingDailyDev.md"},{"route":"/blog/2021-02-07-ExpressjssWithTypescript","title":"使用TypeScript建立Express.js","bgImageUrl":"assets/images/18/18-0.png","published":true,"sourceFile":"2021-02-07-ExpressjssWithTypescript.md"},{"route":"/blog/2021-04-24-AirtableAsDatabase","title":"將AirTable做為資料庫的心得","bgImageUrl":"assets/images/19/19-0.jpg","description":"開始寫自已的 Side Project 時，尋找了一些解決方案，發現AirTable符合我的需求","published":true,"sourceFile":"2021-04-24-AirtableAsDatabase.md"},{"route":"/blog/2021-06-12-AirTableWithDotnetCore","title":"將AirTable做為資料庫的心得 - .NET Core 篇","bgImageUrl":"assets/images/20/20-0.jpg","description":"尋找了一些解決方案，發現AirTable符合我的需求","published":true,"sourceFile":"2021-06-12-AirTableWithDotnetCore.md"},{"route":"/blog/2021-08-07-Codewars","title":"CodeWars - Coding Challenge Site","bgImageUrl":"assets/images/20/20-0.jpg","description":"可以練習平常很少接觸的題目，也可以練習演算法，並且除了 CodeWars 之外，還有其他的程式練習網站","published":true,"sourceFile":"2021-08-07-Codewars.md"},{"route":"/blog/2021-09-20-NetlifyFunctionTutorial","title":"Netlify functions 初體驗記錄","bgImageUrl":"assets/images/22/22-0.jpg","published":true,"sourceFile":"2021-09-20-NetlifyFunctionTutorial.md"},{"route":"/blog/2021-12-09-TutorialOfTsdx","title":"tsdx - 快速建立 npm 套件樣板的CLI工具","bgImageUrl":"assets/images/23/23-0.jpg","description":"快速建立 npm 套件，所以在 GitHub 上尋找有沒有方便的套件，結果發現到了 tsdx，這個方便的 CLI 工具","published":true,"sourceFile":"2021-12-09-TutorialOfTsdx.md"},{"route":"/blog/2022-05-20-WindowTeminalAndOhMyPosh","title":"我的Terminal 設定方式 - Windows Terminal & ohmyposh","bgImageUrl":"assets/images/24/24-0.jpg","description":"Windows Terminal 整合 cmd、PowerShell，並可以自定樣式，但是還是希望和 oh my zsh一樣，可以顯示更多資訊，直到最近發現 ohmyposh可以讓 PowerShell 更好用","published":true,"sourceFile":"2022-05-20-WindowTeminalAndOhMyPosh.md"},{"route":"/blog/2022-09-08-AngularTypeform","title":"Angular TypeForm - 強型別Form的心得","bgImageUrl":"assets/images/25/25-0.jpg","description":"Angular v14 中最重要的 2 個功能，除了 Single Component 之外，就是 Typeform 了，而 Typeform 也就是在建立 Form 功能時，終於可以套用型別，方便開發及除錯，是期待很久的功能","published":true,"sourceFile":"2022-09-08-AngularTypeform.md"},{"route":"/blog/2023-02-06-Slidev","title":"建立簡報的工具 - Slidev 的介紹","bgImageUrl":"assets/images/26/26-0.jpg","description":"Slidev 是很好使用的工具，搭配 VSCode Exntension ，能快速輕鬆建立起簡報。而簡報所需的功能都有具備","published":true,"sourceFile":"2023-02-06-Slidev.md"},{"route":"/blog/2023-05-24-ExpressjsTypescriptTsed","title":"使用TypeScript建立Express.js-使用Ts.ED","bgImageUrl":"assets/images/27/27-0.jpg","description":"Ts.ED 是一個強大且易於使用的 framework，可以將 TypeScipt 與 Express.js整合，並使用 Controller 的方式建立 Express.js","published":true,"sourceFile":"2023-05-24-ExpressjsTypescriptTsed.md"},{"route":"/blog/2023-08-27-AngularOnChanges","title":"Angular判斷 DOM Render 是否完成","bgImageUrl":"assets/images/28/28-0.jpg","description":"使用 `ngOnChanges` 及`ngAfterViewChecked`這 2 個生命週期來判斷 DOM Render 是否完成","published":true,"sourceFile":"2023-08-27-AngularOnChanges.md"},{"route":"/blog/2023-12-29-TurorialOfCommnadLine","title":".NET 好用套件 - commandline","bgImageUrl":"assets/images/29/29-0.jpeg","description":"好用的套件 commandline，解析 CLI 參數，並使用Attribute來設定options","published":true,"sourceFile":"2023-12-29-TurorialOfCommnadLine.md"},{"route":"/blog/2024-07-14-FirtstStepBulma","title":"Bulma的初體驗","bgImageUrl":"assets/images/30/30-0.jpg","description":"Bulma 確實是一個非常直觀且方便使用的 CSS 框架。它的開發者體驗（DX）優秀，對比 Bootstrap 有著更為簡潔的語法和設計。特別是在排版和元件設定方面，Bulma 可以來試試看","published":true,"sourceFile":"2024-07-14-FirtstStepBulma.md"}]