使用「Markdown」簡易的語法表達出複雜的HTML文件

-

一、介紹

Markdown 是一種標記語言，它的主要目的是用來作為網路的「寫作用語言」，不是取代 HTML。
Markdown 的重點在於讓文件更「易讀易寫」，因此Markdown只涵蓋純文字可涵蓋的範圍。Markdown 詳細介紹與語法可參考Markdown 台灣網站。

二、dillinger

dillinger 即時將「Markdown」語言編譯成「HTML」的線上工具。

圖一、左邊為 Markdown 語法，右邊為對應的HTML文件

 
圖二、Markdown與HTML對比

三、參考連結

  1. Markdown 台灣網站
  2. dillinger 網站

四、總結

如果需要大量撰寫文件的需求可以考慮使用 Markdown ，它讓你可以編寫的更快速且易閱讀。

留言

張貼留言

這個網誌中的熱門文章

使用「Visual Studio 2019」建置 Windows 服務

-
圖片
一、開發環境 整合開發環境：Visual Studio 2019 語言：C# .net framework：4.6.2 二、建置 Windows 服務專案 圖、開啟 Visual Studio 2019 ，點 建立新的專案 圖、選擇 Windows 服務(.net framework) 圖、輸入相關資訊 圖、選擇 Service1.cs > 滑鼠右鍵 > 檢視原始碼，即可看到 Windows 服務 起初的原始碼 圖、對 專案 > 滑鼠右鍵 > 重建，即可在 bin 資料夾底下見到建置好的結果 三、登錄 Windows 服務 圖、輸入登錄指令 指令 sc create 服務名稱 binpath=D:\服務路徑\XXX.exe start=auto 圖、Windows 服務畫面即可看到剛剛的服務 四、相關連結 使用「SC」指令 登錄、刪除 Windows 服務 五、參考 sc 指令
閱讀完整內容

「Katalon Recorder」簡化測試腳本撰寫的工具

-
圖片
一、介紹 「Katalon Recorder」 是一款錄製 Web UI 測試 工具，安裝於 Chrome、FireFox 瀏覽器。 Katalon Recorder 錄製瀏覽器的操作過程，並可產生 C#, Java, Python 的測試原始碼，讓工程師更易撰寫 WEB UI 測試。 此文章將介紹使用 Katalon Recorder 錄製腳本，並把腳本移至 Visual Studio 2019 做單元測試。 二、腳本內容 開啟 Google 搜尋關鍵字 測試 ，檢視第二筆搜尋結果的描述是否為 「這是一個根據弗洛伊德焦慮類型理論…」 。 三、 Nuget 套件 MSTest.TestAdapter ( 測試專案預設會安裝 ) MSTest.TestFramework ( 測試專案預設會安裝 ) Selenium.WebDriver Selenium.WebDriver.ChromeDriver 四、教學步驟 圖一、安裝套件。 圖二、 Chrome 瀏覽器安裝 Katalon Recorder 。 圖三、開啟 Katalon Recorder ( 注意右上角的 ICON ) 圖四、開始錄製腳本 圖五、操作瀏覽器(此時 Katalon Recorder 就會錄製腳本) 圖六、停止錄製 圖七、產生 C# 程式碼 圖八、將程式碼貼到 測試專案 圖九、將 FirefoxDriver 改成 ChromeDriver ，讓單元測試使用 Chrome 瀏覽器。 圖十、執行 測試 。 圖十一、測試結果。 四、相關連結 Selenium 前端 UI 自動化測試、爬蟲程式 最佳利器 五、參考 Katalon Recorder Katalon Recorder 下載 ( Chrome 擴充功能 )
閱讀完整內容

在Visual Studio 2019 使用 Subversion 的客服端工具「AnkhSVN2019」

-
圖片
前言 使用 Subversion 版控，大多數是使用客服端工具 TortoiseSVN ，如果開發人員的IDE 是使用 Visual Studio 2019 則可考慮使用 AnkhSVN2019 。 安裝 圖、延伸模組 > 管理延伸模組 圖、下載 AnkhSVN2019 圖、按下 關閉 圖、關閉 Visual Studio 2019 圖、安裝 圖、按下 Modify 操作步驟 圖、檢視 > Repository Explorer 圖、新增 SVN Server 圖、輸入網址 圖、按下 Checkout from Subversion 圖、輸入 To Path 圖、下載中 圖、開啟資料夾 > 按下 XXX.sln 圖、工具 > 選項 圖、Source Control > 選擇 AnkhSVN2019 圖、跑出 Pending Changes 圖、修改檔案 > 滑鼠右鍵 > Open in Visual Studio 圖、結果 相關連結 使用「Visual Studio 2019」建置一個有 Mvc 和 Web Api 架構的網站 「Git」基礎操作 「Git」安裝 參考 subversion tortoisesvn AnkhSVN2019
閱讀完整內容

