2016 年 07 月 17 日

於IDE做同儕代碼審查

原文 : Peer Code Review from IDE      by Maria Khalusova
ESAST CO LTD嵌藝創研軟體科技為JetBrains台灣經銷, JetBrains授權翻譯

IDE 是大多數人習慣在上面處理編碼的環境,在上面做修改或瀏覽編碼基底。  但我們每天例行工作不只是編碼, 還要面對許多協作活動與任務。  一般來說我們會轉到另一個工具來處理這些事, 例如我們到事件追蹤工具討論瑕疵和功能。 基本上我們把編碼與討論分開。  但是–代碼審查–是這兩樣必須並行。  本質上這是團隊的協作實踐, 但在IDE外部來處理編碼修改會讓人覺得不是很順手甚至覺得有挫折感。    

這就是為什麼Upsource兼有IDE plugin, 讓你方便從你的IDE直接參與代碼審查並做討論.  今天我將帶大家一起看plugin的功能並從你喜愛的IDE來感受一下代碼審查的整個過程.  現在就開始吧!

建立 (Setup)

事前準備:

  • 你需要安裝Upsource的伺服器:請下載UpSource  。 (UpSource 10個帳號免費)
  • 你必須使用以下其中一樣 JetBrains IDE: IntelliJ IDEA、PhpStorm、WebStorm、PyCharm、 RubyMine、AppCode、CLion 或 DataGrip。

安裝 (Installation)

要安裝plugin,請到 Preferences | Plugins, 點選 Install JetBrains plugin 並找到 Upsource Integration plugin。

設定 (Configuration)

你唯一要做的是讓你的IDE知道你的Upsource 伺服器在哪裡。 到 Preferences | Tools | Upsource 連接並輸入伺服器的URL。

不需特定的憑證。 Upsource plugin大多情況下將自動比對專案並提交。

準備好囉 !

現在看看其他:

Upsource plugin 在你的IDE加了兩個很重要的面板: News Feed 和 Reviews。

News Feed (新進訊息)

你可由Switcher (Ctrl + Tab) 連到 News Feed。

News Feed 顯示專案正發生哪些事。 系統原始設定只展示與你相關的資訊。 如有人對你寫的程式碼給意見、 有人提到你、 指定你來審查變更碼…等。  如果你想要看所有的新訊息也可以, 或只看還沒讀的新訊息.

NewsFeed.png

你可以回覆意見並從News Feed直接去參與討論。

ReplyFromNewsFeed

當你需要更多的上下文(context), 在訊息通知上點選審查ID。 你將被帶到下一個 Upsource 面板叫做Reviews,在這裡你可以看到所有相關此審查的細節。   

Reviews(審查)

你可經由Switcher (Ctrl + Tab)Reviews 。

原始設定 Reviews 面板會顯示需要你照顧的代碼審查資訊。  你可採用下拉式篩選或搜尋箱來找到此專案的其他審查資訊。

ReviewsToolWindow

你也可以針對任何特定的代碼審查獲得更多資訊: 誰有參與?  加了哪些版本? 做了哪些修改? 有哪些正在進行的討論? ….等等。

ReviewDetails

現在讓我們來看簡單的代碼審查情境,了解你從IDE可以如何操作。

要求你的團隊夥伴審查你的變更

你剛剛解完一個bug, 正要交付你的變更。 這個時候,你可在交付的對話框要求你的同事審查你的變更。

CommitDialog

一旦變更被推上貯存庫(repository),一個代碼審查將被新增。

當你的同事寫下意見或更新審查, 你將馬上收到通知。

IDE-notification

點選通知後將跳到審查頁面(review)。  從這裡你將被導覽到編輯器上的或兩邊版本內容對照(side-by-side diff)的意見(comment)。

side-by-side-comment

如果你的同事已指出你需要注意的問題,你可如你開始這審查一樣將修改新增到一個審查(review)  – 交付修改時選擇“Attach to review” 。

審查別人的變更

如果有人指定你審查變更, 你將馬上收到通知。

invitation-to-review

點選此連結到審查(Reviews)的畫面, 你將看到所有需要的資訊和動作。

Upsource Integration plugin讓你可提出(check out)最近的版本(revisions),確認你審查的是相關的變更。

latestRevision

你可在編輯器或在版本差異(diff view)上留下意見 。

CommentsInADiff

當你完成審查, 請點選Accept (看過一切都沒問題) 或 提出你的問題 (當你發現有什麼問題, 或有些事不清楚需要釐清) , 讓你審查的代碼作者知悉你已經審查過他的變更。

Accept

你還能用plugin做什麼呢?

如果你安裝了 Upsource integration plugin, 你將很容易地把你任何一段代碼的連結分享給你的團隊夥伴。  請參考我們最近分享的另一篇文章 : The Ultimate Way of Sharing Code 。

你可以在還沒開始一個代碼審查前在代碼旁留下你的意見,也許你有個問題, 希望代碼的作者能釐清一兩點不清楚的地方, 或你發現問題、 或你偶然發現優雅的解法、或是想給這作者一個讚, 怎麼做呢? 選擇這段代碼(請注意這可任意選擇), 然後從此執行環境的選單(context menu)點選Upsource | Leave a comment.  Upsource將進一步回報你代碼的作者:

leaveComment

希望你覺得這篇很有用,學到新的好方法 !

Upsource Integration plugin 能配合任何 JetBrains IDE 。 如果你採用別的 IDEs  你仍可運用Upsource的 Web UI 享用代碼審查, 利用IDE等級的觀點洞察, 且在你喜歡的瀏覽器導覽。

你可能會有興趣

覺得這篇文章有用嗎?  將很感謝您的分享 !

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com Logo

您的留言將使用 WordPress.com 帳號。 登出 / 變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 登出 / 變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 / 變更 )

Google+ photo

您的留言將使用 Google+ 帳號。 登出 / 變更 )

連結到 %s

分類

03-JetBrains, UpSource