「SonarLint」程式碼品質最佳利器

-

一、前言

筆者工作的經驗常接手維護先前的專案，因公司以前未導入程式碼品質工具，較容易遇到不易閱讀的程式碼和較特殊的語法。為了日後讓大家撰寫程式能盡量一致、好閱讀，因此引入程式碼品質工具 SonarLint，SonarLint 提供程式碼的建議和規範，讓新進員工或老員工能有較一致的程式碼寫法。

二、開發環境

  • 整合開發環境：Visual Studio 2019
  • 語言：C#
  • .net framework：4.6.2

三、SonarLit for Visual Studio 2019 安裝

圖、延伸模組 > 管理延伸模組

圖、選擇 SonarLit for Visual Studio 2019  > 下載

圖、安裝前先關閉 SonarLit for Visual Studio 2019，再安裝

圖、安裝後SonarLit for Visual Studio 2019 會有 SonarLit 的提示

四、安裝前後的比較

圖、安裝前後的比較

五、相關連結

  1. 使用「Visual Studio 2019」建置一個有 Mvc 和 Web Api 架構的網站
  2. 「軟體三層式架構」介紹與實作
  3. 使用「Visual Studio 2019」建置單元測試專案

留言

張貼留言

這個網誌中的熱門文章

使用「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 指令
閱讀完整內容

使用「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...
閱讀完整內容

「綠界(Ecpay)」金流介接教學

-
圖片
一、介紹 綠界科技Ecpay 是第三方支付，提供金流、信用卡代收代付的服務。 二、開發工具 整合開發環境：Visual Studio 2019 語言：C# .net framework：4.6.2 三、綠界測試資訊 此教學只提供綠界測試環境，正式環境請參考 完整版-全方位金流API技術文件 1. 測試後台 網址： https://vendor-stage.ecpay.com.tw 特店編號：2000132 廠商管理後台登入帳號：stagetest1234 廠商管理後台登入密碼：test1234 身分證件末四碼/統一編號：53538851 HashKey：5294y06JbISpM5x9 HashIV：v77hoKGq4kWxNNIS 2. 測試信用卡 卡號：4311-9522-2222-2222 安全碼：222 信用卡測試有效月/年：MM/YYYY 值請大於現在當下時間的月/年 四、登入綠界測試後台 圖、開啟 https://vendor-stage.ecpay.com.tw ，輸入測試帳號 stagetest1234 ，按下 繼續 圖、輸入測試帳號、密碼後，在按 登入 圖、按 一般訂單查詢 ，按 全方位金流訂單 ，即可查詢 訂單資訊 五、範例程式碼 C# MVC的範例，有 產生訂單、取得訂單資訊、取得虛擬帳號 …等功能。 /// <summary> /// MVC Controller /// </summary> public class EcpayController : Controller { /// <summary> /// 取得付款資訊 /// </summary> /// <param name="id"></param> /// <returns></returns> public ActionResult PayInfo(string id) { var cache = MemoryCache.Default; var cacheData = cache.Get(id); ...
閱讀完整內容

如何傳送訊息至「Teams」的 Channel

-
圖片
一、介紹 Microsoft Teams 為微軟旗下的通訊軟體，它整合聊天、視訊、Office 365、Execel、Word、OneNote…等功能。 比爾蓋茲提出 Skype for Business 的想法，因此有了 Microsoft Teams 這個產品，為了與 Slack…等商用軟體相抗衡。 二、 Nuget 安裝 Newtonsoft.Json 12.0.3 三、Incoming WebHook 設定 訊息可藉由 Teams 的應用程式 Incoming WebHook 傳輸訊息 圖、點擊 … > 搜尋 Incoming WebHook > 點擊 Incoming WebHook 圖、點擊 新增至團隊 圖、選擇 你的頻道 > 點擊 設定連結器 圖、輸入 WebHook 名稱 > 點擊 建立 圖、複製 WebHook Url > 點擊 完成 四、操作步驟 圖、貼上範例碼，修改成你的 WebHook Url，執行後即可在 Teams 看到 測試訊息 的訊息 範例碼 using (var wc = new WebClient()) { wc.Headers.Add("Content-Type", "application/json"); var data = new { text = "測試訊息" }; var jsonStr = JsonConvert.SerializeObject(data); var bytes = System.Text.Encoding.UTF8.GetBytes(jsonStr); var res = wc.UploadData("https://你的 WebHook Url", bytes); Console.WriteLine(System.Text.Encoding.UTF8.GetString(res)); } 圖、執行結果 五、相關連結 使用「Visual Studio 2019」建置 主控台 Console 應用程式 使用「LINE Messaging API」發送 line 訊息 ...
閱讀完整內容

如何取得 FaceBook 的「應用程式編號」、「應用程式密鑰」。

-
圖片
一、介紹 本文章將會介紹如何取得 FaceBook 的「應用程式編號」、「應用程式密鑰」。 二、OAuth 2.0 「OAuth 2.0」 是一個開放標準，允許使用者讓第三方應用程式取得該使用者在某個應用程式上的資訊，無須取得該用戶的密碼、帳號。 三、取得FaceBook的「應用程式編號」、「應用程式密鑰」 圖一、使用瀏覽器進入到 facebook developer ，點選 下一步 圖二、輸入 電話號碼 、 確認碼 圖三、點選 開發人員 圖四、點選 建立首款應用程式 圖五、選取 管理企業管理工具 ，再點選 繼續 圖六、輸入 應用程式顯示名稱 、應用程式用途選取 你自己或你的商家 、再點選 繼續 圖七、點選 提交 圖八、FaceBook 登入選擇 設定 圖九、選擇左邊選單的 設定 圖十、輸入 有效的 OAuth 重新導向 URI 圖十一、點選 設定 > 基本資料 ，即可取得 應用程式編號 、 應用程式密鑰 三、取得FB的「存取權杖工具 」 圖一、點選 上方 工具 ，再點選 存取權杖工具 圖二、取得FaceBook應用程式的 存取權杖工具 四、參考 facebook developer OAuth 2.0 facebook 存取權杖 建置一個使用「FaceBook」、「Google」帳號登入的「Asp.net MVC」 網站。
閱讀完整內容

