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

DevTools Extension 3分クッキング

ashdik
December 09, 2023

DevTools Extension 3分クッキング

Flutter3.16から導入された DevTools Extensionについて導入部分について簡潔に解説しています。

ashdik

December 09, 2023
Tweet

More Decks by ashdik

Other Decks in Programming

Transcript

  1. DevTools
    Extension
    3分クッキング
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  2. 朝日大樹 @

    Flutter歴 : 3年半
    Twitter: @daiki1003
    @ashdik1003
    ブログ: https://blog.dalt.me
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  3. 本LTの目的
    自作パッケージのextensionを作ってみよう
    Flutterの発展
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  4. おしながき
    DevTools Extensionとは?
    DevTools Extensionの作り方
    何が出来るのか?
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  5. DevTools Extensionとは?
    DevTools Extensionの作り方
    パッケージ構成
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  6. DevToolsとは?
    ランタイム情報の可視化ツール
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  7. DevTools Extensionとは?
    Flutter 3.16で公開されたDevToolsの拡張API
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  8. DevTools Extensionとは?
    DevTools Extensionの作り方
    何が出来るのか?
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  9. DevTools Extensionの作り方
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  10. DevTools Extensionの作り方
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  11. DevTools Extensionの作り方
    config.yml
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  12. DevTools Extensionの作り方
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  13. DevTools Extensionの作り方
    webアプリの作成
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  14. DevTools Extensionの作り方
    パッケージ追加
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  15. DevTools Extensionの作り方
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  16. 〜Webアプリの開発〜
    DevTools Extensionの作り方
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  17. DevTools Extensionの作り方
    build_and_copy
    devtools_extensions build_and_copy

    —source=/path/to/foo_devtools_extensions

    –dest=/path/to/extension/devtools

    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  18. DevTools Extensionの作り方
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  19. ● DevTools Extensionとは?
    ● DevTools Extensionの作り方
    ● 何が出来るのか?
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  20. 何が出来るのか?
    serviceManager
    extensionManager
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  21. 2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  22. Split
    ActionPaneHeader
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  23. まとめ
    DevTools Extensionを使ってDeveloper Experienceを
    最大化
    Flutterを盛り上げよう!
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide

  24. ご清聴ありがとうございました!
    2023/12/09
    朝日 大樹 (@ashdik1003)

    View full-size slide