トーク

概要

以下のようなコードがDartで書けることはご存じでしょうか。
Dart3でパターンマッチングが導入されてから、色々な表現の幅が広がりました。このトークでは、あまり標準的ではないDart標準の表記方法をクイズ形式で紹介していこうと思います。

Person fromJson(Map<String, dynamic> json) {
  if (json case {'company': String company, 'name': String name}) {
    return Person(company: company, name: name);
  } else if (json case {'name': String name}) {
    return Person(name: name);
  }

  throw Exception('Illegal json format');
}

想定視聴者

Dart 中級者以上

概要

地下鉄や長時間のフライトなど、通信が不安定な状況でもアプリが快適に動作することが求められています。
このニーズに応えるには、オフラインでのデータキャッシュが不可欠です。
特に、大量のデータを扱うアプリでは、データベースの選定がパフォーマンスに大きな影響を与えます。
本セッションでは、学習用APIであるPokeAPIを活用し、sqfliteやobject_boxなどのデータベースを比較します。
それぞれの読み書き速度やリアルタイム検索の実装方法を解説し、オフライン環境でもスムーズに動作するアプリの実装手法を紹介します。
さらに、オフラインからオンラインに復帰した際のデータハンドリングについても触れます。

このセッションで学べること

• sqfliteやobject_boxなどのデータベースの読み書き速度や使いやすさの比較
• 効率的なリアルタイム検索の実装方法
• オフライン状態からオンライン復帰時のデータ管理

  想定視聴者

• ローカルキャッシュを活用したアプリの実装を検討している方
• オフライン対応アプリの開発に関心がある方

概要

多くのFlutter開発者が直面する課題の一つは、標準コンポーネントでは対応できない高度なUIニーズです。私たちのプロジェクトでも、動画のスライダーをカスタマイズする必要に迫られ、標準のSliderコンポーネントでは対応できない要件に直面しました。その結果として、CustomPaintを活用して独自のスライダーを実装することにしました。

このセッションでは、CustomPaintの基本から始め、高度なカスタム描画を行うためのベストプラクティスと実際のパフォーマンスについて深掘りしていきます。

このセッションの内容は以下の通りです：

• CustomPaintの基礎基本：仕組みと使用方法
• CustomPaintを使うべきタイミングと利点
• CustomPainterによる高性能カスタム描画技術
• パフォーマンス計測と最適化の手法
• ライブコーディングによる実装解説

想定視聴者

• FlutterでカスタムUIコンポーネントの作成に関心がある開発者
• CustomPaintやCustomPainterの使いこなし方を知りたい方
• パフォーマンスを犠牲にせず、独自のデザインを実現したい方
• 実際に手を動かして高度な描画処理を実装したいエンジニア

概要

Flutterアプリの国際化（i18n）にはさまざまなアプローチがありますが、プロジェクトの要件に応じた最適なソリューションを選ぶことが重要です。私たちのプロジェクトでは、複数の言語や地域に対応するために、i18nソリューションを慎重に選定しました。その中で、ファイル管理の柔軟性、型安全性、そしてYAML形式のサポート等を重要視し、最終的にslangというパッケージを導入することに決定しました。

このセッションでは、私たちがslangの導入に至った背景や、その具体的な利点についてお話しします。18nのソリューションを検討する際に役立つ情報を提供し、プロジェクトに最適なアプローチを見つける手助けとなることを目指します。

想定視聴者

•   Flutterアプリの国際化に関心があるエンジニア
•   i18nパッケージの選定に関心がある方
•   type-safeなコード生成に関心がある方

概要

このセッションでは、プレーン Flutter API を使って、MVVM アーキテクチャと簡単な状態管理や依存性注入を作り、仕組みの基本を知ってもらい、
これらのキーポイントを知ることで、要件仕様書を満たし、機能の追加や振る舞い変更も、処理フローのテストもしやすい実装作りを説明します。

仕事や自分でアプリを作るにも、 「このボタンを押したら、サーバからデータを取得して画面のここの表示が変わる」などから、
「必要なライブラリなどの要素技術を選択して、どんな入力で、どんな関数やフローで、どんな出力やエラーを期待するか」の要件仕様書ができます。

