Dart入門：基本的な構文10個のサンプルから学ぶDartプログラミングの基礎【Flutter】

Flutter
2023.04.12

Flutterアプリケーションを構築するためにはDartという言語を習得する必要があります。ここではFlutterでモバイルアプリを作りたい、Webアプリを作りたいという方に向けてDartの基本的な知識と基本スキルを身に着けられるようにまとめておきます。出来るだけ分かりやすく説明したいと思います。
(注：メインイメージはDart公式の画面キャプチャーです)

Dartとは

Dart（ダート）は、Googleが開発しているオープンソースのプログラミング言語です。2011年に最初に発表され、JavaScriptやJavaなどの既存の言語に影響を受けて設計されました。

現在、Webアプリケーションやモバイルアプリケーションなど、さまざまなプラットフォームで利用されています。また、Dartはフルスタックの開発フレームワークであるFlutterの公式言語でもあり、Flutterアプリケーションの開発において広く使用されています。

特にオブジェクト指向プログラミングに焦点を当てており、静的型付けと動的型付けの両方をサポートしています。また、DartはJavaScriptにコンパイル（ビルド）することができるため、Webアプリケーションのフロントエンドにも使用されています。

dartファイルの拡張子

Dartファイルの拡張子は .dartです。

React Nativeとの違い

FlutterとReact Nativeはよく比較され、どちらが優れているか、どちらの方が需要があるのか議論されることが多いです。本サイトでも『React Nativeオワコン論争2022』という記事で紹介しました。

ですがDartで書かれたFlutterと、JavaScriptで書かれたReact Nativeは、モバイルアプリケーションの開発においてどちらも非常に人気があります。以下は、FlutterとReact Nativeの主な違いです。

  1. プログラミング言語：Flutterは、Dartを使用しています。一方、React Nativeは、JavaScriptとReactというライブラリを使用しています。
  2. コンパイル方法：Flutterは、アプリケーションをネイティブコードにコンパイルして実行します。これにより、高速で応答性の高いアプリケーションを作成することができます。React Nativeは、JavaScriptコードをネイティブコードにトランスコンパイル（トランスパイル）*して実行します。
    *トランスパイルとはあるプログラミング言語を別の言語に変換することです。
  3. UIの構築方法：Flutterは、UIをウィジェットと呼ばれるビルディングブロックから構築します。一方、React Nativeは、コンポーネントと呼ばれるビルディングブロックから構築します。
  4. コミュニティ：Flutterのコミュニティは、比較的新しいものですが、急速に成長しています。一方、React Nativeのコミュニティも大きく、多数のサードパーティーパッケージやドキュメントが利用可能です。どちらもドキュメントが探しやすく開発にも有用です。
    （Flutter Japanコミュニティ：https://www.flutterjp.com/）
  5. 開発者のスキル：FlutterはDartという比較的新しい言語を使用しているため、開発者は新しいスキルを学ぶ必要があります。一方、React NativeはJavaScriptを使用しているため、多くのWeb開発者にとって、より親しみやすいものになっています。

どちらのフレームワークを選択するかは、プロジェクトの要件や開発者のスキルセットによって異なります。ただ、Google Trendsによると最近ではFlutterの検索需要がReact Natveを圧倒しているのが分かります。（参考：https://trends.google.co.jp/trends/explore?date=today%205-y&geo=JP&q=flutter,React%20native&hl=ja）

Dart 5つの特徴

