新しくなったSwift Playgrounds 4.0



# Swift Playgroundsとは
iPadまたはMacで動作し、コーディングを学ぶことができる無料のアプリです。
Swift Playgrounds 4では、iPad上から直接iPhoneとiPad向けのAppを構築して、そのまま公開できるようになりました。最新の開発フレームワークであるSwiftUIに対応しているので、アプリをビルドしながらプレビューを確認できます。テストのために、全画面モードでAppを実行することもできます。

Swift Playgroundsについて詳しくは、[Appleの開発者サイト](https://developer.apple.com/jp/swift-playgrounds/)で確認できます。

# 注目すべきアップデート
注目すべきアップデートは、学習コンテンツに__Appプロジェクト__のシリーズが追加されたことです。これまでは、「コードを学ぼう」と「チャレンジ」の2つのシリーズがコーディング学習の主なコンテンツシリーズでした。Appプロジェクトはその名の通り、実際に動作するアプリのプロジェクトを通して「どのようにしてSwiftUIフレームワークを使ったアプリを開発するか」を学習します。
注意すべき点として、以下の2つが挙げられます。

* コーディングの基礎は学習済みであることが前提
* Intel Macでは、Appプロジェクトを開くことができない
 
コーディング基礎については、「コードを学ぼう1 Swiftの基礎」および「コードを学ぼう2 中級編」で学んでおくと良いでしょう。そして、Appプロジェクトのコンテンツを開くには、64bit CPUが搭載されたiPad、またはAppleシリコン搭載Macが必要なようです。

# 主なコンテンツのシリーズ
Swift Playgroundsアプリをダウンロードした直後は、学習コンテンツはひとつもありません。自分のスキルレベルに見合ったコンテンツを見つけて、ダウンロードする必要があります。学習コンテンツは入手ボタンをタップすることで、ブックとしてダウンロードできます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/70476/9a247f52-bef8-a931-4853-9d447e76bf1f.png "iPad版アプリのプレイグラウンド選択画面")

なお、Swift言語のバージョンが古いコンテンツも混在している点に留意してください。例えば、「ブック」というシリーズはすべてのコンテンツが__Swift 5.3版__です。このシリーズは、以前のSwift Playgroundsアプリでは「チャレンジ」というシリーズで、より目的が絞り込まれたコーディングを学習することができました。

以下に、主な学習コンテンツのシリーズを紹介します。なお、特に明記がないものは__Swift5.5版__です。

### 「コードを学び、Appを作る」シリーズ

* コーディングを始めよう（Swift 5.3版）
* Appの作成を始めよう
* コードを学ぼう1（Swift 5.3版）
* コードを学ぼう2（Swift 5.3版）

コーディング経験がない場合は、「コードを学ぼう1」から学習を始めましょう。「コードを学ぼう2」も完了すれば、「コーディングを始めよう」を学ぶ必要はありません。「コーディングを始めよう」は予習的な内容になっているので、先にこちらを完了してから「コードを学ぼう」に取り掛かるのも悪くはないでしょう。

そして、Appプロジェクトシリーズに進む前に、「Appの作成を始めよう」を完了しておくことをお勧めします。

### 「Appプロジェクト」シリーズ

* プロフィール
* ミームメーカー
* 自分だけの物語を選択する
* 水準器
* 予定表
* 地震計
* イメージギャラリー

このシリーズでは、SwiftUIフレームワークを使ったアプリ開発の要領を学ぶことができます。

### 「Appを拡張する」シリーズ

* グリッドを使った整理
* グリッドの編集
* ジェスチャの認識

このシリーズは、SwiftUIアプリの開発に関する基本を理解した後のステップです。より高度なアプリを開発するために必要なスキルを理解します。

# Appプロジェクト
SwiftUIフレームワークを使ってアプリを開発するには、独特なコード様式で記述しなければいけない上に、動作する仕組みも理解する必要があります。Appプロジェクトでは、これを「実際に動作するアプリのプロジェクト」を通して学習するスタイルになっています。

下の画像は、Appプロジェクト「自分だけの物語を選択する」を開いた直後のスクリーンショットです。
![IMG_0497.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/70476/7e0760f4-70e3-c81b-fe3b-c047c3d30ce6.jpeg)

画面の左側にコードとガイド、右側には開発中のアプリがライブプレビューとして表示されています。ガイドに従ってコードを追加したりカスタマイズすると、ライブプレビューにその変更が反映される仕組みになっています。これは、Xcodeを使ったSwiftUIアプリの開発と同様です。

以降、Appプロジェクトの各コンテンツで「何をどのように学ぶのか」を解説します。

## プロフィール
これは、自分を紹介するためのプロフィールアプリのプロジェクトです。
タブのナビゲーションについて学ぶことができます。他にも、以下の概念を学びます。

* タブ形式のインターフェイスとは
* 画像ビュー
* テキストビュー
* スクロールビュー
* `@State`属性

このAppプロジェクトについて、[こちらの投稿](https://qiita.com/imchino/items/704f49e071f1467c5452)で解説しています。

## 自分だけの物語を選択する
これは、選択形式で進行するアドベンチャーのゲームアプリのプロジェクトです。
ナビゲーションビューの基本を学ぶことが出来ます。他にも、以下の概念を学びます。

* ナビゲーション
* スクロール
* データコレクションを利用してビューを作成する方法
* モデルデータの導入する方法

このAppプロジェクトについて、[こちらの投稿](https://qiita.com/imchino/items/fb6c97a9647080f03b1b)で解説しています。

## 地震計
これは、振動データをメーターまたはグラフ形式で表示するアプリのプロジェクトです。
モーションセンサーのデータを可視化する方法を学ぶことが出来ます。他にも、以下の概念を学びます。

* CoreMotionフレームワーク
* 経過的に変化するデータに基づいて、ビューを更新する方法
* シンプルなシェイプ（図形）を描画する方法

このAppプロジェクトについて、[こちらの投稿](https://qiita.com/imchino/items/bd9e9e2b7badeeae5a60)で解説しています。

## 水準器
これは、デバイスを傾けると反応するアプリのプロジェクトです。
モーションセンサーのデータにアクセスする方法を学ぶことが出来ます。他にも、以下の概念を学びます。

* 加速度センサーを使って、モーションデータを取得する方法
* データをグラフィカルに表示する方法
* CoreMotionフレームワーク
* シェイプ（図形）を描画する

このAppプロジェクトについて、[こちらの投稿](https://qiita.com/imchino/items/be8a745a3a76d6ef9927)で解説しています。

## 予定表
これは、いくつかのイベントを日付ごとに整理するアプリのプロジェクトです。
リスト形式でデータを表示する方法を学ぶことが出来ます。他にも、以下の概念を学びます。

* オブザーバブル・データモデルを導入する方法
* データを動的にリスト表示する方法

このAppプロジェクトについて、[こちらの投稿](https://qiita.com/imchino/items/40f9438ddd5479c2645b)で解説しています。

## ミームメーカー
パンダのミームを作成するためのアプリ

* インターネットから画像データをダウンロード
* 非同期および並行プログラミング

## イメージギャラリー
写真を選択して編集できるアプリのプロジェクトです。
速度と応答性を保ちつつ、写真を操作する方法を学ぶことが出来ます。他にも、以下の概念を学びます。

* 非同期プログラミング
* 画像データをグリッド形式で表示する方法
* オブザーバブル・データモデルを使って、データの一貫性を維持する方法