Riverpodに機能追加したときの話 (long ver.)

Transcript

1. Riverpodに機能追加したとき
   の話 (long ver.)
   第4回 FlutterGakkai
   Kota Hayashi (K9i)
   

   View Slide

2. 自己紹介
   

   View Slide

3. YUMEMIについて
   - Flutterにも力入れてます
   - 新卒エンジニアとリードエンジニアを募集中
   

   View Slide

4. YUMEMIについて
   - Flutterにも力入れてます
   - 新卒エンジニアとリードエンジニアを募集中
   定期的に勉強会を開催中
   タイミングがあったら参加してね
   

   View Slide

5. Riverpod?
   - 日本だと特に人気が高い状態管理ライブラリ
   - 最近はデファクトスタンダード？
   - 世界的にはBLoCなんかも人気
   - https://docs-v2.riverpod.dev/
   

   View Slide

6. 追加した機能
   

   View Slide

7. 追加した機能
   Riverpod関連のWidget
   を相互に変換する
   

   View Slide

8. BaseとなるWidgetの変換（Before）
   

   View Slide

9. BaseとなるWidgetの変換（Before）
   flutter, flutter_riverpodパケージのWidgetを
   ConsumerWidgetかConsuerStatefulWidgetに変
   換可能
   

   View Slide

10. BaseとなるWidgetの変換（After）
    

    View Slide

11. BaseとなるWidgetの変換（After）
    すべて相互に変換可能
    

    View Slide

12. 変更したパッケージ
    - Riverpodはマルチパッケージ構成
    - riverpod
    - flutter_riverpod
    - hooks_riverpod
    - riverpod_generator
    - riverpod_lint
    - など
    

    View Slide

13. 変更したパッケージ
    - Riverpodはマルチパッケージ構成
    - riverpod
    - flutter_riverpod
    - hooks_riverpod
    - riverpod_generator
    - riverpod_lint
    - など
    MelostというDart向けのマ
    ルチパッケージ管理ツール
    が使われている
    https://melos.invertase.dev
    /~melos-latest
    

    View Slide

14. 変更したパッケージ
    - Riverpodはマルチパッケージ構成
    - riverpod
    - flutter_riverpod
    - hooks_riverpod
    - riverpod_generator
    - riverpod_lint
    - など
    変更したのはこれ
    

    View Slide

15. 機能追加の流れ
    1. Notionに既存処理の流れを洗い出した
    

    View Slide

16. View Slide

17. 機能追加の流れ
    1. Notionに既存処理の流れを洗い出した
    2. custom_lint_builderの使い方をキャッチアップ
    

    View Slide

18. custom_lint_builderの使い方をキャッチアップ
    - riverpod_lintはcustom_lint_builderパッケージで実現されている
    - 使い方の説明はcustom_lintパッケージのreadme
    - https://pub.dev/packages/custom_lint#creating-a-custom
    -lint-package
    

    View Slide

19. 機能追加の流れ
    1. Notionに既存処理の流れを洗い出した
    2. custom_lint_builderの使い方をキャッチアップ
    3. 実装
    4. hooks関連の問題発生
    

    View Slide

20. hooks関連の問題発生
    - HookWidgetなどはhooks_riverpodを使ってるときだけ変換したい →
    custom_lintで利用パッケージを知るすべが無い
    

    View Slide

21. 図解
    これらはオプションにしたい
    しかしcustom_lintからプロジェクトの利用
    パッケージを取得できない
    

    View Slide

22. remiさんがcustom_lintを修正してくれた
    

    View Slide

23. remiさんがcustom_lintを修正してくれた
    custom_lintの変更
    PR
    https://github.com/invertase/dart_custom_lint/p
    ull/137
    Changelog
    https://pub.dev/packages/custom_lint_builder/
    changelog#033---2023-04-06
    

    View Slide

24. custom_lintの補足
    - Dart、Flutter用にオリジナルのlintルールを作れる要チェックパッケージ
    - lintを利用する：custom_lintパッケージ
    - lintを開発する：custom_lint_builderパッケージ
    - Invertaseが開発してる
    - といいつつほぼremiさんが作ってる？
    - riverpod_lintの開発の中で改良されてる感があり、
    custom_lint_builderを使うときはriverpod_lintが参考になる
    

    View Slide

25. 無事リリース🥳
    

    View Slide

26. 無事リリース🥳
    機能追加とかすると Changelogに書いてもらえ
    る
    自分でOSSするときも参考にすると良さそうな
    運用
    

    View Slide

27. おわり
    - Riverpod関連のWidgetを変換する機能を追加したよ
    - 今回の実装のPR
    - https://github.com/rrousselGit/riverpod/pull/2306
    

    View Slide