Googleが開発したオープンソースのプログラミング言語のDartには以下のような特徴があります。

  1. オブジェクト指向言語：オブジェクト指向言語で、クラス、継承、インターフェース、抽象クラスなどのオブジェクト指向の概念をサポートしています。
  2. JITとAOTの両方をサポート：JIT（Just-In-Time）コンパイラとAOT（Ahead-Of-Time）コンパイラの両方をサポートしています。JITコンパイラは、実行時にコードをコンパイルすることで、開発プロセスを迅速化し、リアルタイムのデバッグを可能にします。AOTコンパイラは、アプリケーションを実行する前にコードをコンパイルすることで、高速で最適化されたコードを生成します。
  3. アジャイル開発に適した言語：実験的なコードを書くことが容易で、アジャイルな開発に適しています。また、Dartの文法は、JavaやJavaScriptに影響を受けているため、JavaScript、Java、C#、Swiftなどのプログラミング言語の開発者にとって馴染みやすいものになっています。
  4. 非同期プログラミングのサポート：非同期プログラミングをサポートしており、イベント駆動型のアプリケーションを簡単に実装することができます。Dartの非同期プログラミングは、async/awaitキーワードを使用することで、シンプルで読みやすいコードを書くことができます。
  5. Flutterとの親和性：Googleが開発したUIフレームワークであるFlutterの公式言語であり、Flutterでモバイルアプリケーションを開発する場合、Dartを使用することが推奨されています。

以上が、Dartの主な特徴です。Dartは、高速で安全なアプリケーションの開発に適した言語で、モバイルアプリケーションの開発において広く利用されています。Dartで書かれたFlutterアプリをWebアプリケーションとしてビルドすることも可能です。

環境構築の方法、Dartの始め方

  1. Dart SDKのインストール：まず、Dart SDKをダウンロードしてインストールします。Dart SDKは、Dartのコンパイラ、ライブラリ、開発ツールなどが含まれています。
    Windowsの場合、以下のサイトからインストーラーをダウンロードして実行します。 https://dart.dev/get-dart

    macOSの場合、以下のコマンドをターミナルで実行します。
brew tap dart-lang/dart
brew install dart
  1. Dartのエディタのインストール：次に、Dartを開発するためのエディタをインストールします。Dartには、VS CodeやAndroid Studio、IntelliJ IDEAなどのIDE*が用意されています。
    *IDEとは、Integrated Development Environment（統合開発環境）の略称で、ソフトウェア開発のための統合環境を提供するツールのことです。
  2. IDEのDartプラグインのインストール：Dartを開発するためには、IDEにDartプラグインをインストールする必要があります。IDEによっては、Dartプラグインが標準でインストールされている場合がありますが、インストールされていない場合は、IDEのプラグインマネージャーからDartプラグインをインストールします。
  3. プロジェクトの作成：開発環境が整ったら、Dartのプロジェクトを作成します。IDEによっては、プロジェクトのテンプレートが用意されている場合があります。また、コマンドラインからも、以下のようなコマンドでプロジェクトを作成することができます。
dart create <プロジェクト名>

Dartの基本的な構文（サンプル付き）

変数と型

Dartでは、変数の型を明示的に指定することができます。また、varキーワードを使って型推論も行うこともできます。

// 変数の宣言のサンプル
String name = "Taro";
int age = 58;
var height = 162.2;

条件分岐

Dartでは、if-else文やswitch文を使って条件分岐を行うことができます。

// if文のサンプル
if (score >= 90) {
  print("Excellent");
} else if (score >= 60) {
  print("Good");
} else {
  print("Failed");
}

// switch文のサンプル
switch (day) {
  case "Monday":
    print("Today is Monday");
    break;
  case "Tuesday":
    print("Today is Tuesday");
    break;
  default:
    print("Today is not Monday or Tuesday");
}

ループ

Dartでは、forループやwhileループを使って繰り返し処理を行うことができます。

// for文のサンプル
for (var i = 0; i < 10; i++) {
  print(i);
}

// while文のサンプル
var i = 0;
while (i < 10) {
  print(i);
  i++;
}

関数

関数を定義して再利用することができます。関数は引数を受け取って処理を実行し、戻り値を返すことができます。

// 関数のサンプル（戻り値無し）
void sayHello(String name) {
  print("Hello, $name!");
}

// 関数のサンプル（戻り値ind型）
int add(int x, int y) {
  return x + y;
}

クラスとオブジェクト

Dartはオブジェクト指向の言語であり、クラスとオブジェクトをサポートしています。クラスは、データとメソッドをまとめたもので、オブジェクトは、クラスのインスタンスです。

