クロスプラットフォーム開発(フレームワーク：Flutter,React Native)の基本の基

##クロスプラットフォームフレームワーク(Flutter,React Native)の基本の基
クロスプラットフォームフレームワークを用いてこれから開発をするため、いろいろ情報収拾いたしました。

その情報を自己学習も踏まえてこちらにまとめさせていただこうと思います!


##そもそもクロスプラットフォーム開発とは
そもそも「クロスプラットフォーム」は「異なるプラットフォーム上で、同じ仕様のものを動かすことが出来るプログラム」のことを言います
※同様の呼称に「マルチプラットフォーム」もあります。

そして、言葉そのままではありますが、「クロスプラットフォーム開発」とはiOS、Android,windows,mac osなど複数の動作環境で作動するプログラムを「開発」することです。


[wikipedia:クロスプラットフォーム](https://ja.wikipedia.org/wiki/%E3%82%AF%E3%83%AD%E3%82%B9%E3%83%97%E3%83%A9%E3%83%83%E3%83%88%E3%83%95%E3%82%A9%E3%83%BC%E3%83%A0#:~:text=%E3%82%AF%E3%83%AD%E3%82%B9%E3%83%97%E3%83%A9%E3%83%83%E3%83%88%E3%83%95%E3%82%A9%E3%83%BC%E3%83%A0%EF%BC%88%E8%8B%B1%3A%20cross%2D,%E3%82%92%E5%8B%95%E3%81%8B%E3%81%99%E3%81%93%E3%81%A8%E3%81%8C%E5%87%BA%E6%9D%A5%E3%82%8B)

従来は基本的に、ソフトウェアは動作させる環境を想定し、それに合わせた開発環境・言語で作成します。そのため、１つのプログラムが想定していない他の環境では動作しないのが普通でした。

しかし、近年多くの動作環境が出てきておりマルチデバイス対応が必要不可欠となってきております。

そこで、一つ一つ環境ごとにプログラムを作成するのが非効率なため、一つのプログラムで複数環境に対応・リリースできるクロスプラットフォーム開発が注目されています。

##メジャーなクロスプラットフォーム開発のフレームワーク
特に多く利用されているのがFlutter（フラッター）とReact Native（リアクトネティブ）の２つになります!

（ゲーム作成の場合はこれらではなく、3D グラフィック作成が可能なUnityを利用することとなります。）

#####※確認：そもそもフレームワークとは
参考サイト
[ソフトウエアのフレームワークとはなにか](https://xtech.nikkei.com/it/article/lecture/20070205/260697/)
[フレームワークとライブラリの違い](https://qiita.com/azuki8/items/ad7710fdefaedc63e3f7)

##Flutter（フラッター）とReact Native（リアクトネティブ）の差

以下に比較表を作成してみました。

|  | Flutter（フラッター） | React Native（リアクトネティブ） |
|:-----------:|:------------:|:------------:|
| 開発会社       | Google | Facebook |
| 利用者数   | 92.8K (2020年5月時点)    | 87.3K (2020年5月時点)    |
| 言語       | Dart(Google社が開発した言語) |Javascript(React) |
| 開発環境       | Android Studio, IntelliJ IDEA, Visual Studio Code |Nuclide, Visual Studio Code |
| ホットリロード    | ◯     | ◯     |
| UI作成     | 独自のデザインUI(そのため、統一して同UIで表示可能)      | OSのUIを使用。そのため、UIデザインにはやや制限(プラットフォームごとにUIが異なる)       |
| ライブラリ       | 2018年の公開のため、比較的少ないが増加数は多くトップクラスに追いついてきている        | 2015年公開と比較的公開が早いため、数の多さはトップクラス         |
| デメリット         | 開発したアプリケーションのサイズが大きくなりやすい。          | React Nativeのアップデートが多い。比較的CPUやメモリの負荷が大きい。|
| 採用例       | Xianyu, Hamilton, Google Ads, Baidu       | Instagram, Facebook, Facebook Ads, Skype, Tesla       |

## 結局どっちが良いの？
####各サイトで言われていたこと
いろいろなサイトをみたり、データを見ましたが、どれを見ても「優劣はつけれずスキルセットなど現在の自身の状況に合わせて考えたり、実現したいUIやアニメーションなどを考慮したときに有意な方を選べば良い」という記載・説明がほとんどでした。

####所感
一応、Flutter（フラッター）の方が後発だけど成長率が高く、現在すでにReact Nativeよりも人気がある(利用者数、検索数共に)という点ではFlutterの方が今後伸びていくのかなという感想を個人的には持ちました。
※Flutterの検索数が伸びているのに対し、React Nativeは検索数は横ばい・・・
やはり、開発会社であるGoogleは世界有数の企業で成長しておりサービスも多くあるので、いろいろと有利な点・人気がある要素が多いのでしょうか。。。

[Flutterの将来性に注目！Flutterの期待値をがっちり把握](https://www.sejuku.net/blog/125651)

あとは、どちらか良いのか検討する中で実際にReact NativeからFlutterに切り替えた開発者の記事もありましたので、参考にみてみると良いかもしれません。
[なぜ私がフラッターにネイティブに反応したままにしたのか：パート1](https://tech-ja.netlify.app/articles/ja511330/index.html)

##参考サイト
[モバイルアプリのクロスプラットフォーム開発：Flutter vs. React Nativeを徹底比較](https://kaopiz.com/ja-news-cross-platform-framework-flutter-vs-react-native/)

[クロスプラットフォームフレームワーク比較 2021（Flutter, React Native, Xamarin, Unity](https://qiita.com/nskydiving/items/c13c949cc17c6f980a67)

[React Native VS Flutter アプリ開発に必要な5つの比較ポイント](https://deha.co.jp/magazine/react-native-vs-flutter-5-comparison-points/)

[モバイルクロスプラットフォームの技術検証](https://tech-blog.rakus.co.jp/entry/20201210/cross-platform)