Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Riderはいいぞ!

 Riderはいいぞ!

2019/10/27(日)に開催された.NET Conf in Tokyo 2019の「Riderはいいぞ!」の発表資料です。

RyotaMurohoshi

October 27, 2019
Tweet

More Decks by RyotaMurohoshi

Other Decks in Technology

Transcript

  1. Riderはいいぞ!
    @RyotaMurohoshi
    2019/10/27(日) .NET Conf in Tokyo 2019

    View full-size slide

  2. 「なんか最近Riderって言うのをよく聞くぞ?」
    「Riderに興味があるぞ・・・」
    「Riderがいい感じらしい、どんな感じにいいの!?」
    今日はそんなUnityプログラマのみなさんに
    Riderが使ってみたくなるような紹介セッションをします

    View full-size slide

  3. 突然ですが問題です!

    View full-size slide

  4. 問題1
    このコードの良くないところはどこでしょう?

    View full-size slide

  5. 答え1
    monstersが空かどうかの判定に、Count()を使っている
    IEnumerableだから、Any()を使うべき

    View full-size slide

  6. こう書くとGood!

    View full-size slide

  7. C#に慣れている人にはおなじみだけど
    初めてC#をやる人には「わかりにくい改善ポイント」

    View full-size slide

  8. さらにもう一問!

    View full-size slide

  9. 問題2
    このコードの良くないところはどこでしょう?

    View full-size slide

  10. 答え2
    transform.positionはそこそこ負荷が重い処理
    transform.positionに連続してアクセスするなら
    一度ローカル変数に格納すべき

    View full-size slide

  11. こう書くとGood!

    View full-size slide

  12. C#に慣れていても、Unityに慣れていないと
    なかなか気づけない「わかりにくい改善ポイント」

    View full-size slide

  13. 大丈夫、そう
    Rider
    なら!

    View full-size slide

  14. Riderならこういう「わかりにくい改善ポイント」
    を指摘してくれ、「ポチッとな」で改善できる!

    View full-size slide

  15. 自己紹介・Riderの概要

    View full-size slide

  16. 自己紹介

    View full-size slide

  17. ● @RyotaMurohoshi(むろほし)
    ● Rider : 趣味ゲーム開発
    ● WebStorm : お仕事はウェブフロント
    ● Android Studio : 元Androidアプリ開発者
    ● お仕事でも、趣味でも、JetBrains IDE!

    View full-size slide

  18. Rider、WebStorm、IntelliJ IDEAは
    JetBrainsの有償IDEです
    Android Studio(無料)も
    JetBrainsのIntelliJ IDEAがベースです

    View full-size slide

  19. JetBrainsはチェコにある
    ReSharper、dotPeekなどの.NETツール、そして
    Rider、IntelliJ IDEA、WebStorm、GoLand、
    PyCharm、RubyMineなどの様々なIDEを作っている会社

    View full-size slide

  20. IntelliJ IDEAとReSharper、どちらも長い歴史を持つ
    二つをベースにしてRiderが生まれました
    IDEとしての使い方は他のJetBrains IDEと同じ感じに使える
    リファクタリングなどはReSharperと同じものが使える
    ここら辺の話は、 https://blog.jetbrains.com/jp/2018/11/08/1460

    View full-size slide

  21. Riderは
    Cross Platform IDEです
    Windows、macOS、Linuxに対応!

    View full-size slide

  22. RiderはUnityサポートが手厚いです!

    View full-size slide

  23. このセッションで言いたいこと

    View full-size slide

  24. C#やUnityを今から始める人・最近始めた人こそ、
    Rider

    いいぞ!

    View full-size slide

  25. C#やUnityを教える立場の人も
    Rider

    いいぞ!

    View full-size slide

  26. 皆さんの同僚、チームメンバー、メンティーは
    Riderが教えてくれるUnity・C#の書き方を
    知らないかもしれない
    ぜひあなたの代わりに、Unity・C#を教えてもらいましょう

    View full-size slide

  27. Riderの機能紹介

    View full-size slide

  28. デモ
    おさらい

    View full-size slide

  29. Rider/ReSharperは
    一部の人からこう呼ばれています

    View full-size slide

  30. 赤ぺ●先生

    View full-size slide

  31. 「ここはよくないよ」って教えてくれて
    「こうするといいよ」っていうコードに書き換えてくれる

    View full-size slide

  32. Code Inspections と
    Quick Fix

    View full-size slide

  33. Code Inspections
    静的コード解析によりコードの課題を検出

    View full-size slide

  34. Code Inspectionsは
    いろいろな理由で指摘してくれる
    ● Language Usage Opportunities : 新しい言語機能が使える箇所
    ● Potential Code Quality Issues :エラーや警告の理由になりそう
    ● Redundancies in Code : 到達しないコードとか不必要なコード
    ● Spelling Issues : タイポ

    View full-size slide

  35. Code Inspectionsのレベル
    ● エラー : コンパイルエラーやエラーを引き起こすもの
    ● 警告 : コンパイラの警告。不要なもの、冗長なもの、よくないもの
    ● 提案 :「 間違ってはいないけど、もっと良くなる」に対する提案
    ● ヒント: 特定のコードの詳細に注意を促し、改善方法を推奨

    View full-size slide

  36. Code Inspections
    は、ただ「ここが間違っている!」ってだけじゃなくて
    なんで間違えているかも教えてくれる!
    (詳細理由を載せてるWebページを開いてくれる)

    View full-size slide

  37. Option + Enter / Alt + EnterでAction Listを表示
    「Why is Rider suggesting this?」を選択で解説ウェブページへ

    View full-size slide

  38. Code Inspectionsは
    ソリューション全体や特定のスコープにも!

    View full-size slide

  39. Option + Enter / Alt + EnterでAction Listを表示
    「Find similar in file」で似たような問題がないか指定のスコープで探索

    View full-size slide

  40. Solution-Wide Analysis
    Solution全体のエラーや警告を見つけ、一覧表示してくれる

    View full-size slide

  41. Preference | Editor | Inspection Settingsから。警告も有効にできる。

    View full-size slide

  42. 警告レベルInspectionも有効にするとどっさり出てくる。

    View full-size slide

  43. Solution-Wide Analysisは
    ソリューション全体を分析
    コード配布形式のアセットなども対象
    ※設定で任意のディレクトリを無視することは可能

    View full-size slide

  44. Inspect Codeでソリューション全体じゃなくて、
    対象を指定してインスペクションもできる

    View full-size slide

  45. Code | Inspect Code...

    View full-size slide

  46. スコープを指定

    View full-size slide

  47. 指定スコープのインスペクション結果がずらり

    View full-size slide

  48. Run Inspection by Name...
    特定のインスペクション項目のみを探す
    (例えば「このコミットでこのWarning全部直したい!だから探したい!」ってときに便利)

    View full-size slide

  49. Code | Run Inspect by Name...

    View full-size slide

  50. Inspectionの説明を入力、フィルタリング、探したいインスペクションを選択

    View full-size slide

  51. 対象がずらり

    View full-size slide

  52. 次の話題

    View full-size slide

  53. Quick Fix
    さくっと手早くコードを修正

    View full-size slide

  54. Code Inspectionsで指摘された問題点をさくっと修正
    キーボードショートカットでも、マウスからでも

    View full-size slide

  55. Code Inspectionで指摘された箇所で「Option + Enter / Alt + Enter」
    もしくは黄色いバルブのAction Indicatorをクリック

    View full-size slide

  56. Action Listが表示される
    ここでは、この中から「Introduce variable」Quick Fixを選択

    View full-size slide

  57. Enterで選択肢、Quick Fixによる修正が行われる

    View full-size slide

  58. いくつかのQuick Fixは一箇所だけじゃなくて
    ファイル、プロジェクト、ソリューション内の
    同じ修正を一気にできる

    View full-size slide

  59. ファイル、フォルダー、プロジェクト、ソリューション
    ドリルダウンし修正範囲を指定し、Quick Fix!

    View full-size slide

  60. 次の話題

    View full-size slide

  61. コードって書く時間より、読む時間のほうが多いですよね
    コードを読む時に必須な機能

    View full-size slide

  62. Go to Declaration
    定義箇所・宣言箇所にジャンプ

    View full-size slide

  63. Find Usages
    このコードがどういう場所で使われているかを一覧

    View full-size slide

  64. コンソールアプリケーションだったら、
    あるメソッドは、別のメソッドから呼び出され
    ある型のインスタンスは、メソッド中で生成される
    コードを読めばだいたい処理の流れが追える

    View full-size slide

  65. コンソールアプリに比べて
    Unityでコード・データ・処理の流れを追うの大変!

    View full-size slide

  66. ゲームオブジェクトのコンポーネントとして、生成され
    シーン上のボタンなどのハンドラーからメソッドが呼ばれ
    フィールドはインスペクターから値が設定される
    Unityではコードだけで流れが全然追えない!

    View full-size slide

  67. 大丈夫、Riderなら!

    View full-size slide

  68. Code Vision
    コードのメトリクスを計測し、付加情報をいい感じに表示

    View full-size slide

  69. 「このコンポーネント、どこで使われるんだ?」
    どのシーンのどのゲームオブジェクトのコンポーネントかわかる
    どのディレクトリのどのプレファブのコンポーネントかわかる

    View full-size slide

  70. クラス名の上「3 asset usages」をクリックするとウィンドウが出る。
    Unity Editor上の該当のゲームオブジェクト・プレファブに飛ぶことこともできる。

    View full-size slide

  71. 「このメソッド、どこで呼ばれるんだ?」
    どのシーンのどのイベントハンドラーから
    メソッドが参照されているかわかる

    View full-size slide

  72. StartMoveメソッドの上「1 asset Usage」をクリックするとウィンドウが出る。
    クリックでUnity Editorの該当のゲームオブジェクト・プレファブに飛ぶことこともできる。

    View full-size slide

  73. 「これ、どこのインスペクターからどんな値が設定されるんだ?」
    どのシーンのどのインスペクターから
    どんな値が設定されているかわかる

    View full-size slide

  74. フィールドの右「Changed 3 assets」をクリック。
    設定される値・参照と、設定箇所がわかる
    該当のゲームオブジェクト・プレファブに飛ぶことこともできる。

    View full-size slide

  75. Code Visionで見えるもの
    ● 最後にコミットした人
    ● どういうふうに使われているか
    ● この型をどう派生しているか

    View full-size slide

  76. Find Unity Usage
    Unityのシーンやプレハブでの利用場所を探してくれる

    View full-size slide

  77. 次の話題

    View full-size slide

  78. どんなフレームワークを使っていても
    ある程度お決まりのコードフレーズってあるじゃないですか
    それ、さくっとかけたら嬉しくないですか?

    View full-size slide

  79. 例えば、public static void Main

    View full-size slide

  80. 例えば、Unityだったらこんなコード

    View full-size slide

  81. Live Template
    煩雑なお約束コードも手早く・素早く

    View full-size slide

  82. これを手早く書きたい

    View full-size slide

  83. まず、psvmって打つ。Code Completionで候補が出る。
    そこでEnterかTabを打つと・・・

    View full-size slide

  84. public static void Mainが展開される

    View full-size slide

  85. Live Template
    あれ?ただのテンプレートじゃね?ライブ感なくない?

    View full-size slide

  86. これを手早く書きたい

    View full-size slide

  87. まず、spropって打つ。Code Completionで候補が出る。
    そこでEnterかTabを押す・・・

    View full-size slide

  88. まず、テンプレート展開。キャレットは型の位置に

    View full-size slide

  89. intって打つと、フィールドもプロパティも同時にintに変わる!

    View full-size slide

  90. 型のメンバとか、制御構文とか
    C#の便利なLive Templateがたくさん!
    今日はUnity向けのLive Templateを一気に紹介!

    View full-size slide

  91. sfield
    UnityEngine.SerializeFieldアトリビュートがついた
    privateなフィールドを作るライブテンプレート

    View full-size slide

  92. reqcomp
    UnityEngine.RequireComponentを付与するライブテンプレート

    View full-size slide

  93. menuitem
    UnityEditor.MenuItemアトリビュートを付与するライブテンプレート

    View full-size slide

  94. log
    UnityEngine.Debug.Logなどのライブテンプレート

    View full-size slide

  95. cor
    コルーチン用のIEnumeratorを返すメソッドのライブテンプレート

    View full-size slide

  96. assetmenu
    UnityEditor.CreateAssetMenuアトリビュートを
    付与するライブテンプレート

    View full-size slide

  97. DOTS用のLive Templateとか欲しくないですか?

    View full-size slide

  98. 残念ながら、まだないです
    けど、大丈夫!
    Live Templateは自分でも作れる

    View full-size slide

  99. Preference | Live Templateから、自分のテンプレートを作成できる!

    View full-size slide

  100. お決まりのコードフレーズだけじゃなくて、
    お決まりのファイル構造もできる

    View full-size slide

  101. File Template
    お約束なファイル構成のコードも手早く・素早く

    View full-size slide

  102. ファイル新規作成の時に、テンプレートから選択

    View full-size slide

  103. いい感じにScriptableObjectが新規作成!

    View full-size slide

  104. 自分のファイルテンプレートを登録できる

    View full-size slide

  105. チームでよく使うテンプレートがあったら
    作成してチームに共有するとスムーズですね!

    View full-size slide

  106. Unityにおける「お決まりのコードを書く」
    といえばAwake、Start、Update
    などの「Unity Event Functions」

    View full-size slide

  107. Code Generation
    C#の頻出コード・Unityのライフサイクルメソッドも楽々作成

    View full-size slide

  108. 型のメンバの生成(cmd + N など)
    コンストラクタ、等値比較とか、文字列とか、オーバーライドメソッドetc

    View full-size slide

  109. MonoBehaviourのサブクラスだと
    「Unity Event Functions」が選べる

    View full-size slide

  110. 生成したい「Unity Event Functions」を選択

    View full-size slide

  111. 選択した「Unity Event Functions」が生成される

    View full-size slide

  112. MonoBehaviourサブクラス内でコード補完(Code Completion)でも
    非MonoBehaviourサブクラスでは出てこない
    (※ Unityイベント関数は仮想関数ではない)

    View full-size slide

  113. 余談
    ライフサイクルメソッドのドキュメント見れるの、初心者にオススメ

    View full-size slide

  114. 次の話題

    View full-size slide

  115. Performance Indicators
    「このメソッド、Updateから呼ばれてんぞ」って指摘してくれる

    View full-size slide

  116. 例えば、GetComponentはそこそこ負荷がかかる処理
    UpdateやFixedUpdateの中で毎回毎回呼ぶのはよくない
    Riderはそれを指摘してくれる

    View full-size slide

  117. Updateで読んでるメソッド
    に「Frequently Called」
    GetComponentに赤線
    GetComponentを内部で読
    んでるMoveを呼び出してい
    る箇所に赤線

    View full-size slide

  118. 「Introduce field and initialize in ‘Start’」
    毎回毎回GetComponentせず、フィールドを作ってStart/Awakeで初期化

    View full-size slide

  119. さくっと改善できる!

    View full-size slide

  120. 次の話題

    View full-size slide

  121. Unity Editorとの連携

    View full-size slide

  122. RiderとUnityエディタの連携

    View full-size slide

  123. Riderからゲームプレイ開始・デバック

    View full-size slide

  124. Riderの中からDebug.Logの中身が見れる

    View full-size slide

  125. UnityでもBreakpoint、Step Over、Step In、Step Out

    View full-size slide

  126. Breakpointは条件を指定できる

    View full-size slide

  127. Breakpointで停止中、式の評価ができる。Watchに追加も

    View full-size slide

  128. 次の話題

    View full-size slide

  129. とりあえずこれだけ覚えて!
    Rider & JetBrains IDE
    ショートカットベスト3

    View full-size slide

  130. Show Action List
    とりあえず「option + Enter」 / 「alt + Enter」
    Quick FixやContext Actionを一覧表示!
    空気を読んでいろいろやってくれる

    View full-size slide

  131. Find Action
    Ctrl+Shift+A など
    キーボードショートカットが覚えられない?
    「Find Action」でやれることを検索!

    View full-size slide

  132. Search Everywhere
    Shift + Shift (2回連続)
    コードも、クラスも、ファイルも、シンボルも、アクションも
    全部まとめて検索!!!

    View full-size slide

  133. 次の話題

    View full-size slide

  134. Unity向けのCode Inspectionsの解説

    View full-size slide

  135. ここ、Unity Code Inspectionの理由が書いてあるので
    読むのおもしろいです!
    https://github.com/JetBrains/resharper-unity/wiki

    View full-size slide

  136. 次の話題

    View full-size slide

  137. 複数のJetBrains IDEを使う人
    あと、EAPやRCを使いたい人
    ぜひJetBrains Tool Boxを!

    View full-size slide

  138. IntelliJ IDEAハンズオン ――基本操作からプロジェクト管理までマスター
    山本裕介さんと今井勝信さんの
    IntelliJ IDEAの書籍
    コードの書き方・読み方の基本操作は
    Riderとも共通
    ライセンスについても

    View full-size slide

  139. Rider Build in Tutorial

    View full-size slide

  140. Rider Build in Tutorial

    View full-size slide

  141. Riderはいいぞ!
    @RyotaMurohoshi
    2019/10/27(日) .NET Conf in Tokyo 2019

    View full-size slide