<p>こんにちはこんばんわ、すぎっと ٩( ᐛ )و です<br>
今日のテーマは歴史です。</p>
<p>この記事は <a href="https://qiita.com/advent-calendar/2021/flutter" target="_blank" rel="nofollow noopener noreferrer">Qiita Advent Calendar 2021 Flutter</a> 22 日目の記事です。</p>
<h1 id="flutter-%E3%81%AE%E6%AD%B4%E5%8F%B2">
<a class="header-anchor-link" href="#flutter-%E3%81%AE%E6%AD%B4%E5%8F%B2" aria-hidden="true"></a> Flutter の歴史</h1>
<p>ちょっとした遊び心で Flutter の歴史について調べてみました。歴史を知ることで見えてくるものがあったり、また単純に好きになれたりするかもしれないと思ったからです。</p>
<h2 id="%E6%9C%80%E5%88%9D%E3%81%AE%E3%82%B3%E3%83%9F%E3%83%83%E3%83%88">
<a class="header-anchor-link" href="#%E6%9C%80%E5%88%9D%E3%81%AE%E3%82%B3%E3%83%9F%E3%83%83%E3%83%88" aria-hidden="true"></a> 最初のコミット</h2>
<p>歴史について調べるにあたり、まず GitHub の Flutter リポジトリの一番初めのコミットを調べてみました。コミットハッシュは <strong>7b0bbdbe66067295c4503eebde53b2ebf82e1764</strong> でした。もし気になる方はこのハッシュ値を頼りに調べてみてください。</p>
<p>さて、せっかく最初のコミットハッシュが手に入りましたので、当時のリポジトリを見てみましょう。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__2c5e6b00ff8ea" src="https://embed.zenn.studio/card#zenn-embedded__2c5e6b00ff8ea" data-content="https%3A%2F%2Fgithub.com%2Fflutter%2Fflutter%2Ftree%2F7b0bbdbe66067295c4503eebde53b2ebf82e1764" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://github.com/flutter/flutter/tree/7b0bbdbe66067295c4503eebde53b2ebf82e1764" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://github.com/flutter/flutter/tree/7b0bbdbe66067295c4503eebde53b2ebf82e1764</a></p>
<p>最初はたった 3 つのファイルからスタートしたようですね。</p>
<ul>
<li>AUTHORS</li>
<li>LICENSE</li>
<li>README.md</li>
</ul>
<p>AUTHORS にはこんな一文がありました。</p>
<blockquote>
<p>below is a list of people and organizations that have contributed to the Sky project.</p>
<p>Google Inc.<br>
Jim Simon</p>
</blockquote>
<p>Jim さんのおかげで Flutter が楽しいです。ありがとうございます。</p>
<p>Sky Project ??</p>
<h2 id="sky-%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88">
<a class="header-anchor-link" href="#sky-%E3%83%97%E3%83%AD%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88" aria-hidden="true"></a> Sky プロジェクト</h2>
<p>Flutter は最初は <strong>Sky project</strong> と呼ばれていたようですね。Sky project について調べてみると、次の動画を見つけることができました。</p>
<p><span class="embed-block embed-youtube"><iframe src="https://www.youtube-nocookie.com/embed/PnIWl33YMwA" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen loading="lazy"></iframe></span><a href="https://youtu.be/PnIWl33YMwA" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://youtu.be/PnIWl33YMwA</a></p>
<p>これは Flutter が日の目を見た最初のプレゼンなのかもしれないですね。（知らんけど）</p>
<p>動画の概要欄には以下の記述がありました。</p>
<blockquote>
<p>Sky is an experimental open-source framework for writing mobile applications in Dart. Sky brings continuous deployment, fast development cycles, and designed-for-small-screen 60Hz user experiences to Dart developers on mobile. Presented by Eric Seidel.</p>
</blockquote>
<p>Sky プロジェクトは Dart を使ってモバイルアプリケーションを開発するためのフレームワークとして開発がスタートしたようですね。動画を見るとわかるのですがこの時点ですでにかなり実用的な画面がデモで発表されています。Sky プロジェクトはこの発表の時点で Android, iOS のマルチプラットフォーム開発に言及しています。</p>
<p>Sky のアーキテクチャが紹介されていました。</p>
<p><img src="https://storage.googleapis.com/zenn-user-upload/ef00caac9b91c9b9b8d485b2.png" alt="SkyArchitecture" loading="lazy" class="md-img"></p>
<p>これはいまの Flutter のアーキテクチャとあまり変わっていないですね。</p>
<p>続いて、Sky の HelloWorld がデモされていました。最初はこんな感じの書き方だったんですね。Dart が AltJS であることが垣間見えておもしろいです。</p>
<p><img src="https://storage.googleapis.com/zenn-user-upload/3b11893a0820cc1ee3992276.png" alt width="400" loading="lazy" class="md-img"><br>
<img src="https://storage.googleapis.com/zenn-user-upload/3e58be39ddee9a532ad2b5f2.png" alt width="400" loading="lazy" class="md-img"><br>
<img src="https://storage.googleapis.com/zenn-user-upload/7272a77fb75c184e5aa5f765.png" alt width="400" loading="lazy" class="md-img"></p>
<p>そのままデモの続きを見て見ます。</p>
<p><img src="https://storage.googleapis.com/zenn-user-upload/b55e833776a346fda83e8961.png" alt width="500" loading="lazy" class="md-img"></p>
<p>Scaffold Widget が出てきました!! Widget の考え方などのいまの Flutter を支える基本的なところはこのときすでにできていたんですね。</p>
<p>そして最後にこんな紹介がありました。</p>
<p><img src="https://storage.googleapis.com/zenn-user-upload/65ba162f1d1ede3fbe6f40d8.png" alt width="400" loading="lazy" class="md-img"></p>
<p><a href="https://github.com/domokit/sky_sdk" target="_blank" rel="nofollow noopener noreferrer">https://github.com/domokit/sky_sdk</a> にアクセスしてみてください。flutter にリダイレクトされます。歴史に触れた感じがしますね。</p>
<h2 id="%E3%83%A1%E3%82%B8%E3%83%A3%E3%83%BC%E3%83%AA%E3%83%AA%E3%83%BC%E3%82%B9">
<a class="header-anchor-link" href="#%E3%83%A1%E3%82%B8%E3%83%A3%E3%83%BC%E3%83%AA%E3%83%AA%E3%83%BC%E3%82%B9" aria-hidden="true"></a> メジャーリリース</h2>
<p>Flutter のメジャーリリースは 3 年後の 2018 年 12 月です。Flutter Live 2018 の中でメジャーバージョンが発表されたようです。それまでは beta でした。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__77d9e65f0a7bb" src="https://embed.zenn.studio/card#zenn-embedded__77d9e65f0a7bb" data-content="https%3A%2F%2Fdevelopers.google.com%2Fevents%2Fflutter-live" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://developers.google.com/events/flutter-live" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://developers.google.com/events/flutter-live</a></p>
<p>こちらが Flutter Live 2018 の映像です。</p>
<p><span class="embed-block embed-youtube"><iframe src="https://www.youtube-nocookie.com/embed/NQ5HVyqg1Qc" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen loading="lazy"></iframe></span><a href="https://youtu.be/NQ5HVyqg1Qc" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://youtu.be/NQ5HVyqg1Qc</a></p>
<p>そしてさらに 2 年後の 2021 年 3 月 に Flutter 2.0 がリリースされました。</p>
<p><span class="embed-block embed-youtube"><iframe src="https://www.youtube-nocookie.com/embed/zSbsIiluixw" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen loading="lazy"></iframe></span><a href="https://youtu.be/zSbsIiluixw" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://youtu.be/zSbsIiluixw</a></p>
<p>Flutter 2.0 では Flutter Web の Stable 対応が発表され、Flutter がモバイル向けのフレームワークからまたさらに飛躍することが示されました。</p>
<h1 id="flutter-%E3%81%AE%E3%81%93%E3%82%8C%E3%81%8B%E3%82%89">
<a class="header-anchor-link" href="#flutter-%E3%81%AE%E3%81%93%E3%82%8C%E3%81%8B%E3%82%89" aria-hidden="true"></a> Flutter のこれから</h1>
<p>Flutter は バージョン 2 系統から、 Android・iOS・Web の 3 つのプラットフォーム対応を Stable としてリリースしています。</p>
<p>そして今後はさらにそのプラットフォームを拡大することがすでにアナウンスされています。</p>
<h2 id="fuchsia">
<a class="header-anchor-link" href="#fuchsia" aria-hidden="true"></a> Fuchsia</h2>
<p>Google の <strong>謎の OS</strong> として話題になっている OS です。Google 製の OS といえば、Android がまず浮かぶと思います。次に Chrome OS でしょうか。そして、次に来ると言われているのが Fuchsia です。今後 Fuchsia を搭載したデバイスが徐々に出るのではないかといわれており、実際に Google の Nest Hub に搭載されているとかなんだとか。そんな Fuchsia ではその OS 上で動く GUI を Flutter で開発すると言われています。ということは、Fuchsia が搭載されたデバイスであればどれであっても Flutter が使えるということになると思って良いのかもしれません。これはこれまでのマルチプラットフォームという概念には収まらないように感じてしまいます。</p>
<p>Fuchsia と Flutter は 2021 年時点で以下のプロジェクトが進行中のようです。これからが楽しみですね。<br style="display:none">
<span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__03cd06b0954c6" src="https://embed.zenn.studio/card#zenn-embedded__03cd06b0954c6" data-content="https%3A%2F%2Ffuchsia.dev%2Ffuchsia-src%2Fcontribute%2Froadmap%2F2021%2Fflutter_on_fuchsia_velocity" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://fuchsia.dev/fuchsia-src/contribute/roadmap/2021/flutter_on_fuchsia_velocity" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://fuchsia.dev/fuchsia-src/contribute/roadmap/2021/flutter_on_fuchsia_velocity</a></p>
<h2 id="embedded">
<a class="header-anchor-link" href="#embedded" aria-hidden="true"></a> Embedded</h2>
<p>「Embedded: 組み込み」です。組み込みとは主にハードウェアデバイスを制御するためのプログラムのことです。以下の Flutter の公式の説明では、自動車の制御や冷蔵庫などの家電機器などが挙げられています。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__3929589a7b04f" src="https://embed.zenn.studio/card#zenn-embedded__3929589a7b04f" data-content="https%3A%2F%2Fflutter.dev%2Fembedded" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://flutter.dev/embedded" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://flutter.dev/embedded</a></p>
<p>この Embedded Flutter はあの Sony が関わっていることが話題になっています。実際、GitHub にある Sony のリポジトリにこんなものがあります。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__efa9d9aa9b35f" src="https://embed.zenn.studio/card#zenn-embedded__efa9d9aa9b35f" data-content="https%3A%2F%2Fgithub.com%2Fsony%2Fflutter-embedded-linux" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://github.com/sony/flutter-embedded-linux" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://github.com/sony/flutter-embedded-linux</a></p>
<p>そして、 Embedded Linux Conference にて以下の発表が行われました。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__47c8db229062d" src="https://embed.zenn.studio/card#zenn-embedded__47c8db229062d" data-content="https%3A%2F%2Felinux.org%2Fimages%2F6%2F61%2FOct_27_Graphical_User_Interface_Using_Flutter_in_Embedded_Systems_Hidenori_Matsubayashi.pdf" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://elinux.org/images/6/61/Oct_27_Graphical_User_Interface_Using_Flutter_in_Embedded_Systems_Hidenori_Matsubayashi.pdf" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://elinux.org/images/6/61/Oct_27_Graphical_User_Interface_Using_Flutter_in_Embedded_Systems_Hidenori_Matsubayashi.pdf</a></p>
<p><span class="embed-block embed-youtube"><iframe src="https://www.youtube-nocookie.com/embed/KN-ileJvorg" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen loading="lazy"></iframe></span><a href="https://youtu.be/KN-ileJvorg" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://youtu.be/KN-ileJvorg</a></p>
<p>すごいなぁという感想しか出てきません。こちらもとても楽しみですね。</p>
<h2 id="desktop">
<a class="header-anchor-link" href="#desktop" aria-hidden="true"></a> Desktop</h2>
<p>次に Stable になると思われるのがこの Desktop 対応ですね。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__ae5f0c0c7cb54" src="https://embed.zenn.studio/card#zenn-embedded__ae5f0c0c7cb54" data-content="https%3A%2F%2Fflutter.dev%2Fdesktop" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://flutter.dev/desktop" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://flutter.dev/desktop</a></p>
<p>Flutter Desktop は、Linux・MacOS・Windows のデスクトップアプリケーションを指します。Flutter Desktop はもうすでにある程度動いており、Codelab も提供されているので、実際に試してみることができます。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__fd3b9a295873c" src="https://embed.zenn.studio/card#zenn-embedded__fd3b9a295873c" data-content="https%3A%2F%2Fcodelabs.developers.google.com%2Fcodelabs%2Fflutter-github-graphql-client%2Findex.html" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://codelabs.developers.google.com/codelabs/flutter-github-graphql-client/index.html" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://codelabs.developers.google.com/codelabs/flutter-github-graphql-client/index.html</a></p>
<p>また、Flutter 2.0 が発表されたときに gSkinner からマルチプラットフォームのでもアプリケーションが公開されました。Flutter Folio です。</p>
<p><span class="embed-block embed-youtube"><iframe src="https://www.youtube-nocookie.com/embed/2eTY2QrNrAQ" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen loading="lazy"></iframe></span><a href="https://youtu.be/2eTY2QrNrAQ" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://youtu.be/2eTY2QrNrAQ</a></p>
<p>ソースコードはこちらからみることができます。</p>
<p>デスクトップ対応ではマウス操作を意識した実装（右クリックなど）があったり、Web のレスポンシブ対応があったりととても学びの多いサンプルだと思います。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__823b45a2bff41" src="https://embed.zenn.studio/card#zenn-embedded__823b45a2bff41" data-content="https%3A%2F%2Fgithub.com%2FgskinnerTeam%2Fflutter-folio" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://github.com/gskinnerTeam/flutter-folio" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://github.com/gskinnerTeam/flutter-folio</a></p>
<h2 id="2022-%E5%B9%B4%E3%81%AF%E3%83%BB%E3%83%BB%E3%83%BB%EF%BC%9F">
<a class="header-anchor-link" href="#2022-%E5%B9%B4%E3%81%AF%E3%83%BB%E3%83%BB%E3%83%BB%EF%BC%9F" aria-hidden="true"></a> 2022 年は・・・？</h2>
<p>さて、2022 年はどうなるのでしょうか。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__a53381b466c33" src="https://embed.zenn.studio/card#zenn-embedded__a53381b466c33" data-content="https%3A%2F%2Fnotifications.google.com%2Fg%2Fvib%2FAD-FnExFFDtUis-qimfNXVZ61Z3VB46rn2YC9AadCKVfMui12a6saWJQaxqEFFc6bj7GaSH0U6GdBCUkzfCoQQRqebIIlHfacymT1DfjFVPKSMQNGDgOTBJM8FAvSqL1kbXuDBWiIVyYFTqmH-Tn7K13qd-xmP_g8KbX5zkL2Thx_0xBGJ6F7fnM1Jx57CnnoBPucLBgQS6aIKOfNQRixWHUUobaSVdo7uD98CuMyCmmVjkT6NSeYssKPm4lnRz3PDtEaiQZrz53Yro9KResjTCF9c_xjto" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://notifications.google.com/g/vib/AD-FnExFFDtUis-qimfNXVZ61Z3VB46rn2YC9AadCKVfMui12a6saWJQaxqEFFc6bj7GaSH0U6GdBCUkzfCoQQRqebIIlHfacymT1DfjFVPKSMQNGDgOTBJM8FAvSqL1kbXuDBWiIVyYFTqmH-Tn7K13qd-xmP_g8KbX5zkL2Thx_0xBGJ6F7fnM1Jx57CnnoBPucLBgQS6aIKOfNQRixWHUUobaSVdo7uD98CuMyCmmVjkT6NSeYssKPm4lnRz3PDtEaiQZrz53Yro9KResjTCF9c_xjto" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://notifications.google.com/g/vib/AD-FnExFFDtUis-qimfNXVZ61Z3VB46rn2YC9AadCKVfMui12a6saWJQaxqEFFc6bj7GaSH0U6GdBCUkzfCoQQRqebIIlHfacymT1DfjFVPKSMQNGDgOTBJM8FAvSqL1kbXuDBWiIVyYFTqmH-Tn7K13qd-xmP_g8KbX5zkL2Thx_0xBGJ6F7fnM1Jx57CnnoBPucLBgQS6aIKOfNQRixWHUUobaSVdo7uD98CuMyCmmVjkT6NSeYssKPm4lnRz3PDtEaiQZrz53Yro9KResjTCF9c_xjto</a></p>
<p>Flutter 公式から、2021 年の振り返りと、2022 年の抱負が出ています。</p>
<p>この中に</p>
<blockquote>
<p>We’re going to complete our stable desktop support and further expand our work on the web.</p>
</blockquote>
<p>という一文がありました。Desktop、Web がどんどんパワーアップしてくれることに期待しています。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__548a12e7058ab" src="https://embed.zenn.studio/card#zenn-embedded__548a12e7058ab" data-content="https%3A%2F%2Fdocs.flutter.dev%2Fdevelopment%2Ftools%2Fsdk%2Freleases" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://docs.flutter.dev/development/tools/sdk/releases" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://docs.flutter.dev/development/tools/sdk/releases</a></p>
<p>そろそろ Ver.3.0 が見えてきているような気がしますね!!</p>
<h1 id="%E3%81%BE%E3%81%A8%E3%82%81">
<a class="header-anchor-link" href="#%E3%81%BE%E3%81%A8%E3%82%81" aria-hidden="true"></a> まとめ</h1>
<p>Flutter の歴史から今後の展望まで、これまでに発表された情報を並べて見ました。Flutter を勉強しようというモチベーションアップにつながれば幸いです。</p>
<p>ではでは。</p>
<p>すぎっと ٩( ᐛ )و</p>


Flutterの歴史をちょっとだけ調べてみた

Discussion