ですが要件仕様書を愚直に Widget に実装すると、神Widgetが誕生してしまうので、
一般的に MVVMで、Clean Archtecture に則り、View はデータの表示に徹し、ViewModel はデータ（状態）の提供と更新に徹し、
状態管理ライブラリで、状態更新された View のみの表示更新①、DI/依存性注入ライブラリで、テストコード①②を実装しています。

①Riverpod/GetItは、MVVM 専用ではありませんから、実装コードには工夫が必要！
②テストする関数やフローの実装を変えず、依存するデータや状態をテストダブル（モックオブジェクト等）にすり替えます。

想定視聴者

初心者から中級者

概要

Dart から Kotlin へコードを移植した際、特定の条件下でアプリがクラッシュする事態に直面しました。このクラッシュは Android 版でのみ発生し、 iOS 版では問題ありませんでした。一見、 Dart、 Kotlin、 Swift で同じ Int 型を扱っているように思えましたが、その内部実装は異なり、型の変換処理を単純に移植することができないことが明らかになりました。このトークでは、クラッシュの原因を掘り下げるとともに、言語ごとの型の違いを考慮した適切な移植方法について解説します。

想定視聴者

• 別の言語間での移植を行う方
• 言語仕様や型の違いに興味のある方

概要

このセッションではFlutter創設メンバーであるEric Seidelらが手掛けているサービスのShorebirdについて話します。
モバイルアプリの更新はWebアプリとは異なり、各プラットフォームのストア審査を通過する必要があり、時間と手間がかかります。
特に、ユーザーの手元で発生している不具合対応のアップデートが必要な状況では、この審査プロセスが迅速なリリースの障害となることがあります。
Shorebirdを使えば、AndroidとiOSアプリをストアの審査なしで素早く更新することが可能になります。
セッション内では実際にコードの修正を行い、ストアを経由せずにアプリを更新するデモンストレーションを行う予定です。

想定視聴者

• アプリの更新プロセスを効率化したいと考えている開発者
• Shorebirdを活用してリリースサイクルの短縮やアジリティの向上に興味がある開発者

概要

このセッションでは、mixというスタイル設定システムをご紹介します。
mixは、シンプルかつ直感的にスタイルを作成、結合、適用できるシステムで、共通スタイルの管理運用がしやすくなります。
具体的には、mixを用いて簡単にスタイルを定義し、標準のFlutterスタイルシステムと比較しながら、その利便性を紹介します。

想定視聴者

• mixに興味がある方
• Style定義の新しいアプローチに興味がある方

概要

WebViewの実装は、多くのFlutterエンジニアが経験するものの、その詳細についてはあまり深く理解せずに使っていることが多いのではないでしょうか？

このトークでは、Flutterアプリ開発でよく利用される webview_flutter ライブラリについて解説を行います。
単なるWebの描画に留まらず、多様な処理をハンドリングすることで、WebViewでも高度な機能を実現できることを目指します。
自分自身が開発で直面した課題やハマりどころを中心にご紹介できればと思います。

このセッションでは以下の内容を想定しています。

• webview_flutter とは
• webview_flutter の解説
  • HTTPリクエストのハンドリング
  • デバッグ方法
  • 3.0から4.0へのアップデートの注意点
  • webview_flutterで実現できないこと
  • その他

想定視聴者

• webview_flutter の導入を検討している方
• webview_flutter を軽く使ったことがあるが、さらに理解を深めたい方

概要

本セッションでは、FlutterとDartを活用した総合チケット管理システムの開発経験を共有します。
Flutter/Dartのクロスプラットフォーム対応の強みを最大限に活かし、Webサイト、モバイルアプリケーション、バックエンドを一貫して開発した経験を共有します。

システム構成

• Flutter Webによるチケット購入サイト
• Flutter Webによる主催者向けチケット管理サイト
• チケット管理アプリケーション

技術スタック

• Flutter (Web/iOS/Android)
• Supabase (データベース)
• Cloudflare Workers + Dart(バックエンド)
• Stripe (決済処理)
• Prometheus, Grafana(可視化とアラート)

その他

• コード共有による開発効率の向上とメンテナンス性の改善
• Supabase RLSのユニットテスト実装によるデータセキュリティの強化
• Dartバックエンドの実装・運用

対象者

• Flutterでのクロスプラットフォーム開発に興味のある開発者
• Supabase+Stripeの決済システムに興味のある方

（注：本プロジェクトは進行中のため、詳細は変更の可能性があります）