使用「LINE Messaging API」發送 line 訊息

-
圖片
一、介紹 LINE 是由LINE株式會社所開發的即時通訊平台，也是目前台灣目前最高使用率的社群平台。 二、登入 LINE console 圖、打開瀏覽器，進到 LINE Developers Console 登入頁 三、建立 Provider 和 Channel 圖、按下 Create ，輸入 Provider name ，再按下 Create 圖、按下 Create a Message API Channel 圖、輸入 Channel name 圖、Channel 資訊 四、webhook 每當LINE用戶加您的 Channel 為好友或是發送訊息，LINE平台透過 HTTP POST 發送 webhook 事件資訊 至您 LINE Developers Console 中所指定的 webhook URL 。 圖、點 Messaging API ，往下拉即可看到 webhook 相關設定 webhook 事件資訊 webhook 事件資訊為JSON格式的資料 點 webhook 的 Verify 按鈕，則會收到如下格式的 webhook 事件資訊。 圖、Verify 按鈕 {“events”:[],“destination”:“XXX”} 被加入好友，則會收到如下格式的 webhook 事件資訊。 {“events”:[{“type”:“follow”,“replyToken”:“XXX”,“source”:{“userId”:“XXX”,“type”:“user”},“timestamp”:XXX,“mode”:“active”}],“destination”:“XXX”} 其中 userId 為 加入您好友的用戶ID，此ID會使用於發送訊息。 發送訊息時，則會收到如下格式的 webhook 事件資訊。 {“events”:[{“type”:“message”,“replyToken”:“XXX”,“source”:{“userId”:“XXX”,“type”:“user”},“timestamp”:XXX,“mode”:“active”,“message”:{“type”:“sticker”,“id”:“XXX”,“stickerId”:“XXX”,“packageId”:“XXX”,“stic...
閱讀完整內容

好用的資料庫管理工具「SQL Server 資料庫專案」

-
圖片
一、前言 專案隨著時間推進，維護的過程中會不斷的增加資料表、修改資料表的結構…等，以前筆者習慣把資料庫修改歷程 寫成 Sql，但使用了 SQL Server 資料庫專案 就不用這麼麻煩的記錄修改歷程的 Sql。 二、開發環境 整合開發環境：Visual Studio 2019 三、運用情境 圖、兩個資料庫 Test 、 Test1 ，要把 Test 的資料庫結構更新到 Test1 四、建置資料庫專案 圖、建議一個新專案 > 選擇 SQL Server 資料庫專案 圖、輸入相關資訊 五、更新資料庫 圖、 SQL Server 資料庫專案 滑鼠右鍵 > 結構描述比較 > 按下 切換來源和目標 圖、按下 選取來源 圖、按下 選取連線 圖、輸入相關資訊，選擇 來源資料庫 ，以情境來說就是 資料庫 Test 圖、按下 比較 圖、按下 更新 圖、按下 切換來源和目標 圖、按下 選取目標 圖、輸入相關資訊，選擇 目標資料庫 ，以情境來說就是 資料庫 Test1 圖、按下 比較 圖、按下 更新 圖、 更新 完成 圖、執行結果 六、相關連結 使用「Visual Studio 2019」建置一個有 Mvc 和 Web Api 架構的網站 使用「CsvHelper」讀取、寫入 CSV 檔案 好用的資料庫管理工具「SQL Server 資料庫專案」 「NLog」與「Sql Server」資料庫的完美搭配 使用「ADO.NET」 進行資料庫的讀取、新增、修改、刪除的操作 使用「Entity Framework Tools」建立資料庫關聯模型 https://weitechshare.blogspot.com/2020/12/code-first.html 使用「SqlBulkCopy」進行大量資料寫入 「linqkit」動態組裝 LINQ 條件的好用套件 「Dapper」一個高效率輕量型 ORM 套件
閱讀完整內容

「Windows 認證管理員」修改 Bonobo Git Server 的 Git 帳號、密碼

-
圖片
一、開發環境 整合開發環境：Visual Studio 2019 二、情境 當使用 Git 無法 push、fetch…等，有可能是因為你的 Git 認證 修改帳號、密碼。此時可使用 Windows 認證管理員 修改你的 Git 帳號、密碼。 圖、情境 三、操作步驟 圖、開啟 認證管理員 圖、選擇 windows認證 圖、展開 git認證 > 編輯 圖、修改 帳號 、 密碼 > 儲存 圖、同步即可成功 四、相關連結 「Git」安裝 「Git」基礎操作 「Bonobo Git Server」安裝
閱讀完整內容

使用「Google API Console」取得 OAuth 2.0 client credentials

-
圖片
一、介紹 本文章將會介紹如何使用「Google API Console」取得 OAuth 2.0 client credentials。 二、OAuth 2.0 「OAuth 2.0」 是一個開放標準，允許使用者讓第三方應用程式取得該使用者在某個應用程式上的資訊，無須取得該用戶的密碼、帳號。 三、教學步驟 圖一、使用瀏覽器進到 Google API Console 圖二、點選 憑證 後再點選 建立專案 圖三、輸入 專案名稱 ，再點選 建立 圖四、點選 OAuth 同意畫面 ，點選 外部 ，點選 建立 圖五、輸入 應用程式名稱 、 使用者支援的電子郵件 、 電子郵件地址 ，點選 儲存並繼續 圖六、點選 儲存並繼續 圖七、點選 儲存並繼續 圖八、按下 返回資訊主頁 圖九、點選左邊選單  憑證 ，點選 建立憑證 ，點選 OAuth 用戶端 ID 圖十、應用程式類型 選擇  網頁應用程式 ，輸入 名稱 、 重新導向 URI 、按下 建立 圖十一、取得 用戶端編號 、 用戶端密碼 四、參考 Using OAuth 2.0 to Access Google APIs Google API Console OAuth 2.0 建置一個使用「FaceBook」、「Google」帳號登入的「Asp.net MVC」 網站。
閱讀完整內容

快速的套件管理工具「Yarn」

-
圖片
一、介紹 安裝 node.js 時會一同安裝 npm 套件管理工具，但用 npm 下載套件時會相當緩慢，因此 Yarn 誕生，會讓使用者減少下載套件的時間。 二、操作步驟 圖、開啟瀏覽器輸入網址 https://classic.yarnpkg.com/zh-Hant/ > 安裝 Yarn 圖、按下 下載安装程式 圖、按下 Next 圖、勾選同意 License > 按下 Next 圖、按下 Next 圖、按下 Install 圖、按下 Finish 圖、開啟 命令提攜字元 圖、輸入 yarn -v yarn -v 是看 yarn 的版本 cmd 指令 yarn -v 三、相關連結 讓 JavaScript 能在伺服器端執行的環境 「node.js」 四、參考 yarn
閱讀完整內容

「軟體三層式架構」介紹與實作

-
圖片
一、前言 專案開發前如果沒有分層概念，當專案功能越多，專案越大，則越難維護。因此筆者會依據專案架構與日後規劃而決定要不要分層，以便日後好維護與交接。 二、基本分層 圖、基本分層 Presentation Layer：展示層、最直接與使用者互動。 Business Layer：商業邏輯層。 Data Layer：資料存取層。 三、以 Asp.net MVC 和 Web Api 三層式分層 筆者近幾年公司的經驗，軟體分層大致如下圖，讀者可能依據各自公司的經驗，對分層和架構有不同的解釋與建議，因此示意圖僅供參考 圖、以 Asp.net MVC 和 Web Api 三層式分層 四、參考 ASP.NET Core Application Architecture
閱讀完整內容

「Chrome Headless」隱藏瀏覽器的介面，讓爬蟲程式偷偷的執行

-
圖片
一、介紹 延伸之前的 Selenium 的文章，此篇將介紹如何使用 Chrome Headless 搭配 Selenium 的 Hide Command ，讓爬蟲程式在看不到的情況下執行。 二、 Nuget 套件 Selenium.WebDriver Selenium.WebDriver.ChromeDriver 三、教學步驟 圖一、安裝 Selenium 套件 。 圖二、貼上範例程式 //Chrome headless 參數設定 var chromeOptions = new ChromeOptions(); chromeOptions.AddArguments("headless"); //啟用 Selenium Hide Command var driverService = ChromeDriverService.CreateDefaultService(); driverService.HideCommandPromptWindow = true; //建置 Chrome Driver var driver = new ChromeDriver(driverService, chromeOptions); //瀏覽器 轉址至 Google圖片 driver.Url = @"https://www.google.com.tw/imghp?hl=zh-TW"; //輸入關鍵字 "Selenium" var searchInput = driver.FindElementByCssSelector(@".gLFyf"); searchInput.SendKeys("Selenium"); //按下 Enter searchInput.SendKeys(OpenQA.Selenium.Keys.Enter); //抓取圖片清單 var imgTags = driver.FindElementsByTagName("img").ToList(); //取得 5張 jpeg 圖片 var images = imgTags.Select(x => x.GetAttribute("s...
閱讀完整內容