クロスプラットフォームフレームワークを全速力で紹介する/Very Rough Introduction of Cross Platform Frameworks

発表の機会を頂いたので、折角だから自分が今まで(無駄に)長い時間を掛けて調べていたクロスプラットフォームフレームワークについてまとめて紹介しようと作成したものです。
カタログ的にパラパラ見てもらえればと思います。

(MANIFEST2017というイベントのLTで発表した時の資料(訂正及び加筆版)です)

Transcript

1. アミーゴ  WL_Amigo  https://github.com/WL-Amigo
2. クロスプラットフォームフレームワークとは？ • 基本 1 つのコードで • 複数のプラットフォーム向けに配布可能な • アプリケーションを開発できるフレームワーク • プラットフォーム • OS 、デバイス、 CPU アーキテクチャ (x86,amd64,arm...) などの組み合わせ
3. なぜクロスプラットフォームフレームワーク？ • 複数のプラットフォームをターゲットとする時に 同じコードを書きなおさなくて良い！！！ • OS やデバイスに依存する機能を抽象化してくれるので、 フレームワークが提供するライブラリを使う限りはコードは 1 つで良い • プラットフォーム特有の知識がほぼ必要ないので 学習コストを抑えられる！！！ • ついでにプログラミング言語の選択の幅が広がったりとか
4. 本日紹介するフレームワークについて • GUI アプリケーションが ( も ) 作れる • ものによってはコンソールアプリケーションも作れます • ローカルで実行するアプリが作れる • ブラウザ向けのフレームワークは今回は省略 • 発表者の趣味で若干 Linux 対応のものが多いです • 紹介する項目 • 使用するプログラミング言語 • 対応プラットフォーム • 開発環境の対応プラットフォーム • ライセンス • 特徴 • 作例 使ってる ! 少し使ってる 調べただけ ほぼ 知 識 量 ・ 信 頼 度
5. Qt • 言語 : C++, javascript(ES5), QML • 対応プラットフォーム : Win OSX Lin And iOS      • 組み込み環境にも使えるらしい • 開発環境 : Win OSX Lin    • ライセンス : LGPLv3, 商用ライセンス • 特徴 • とにかくモジュールの数が多い • Widget, 3D, Multimedia, WebEngine, Sensors, Bluetooth, NFC... • GUI デザイナ , 国際化補助など、多くの補助ツールが付属 • そこそこ豊富なドキュメント・チュートリアル・サンプルプログラム • コンパイル言語を使うので動作オーバーヘッドは最小のはず • 環境のセットアップやフレームワークのバージョン管理が比較的ラク • 多くの商業利用事例 (Panasonic, LG, AMD, ...) → 強い安心感 使ってる !
6. • Krita - 高機能なペイントソフト Qt - 作例 使ってる ! https://krita.org/jp/features-jp/highlights-jp
7. • Google Earth (desktop) - 地球儀ソフト Qt - 作例 使ってる ! https://www.google.com/intl/ja/earth/deskto
8. Xamalin • 言語 : C# • 対応プラットフォーム : Win OSX And iOS     • 開発環境 : Win OSX   • ライセンス : 5 人までのチームなら無料 , 商用ライセンス • 特徴 • C# でモバイルアプリが書ける • 組み込み async/await, 無名関数 , 属性 ... • パッケージマネージャが利用可能 (NuGet) • 多くの商業利用事例 ( 参照 : https://www.xamarin.com/customers) • 2016 年に Microsoft が買収したので安心？ • 作例を見るとネイティブルックなモバイルアプリを書きやすい印象 調べただけ ほぼ
9. Xamalin - 作例 調べただけ ほぼ https://www.microsoft.com/ja-jp/casestudies/smbc3.a • 三井住友銀行 - スピードアンサー 15
10. Xamalin - 作例 調べただけ ほぼ http://www.sakenomy.jp/newl • Sakenomy
11. Apache Cordova • 言語 : HTML5 + CSS + javascript • 対応プラットフォーム : And iOS   • 開発環境 : Win OSX Lin    • ライセンス : Apache License 2.0 • 特徴 • いわゆるハイブリッドアプリ用のフレームワーク • 標準プラグインでカメラやセンサへのアクセスが可能 • UI のサポートは付属していないので別途 UI フレームワーク等が必要 • 他のクロスプラットフォームフレームワークのバックエンドに 利用されている (Ionic Framework 等 ) 調べただけ ほぼ
12. NativeScript • 言語 : TypeScript(+Angular2) + XML + CSS(subset) • 対応プラットフォーム : And iOS   • 開発環境 : Win OSX Lin    • ライセンス : Apache License 2.0 • 特徴 • 「 javascript エンジンとネイティブ機能をバインディングする」 という発想のフレームワーク • UI 描画などはネイティブレイヤで行われる • そこそこ豊富なプラグイン (SNS 連携、バーコードリーダ等 ) • チュートリアルが丁寧 • ほぼ Angular2 前提のため慣れるまでは大変そうだけど、 Angular2 の知識はブラウザアプリを作る時などにも応用可能 少し使った
13. • NativeScript with Angular のチュートリアル NativeScript - 作例 少し使った https://docs.nativescript.org/angular/tutorial/ng-chapter-4.
14. Electron • 言語 : HTML5 + CSS + javascript(ES6) • 対応プラットフォーム : Win OSX Lin    • 開発環境 : Win OSX Lin    • ライセンス : MIT • 特徴 • Chromium をまるごと積んで動作するデスクトップ向けフレームワーク • 開発者がよく使ってそうなツールが実はこれを使っていることが 多い印象 (Atom, VSCode, Slack(desktop), GitKraken 等 ) • 背後で Node.js が動くので、強力な Node の API や Package が使える • 標準の UI フレームワークは無いように見えるので別途用意が必要 • Photon, React Desktop, Webix 等 少し使った
15. • Atom Electron - 作例 少し使った https://atom.io/
16. • GitKraken Electron - 作例 少し使った https://www.gitkraken.com/
17. Mono • 言語 : C# • 対応プラットフォーム : Win OSX Lin    • 開発環境 : Win OSX Lin    • ライセンス : MIT • 特徴 • 「 .NET Framework を Linux にも持ち込もう」という規模感が ぶっ飛んだ発想が源流のフレームワークで、 Xamarin Framework の元 • .NET 4.6 までの API はサポートされていて、 NuGet も使える • アセンブリ自体が OS を超えて使えるのが大変良い ( リビルド不要 ) • GUI ツールキットは Gtk# や Xwt を使うと良さそう • Gtk# - 既に多くの作例あり、 OSX だとネイティブルックに ならない • Xwt - 各 OS でネイティブ UI のバインディングを提供、発展途上 少し使ってる
18. • MonoDevelop Mono - 作例 少し使ってる http://www.monodevelop.com/screens
19. • KeePass Mono - 作例 少し使ってる http://keepass.info/index.htm
20. さいごに • ここ数年で環境が劇的に進化し、「本当に 1 コードだけだと フレームワークの制約で機能がところどころ抜け落ちる」 ということはほぼ無くなったと思います • あとはメンテナンスの信頼感と好みで！ Happy Cross-platform Developing! プレゼンテーションテーマ : fedora-patterns-clover (CC-BY, by Emily Dirsh) 素敵なかわいいキャラクター立ち絵 : エトリエ様 (http://etolier.webcrow.jp/index.html) 各フレームワークのロゴはそれぞれの公式ページ・リポジトリよりお借りしました