概要

AwarefyではローカルキャッシュのためのパッケージをHIVE→Isar→Floor（sqflite）という流れで置き換えてきました。ローカルキャッシュを実装する上でのキャッシュ戦略について、Floorでの実装を交えながらお話しします。

想定視聴者

• SQLになかなか触れることがないが、知識をつけたい方
• ローカルキャッシュについて知りたい方
• Floorについて知りたい方

概要

Flutter アプリケーションにおいて、ジェスチャー操作は重要な UI 要素です。基本的なタップやスワイプは広く実装されていますが、より複雑で洗練されたジェスチャー操作の活用はまだ十分ではありません。
複雑なジェスチャーの実装には、 GestureDetector の深い理解が必要です。また、多様なジェスチャーの種類、適切な制御方法、カスタムジェスチャーの作成など、高度なスキルが求められます。
本セッションでは、 GestureDetector の仕組みから、様々なジェスチャーの種類と実装方法、制御テクニック、オリジナルのジェスチャー作成までを包括的に解説します。実践的なコード例と共に、複雑なジェスチャーを使いこなすための知識とスキルを提供します。

1. GestureDetector の内部構造を理解
2. 利用可能なジェスチャーの種類と特徴
3. 複数のジェスチャーを組み合わせた高度な操作の実装
4. ジェスチャーの衝突を防ぐ制御テクニック
5. カスタムジェスチャーの設計と実装方法

想定視聴者

・より高度なユーザーインターフェースの実装に挑戦したい開発者
・独自のジェスチャー操作を実装したいと考えているアプリ開発者

概要

Dart の Class modifiers （クラス修飾子） は、2023年5月にリリースされた Dart 3 で大幅に機能が強化され、今では Dart/Flutter で開発するアプリのクラス設計において欠かせない存在となりました。

本セッションでは、Dart の Class modifiers の機能を簡単におさらいするとともに、実際のモデリングやクラス設計、実装においてどのように活用できるのかを紐解きます。Class modifiers の理解を深めることで、インターフェースを利用した抽象化、sealed class を利用したパターンマッチングなど、クリーンなコードを書くためのヒントを得られます。

また、Dart の機能・言語仕様にとどまらず、 Class modifiers を知り、活用することで Flutter アプリの開発にどのようなメリットが生じるのか、といった実践的な内容にも踏み込んで解説します。

想定視聴者

本セッションの想定視聴者は次のとおりです。

• Flutterアプリ開発者全般
• Class modifiers をどのようにクラス設計に活用できるのか、公式ドキュメント以外の実践例が知りたい
• Class modifiers を利用したクラス設計が、アプリ開発にどのようなメリットをもたらすのかを知りたい

概要

このセッションでは、Flutter公式が開発しているvideo_playerについて話します。
video_playerの構成や使える機能などの紹介はもちろん、動画という各ネイティブ独自の機能を呼び出すときに考えなければいけない難しい部分についての話を行います。
video_playerはシンプルな機能しか提供していません。
本セッションでは、そんなvideo_playerを拡張するためにはどのような実装が必要かを、基本的なHLSの説明を元にvideo_playerに追っかけ（タイムシフト）再生を追加する例を元に紹介します。

1. video_player
   1. 概要
   2. 全体構成
   3. 使える機能、使えない機能
2. video_playerのpigeonを使ったネイティブコード呼び出し
3. video_playerに機能追加を試して理解を深める
   1. AVPlayerとExoPlayerの仕様差異とその吸収の仕方
   2. ネイティブ機能を使うパッケージ開発の困難なところ
4. video_playerの直近の動きと今後

想定視聴者

・video_playerを使っている人
・Flutterの動画再生に興味がある人
・Flutterでネイティブコードの呼び出しを実装したことがある人、興味がある人

概要

Dartはシングルスレッドと呼ばれる仕組みで1つのIsolateの中でDartのコードを処理します。
基本的なユーザーがボタンを押したイベントやタイマーが発火したのようなイベントは先頭から順番に処理されます。
しかし、Futureの非同期のイベントがイベントループに入ったときや、microtaskがイベントループに入ったときは単純な処理ではなくなり、理解が難しいことが多々あります。
この理解を疎かにすることでバグになり不具合につながってしまうこともあります。