// クラスのサンプル
class Person {
  String name;
  int age;

  Person(this.name, this.age);

  void sayHello() {
    print("Hello, my name is $name.");
  }
}

// クラスをオブジェクトとして使用するサンプル
var john = Person("John", 25);
john.sayHello();

オブジェクト指向プログラミング

Dartはオブジェクト指向言語であり、すべてのデータがオブジェクトで表されます。

クラスはフィールド（変数）とメソッド（関数）を持ち、フィールドはオブジェクトの状態を表します。メソッドはオブジェクトが実行できる操作を定義します。

Dartのオブジェクト指向プログラミングには、クラス継承、抽象クラス、インターフェース、ミックスインなどの機能があります。これらを使用することで、コードの再利用性を高め柔軟性のあるコードを作成することが可能になります。

Dartは、オブジェクト指向プログラミングの原則であるカプセル化、継承、ポリモーフィズムをサポートしています。また、null safety（null安全性）を持っているため、null値がオブジェクトにアクセスすることを防止し、コードの安全性を高めることができます。

Dartの何がいいのか？や今後の展望について

Dartの魅力は、以下のように挙げることが出来るでしょう。

  1. オブジェクト指向言語であること：Dartは完全なオブジェクト指向言語であり、すべてがオブジェクトで表されます。これにより、コードの再利用性や保守性が向上し、大規模なプロジェクトにも適しています。
  2. JITとAOTの両方をサポートしていること：JIT（Just-In-Time）コンパイルとAOT（Ahead-Of-Time）コンパイルの両方をサポートしています。これにより、高速な開発やデバッグが可能であり、同時に、高速で効率的な実行ファイルを生成することもできます。
  3. Flutterとの相性の良さ：Googleが開発したモバイルアプリ開発フレームワークであるFlutterの公式言語です。Flutterは、Dartを使用してアプリを開発することができ、アプリのパフォーマンスやビジュアルデザインに優れています。
  4. null safetyの導入：Dart 2.12からは、null safetyが導入され、null値がオブジェクトにアクセスすることを防止し、より安全なコードを書くことができます。

今後の展望としては、DartはFlutterの発展とともに成長しています。Googleは、FlutterをWebアプリケーションやデスクトップアプリケーションにも拡張する計画を進めており、これにより、Dartの需要は今後ますます高まることが予想されます。また、DartはフルスタックのWeb開発にも使用されるようになっており、今後ますますその範囲が広がることが期待されています。

Flutterで作られたアプリケーション

Flutterで作成されたアプリケーションはFlutter公式のShowcaseページで確認することが出来ます。BMWのアプリ、Google Pay、Nubankが目玉作品のようです。

追加でGoogle I/O 2022で公開されたピンボールゲームを紹介します。FlutterとFirebaseで構築されているとのことです。（参考：https://io.google/2022/products/flutter/intl/ja/）
https://pinball.flutter.dev/#/

Dartを学習する上で役立つWebサイト

以下は、Dartを学ぶために役立つWebサイトです。開発や勉強の際に便利ですので是非利用してみてください。

  1. Dart.dev: Dartの公式サイト。Dartの基礎から上級者向けのトピックまで幅広い情報を提供しています。
    https://dart.dev/
  2. DartPad: Dartのコードを簡単に試すことができるオンラインエディター。Dartの基本的な構文やコードの動作確認などに便利です。
    https://dartpad.dev/
  3. Flutter.dev: Googleが開発したFlutterの公式サイトであり、Dart言語のドキュメントも提供しています。Flutterを使用したアプリ開発に興味がある場合は、こちらのサイトもチェックしてみてください。
    https://flutter.dev/
  4. Dart Academy: Dartの入門チュートリアルや、フルスタックWebアプリケーションの開発方法についての記事など、Dartに関する幅広い情報を提供しています。
    https://dart.academy/

当サイトでも役立ちそうなトピックを掲載しているのでよかったら見てみてくださいね！
https://engineering.webstudio168.jp/category/flutter/

タイトルとURLをコピーしました