使用「Line-Notify」發送 line 訊息

-
圖片
一、介紹 LINE 是由LINE株式會社所開發的即時通訊平台，也是目前台灣目前最高使用率的社群平台。 二、操作步驟 圖、打開瀏覽器，進到 LINE Notify 登入頁 圖、輸入 帳號 、 密碼 圖、進入 個人管理頁面 圖、選擇 透過1對1聊天透過 Notify的通知 圖、複製 權杖 圖、複製 底下的原始碼 原始碼 using (var wc = new WebClient()) { var bearer = $"你的權杖"; wc.Encoding = Encoding.UTF8; wc.Headers.Add("Content-Type", "application/x-www-form-urlencoded"); wc.Headers.Add("Authorization", $"Bearer {bearer}"); var nv = new NameValueCollection(); nv["message"] = "Test"; var bResult = wc.UploadValues($"https://notify-api.line.me/api/notify", nv); var res = Encoding.UTF8.GetString(bResult); } 圖、執行結果 三、參考 LINE Notify 登入頁 LINE notify api 使用「Visual Studio 2019」建置 主控台 Console 應用程式
閱讀完整內容

使用「NLog」來記錄應用程式的大小事吧

-
圖片
一、介紹 NLog 是 .net 下的日誌套件，因為只要一句程式碼即可紀錄日誌，因此筆者常使用它記錄應用系統的錯誤、資訊…等。 二、開發環境 整合開發環境：Visual Studio 2019 語言：C# .net framework：4.6.2 三、 Nuget 安裝套件 NLog NLog.Config NLog.Schema 圖、套件清單 四、操作步驟 圖、修改 NLog.config 的 target 、 logger 元素 NLog.config 設定 < targets > < target xsi:type = "File" name = "f" fileName = "${basedir}/logs/${shortdate}.log" layout = "${longdate} ${uppercase:${level}} ${message}" /> </ targets > < rules > < logger name = "*" minlevel = "Debug" writeTo = "f" /> </ rules > 圖、使用 nlog 原始碼 c# public void LogTest() { var log = LogManager.GetCurrentClassLogger(); log.Info($"Test"); } 圖、執行後結果 五、相關連結 「NLog」與「Sql Server」資料庫的完美搭配 六、參考 NLog Tutorial NLog Nuget
閱讀完整內容

使用「ADO.NET」 進行資料庫的讀取、新增、修改、刪除的操作

-
圖片
一、前言 ADO.NET 是微軟旗下用來連接 資料來源 (例如 Sql Server、XML…等)，並且可以讀取、新增、修改、刪除其中資料的技術。而後 微軟以 ADO.NET 為基礎 推出 Entity Framework ，以筆者的經驗來說，新的專案較常使用 Entity Framework ，但舊的專案則使用 ADO.NET ，因此為了方便記憶而撰寫文章。 二、開發環境 整合開發環境：Visual Studio 2019 語言：C# .net framework：4.6.2 三、範例資料庫 圖、範例資料庫 四、讀取 範例皆使用 參數型 方式操作資料庫，避免 Sql Injection 問題。 圖、範例程式碼 原始碼(C#) var cs = WebConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString; using (var sc = new SqlConnection(cs)) { sc.Open(); var cc = sc.CreateCommand(); cc.CommandText = $@"SELECT [a1],[a2] FROM [Test] where [Seq] = @Seq"; cc.Parameters.AddWithValue("@Seq", "1"); var ret = string.Empty; var reader = cc.ExecuteReader(); while (reader.Read()) { ret = $"a1={reader[0]}，a2={reader[1]}"; } reader.Close(); return ret; } 圖、執行結果 五、新增 範例皆使用 參數型 方式操作資料庫，避免 Sql Injection 問題。 圖、範例程式碼 原始碼(C#) var cs = WebConfigurationManager.ConnectionStrings[...
閱讀完整內容

「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 擴充功能 )
閱讀完整內容

開源的前端打包工具「Webpack」

-
圖片
一、介紹 Webpack 是一個前端模組打包工具，在 nodejs 的環境下運行，打包和最佳化 JavaScript 或其他資源 供瀏覽器使用。 二、工具 node.js Yarn 三、 Visual Studio 2019 專案架構 圖、 Visual Studio 2019 圖、資料夾目錄 四、安裝 Webpack 圖、開啟 命令提攜字元 圖、切換目錄至你的專案資料夾 指令 cd D:\XXX\ 圖、初始化目錄 指令 npm init 圖、安裝 Webpack 指令 yarn add webpack webpack-cli 圖、安裝 glob 指令 yarn add glob 五、操作步驟 圖、新增 main.js 檔案 原始碼 const path = require ( 'path' ); const glob = require ( 'glob' ); module .exports = { entry: glob.sync( "./Src/Js/**/*.js" ), output: { filename: '[name].js' , path: path.resolve(__dirname, '../Content/Target/Js' ), }, }; 圖、新增 test.js 檔案 原始碼 console .log( "a" ); 圖、開啟 package.json 檔案 package.json 由 yarn 產生，可以拉至專案內。 圖、修改 package.json 的 scripts 區段，新增 dev 、 build json "dev": "webpack --watch --mode development --config .\\Src\\main.js", "build": "webpack --mode development --config .\\Src\\main.js" ...
閱讀完整內容