本セッションではDartのEvent Loopについておさらいをして、Flutterアプリ開発をする中で起こる様々なユースケースを元にDartがシングルスレッドでどのようにイベントを処理しているのかを深堀ります。

想定視聴者

・Dartのイベントループについて知りたい人
・最近Flutterを始めた人

概要

チーム開発において、効率的な開発環境はプロジェクトの成功に不可欠です。
本セッションでは、Flutter 開発における環境構築から CI/CD といった開発フロー全体における、具体的なノウハウとプラクティスを発表します。
チームメンバーが開発に集中できる環境を整え、生産性の向上を目指しましょう。

具体的には、以下のトピックを中心に解説します。

• SDK やツール管理: Flutter 開発に必要な SDK やツールの効率的な管理方法について解説します。
• マルチパッケージ (モノレポ) 管理: ローカルのマルチパッケージ管理やタスクランナーについて解説します。
• 静的解析: Dart コードに限定せずプロジェクト全体の Lint や Formatter について解説します。
• CI/CD (GitHub Actions): Issue Ops や GitHub Actions を活用した CI/CD パイプラインの構築や実行時間を抑えるノウハウについて解説します。

想定視聴者

• チームの開発環境を改善し、開発効率を高めたい Flutter 開発者
• 新しい Flutter プロジェクトを立ち上げ、効率的な開発基盤を構築したい方

概要

デザインシステムの文脈の元、
Flutterでデザイン再現度を上げるにはどうすべきか以下のような内容を話します。
※ デザインツールはFigmaを前提としています。

・ チームでのデザインシステムへの取り組みの紹介
・ デザイナーの巻き込んでいくか
・ 実際のFlutterでのデザインの再現方法
・ プログラムしやすいデザインとして、デザイナーに何を連携して何をデザインシステムとしてまとめたか紹介

想定視聴者

・ デザインの再現度を高めたい方。
　・ Figmaを見てFlutterで実装する際のTipsを知りたい方。
・ 「デザインシステム」・デザイナーと実装しやすいデザインについて協議を進めていきたい方。

概要

「ダウンロードしておいたファイル（端末に保存したファイル）を利用してアプリを動作させる方法」について設計・Tips・注意点を紹介します。
※ 実際に業務で利用した知見が含まれます。

現状含んでいない内容
オフラインで実行した処理（ポイント付与など）を、オンラインに繋げた際に連携する方法。
※ 実績がないため、用意できたとしても調査した結果のみとなります。

想定視聴者

・ オフラインを前提としたアプリを検討したことがあり、Flutterアプリを動作させる方法についてヒントが欲しい方。
・ 端末内にファイル保存をする仕様を検討されている方。

概要

Awarefyでは、MaestroによるE2Eテスト環境を構築し、運用しています。そして、実行にかかるコストを削減するため、Maestroが用意しているCIサービスであるMaestro Cloudを使わず、GitHub Actionsからself-hosted runnersで実行することに成功しました。
Maestroを用いたE2Eテストの実装から、self-hosted runnersで実行するためのハウツーについて話します。

想定視聴者

• E2Eテストを導入したい方
• Maestroの導入に興味がある方
• Maestroをself-hosted runnersで実行したい方

概要

社内向けのOpenID Connect (OIDC)クライアントライブラリ 開発した経験を共有します。
株式会社GENDA が提供するGENDA ID (グループ横断の ID プラットフォーム)に対応するため、FlutterアプリからOIDCのRelying Partyとして機能するPublic Clientライブラリの開発プロセス、直面した課題、そしてその解決策について詳しく説明します。

主なトピック

1. OIDCの基礎
2. Dartでのライブラリ開発における挑戦と学び
   • iOSアプリエンジニアの視点からみたDartとFlutterの特徴
   • ライブラリ開発特有の考慮点と実装テクニック
3. プライベートリポジトリを活用した社内向けライブラリのベストプラクティス
4. OIDCクライアント実装に必要な周辺技術の解説

想定視聴者

• Flutterアプリ向けのライブラリ開発をやってみたい方
• Flutterアプリ開発に慣れていない方
• OpenID Connect (OIDC)という言葉を知っているだけで詳しくない方

聴衆が得られる知見

• Dartでのライブラリ開発のベストプラクティスと落とし穴
• 企業内でのプライベートパッケージ管理と配布のテクニック
• OIDC実装における共通の課題と解決策