fmt

Author: rdlabo

docs/angular/quickstart.md

@@ -14,23 +14,23 @@ sidebar_label: Quickstart
 import DocsCard from '@components/global/DocsCard';
 import DocsCards from '@components/global/DocsCards';
 
-ようこそ！このガイドでは、Ionic Angular開発の基本を説明します。開発環境のセットアップ、シンプルなプロジェクトの生成、プロジェクト構造の探索、Ionicコンポーネントの動作方法を学びます。最初の実際のアプリを構築する前にIonic Angularに慣れるのに最適です。
+ようこそ！このガイドでは、Ionic Angular 開発の基本を説明します。開発環境のセットアップ、シンプルなプロジェクトの生成、プロジェクト構造の探索、Ionic コンポーネントの動作方法を学びます。最初の実際のアプリを構築する前に Ionic Angular に慣れるのに最適です。
 
-Ionic Angularとは何か、Angularエコシステムにどのように適合するかの高レベルの概要をお探しの場合は、[Ionic Angularの概要](overview)を参照してください。
+Ionic Angular とは何か、Angular エコシステムにどのように適合するかの高レベルの概要をお探しの場合は、[Ionic Angular の概要](overview)を参照してください。
 
 ## 前提条件
 
-始める前に、マシンにNode.jsとnpmがインストールされていることを確認してください。
+始める前に、マシンに Node.js と npm がインストールされていることを確認してください。
 次を実行して確認できます：
 
 ```shell
 node -v
 npm -v
 ```
 
-Node.jsとnpmがない場合は、[こちらからNode.jsをダウンロード](https://nodejs.org/en/download)してください（npmが含まれています）。
+Node.js と npm がない場合は、[こちらから Node.js をダウンロード](https://nodejs.org/en/download)してください（npm が含まれています）。
 
-## Ionic CLIでプロジェクトを作成
+## Ionic CLI でプロジェクトを作成
 
 まず、最新の[Ionic CLI](../cli)をインストールします：
 
@@ -103,7 +103,7 @@ And its template in `app.component.html`:
 </ion-app>
 ```
 
-これにより、Ionicの`ion-app`と`ion-router-outlet`コンポーネントを使用してアプリケーションのルートが設定されます。ルーターアウトレットは、ページが表示される場所です。
+これにより、Ionic の`ion-app`と`ion-router-outlet`コンポーネントを使用してアプリケーションのルートが設定されます。ルーターアウトレットは、ページが表示される場所です。
 
 ## View Routes
 
@@ -125,7 +125,7 @@ export const routes: Routes = [
 ];
 ```
 
-ルートURL（`/`）にアクセスすると、`HomePage`コンポーネントが読み込まれます。
+ルート URL（`/`）にアクセスすると、`HomePage`コンポーネントが読み込まれます。
 
 ## View the Home Page
 
@@ -172,15 +172,15 @@ And the template, in the `home.page.html` file, uses those components:
 </ion-content>
 ```
 
-これにより、ヘッダーとスクロール可能なコンテンツ領域を持つページが作成されます。2番目のヘッダーは、コンテンツの上部にあるときに表示される[折りたたみ可能な大きなタイトル](/docs/api/title.md#collapsible-large-titles)を示し、スクロールダウンすると最初のヘッダーの小さなタイトルを表示するために縮小されます。
+これにより、ヘッダーとスクロール可能なコンテンツ領域を持つページが作成されます。2 番目のヘッダーは、コンテンツの上部にあるときに表示される[折りたたみ可能な大きなタイトル](/docs/api/title.md#collapsible-large-titles)を示し、スクロールダウンすると最初のヘッダーの小さなタイトルを表示するために縮小されます。
 
 :::tip 詳細情報
-Ionicレイアウトコンポーネントの詳細については、[Header](/docs/api/header.md)、[Toolbar](/docs/api/toolbar.md)、[Title](/docs/api/title.md)、[Content](/docs/api/content.md)のドキュメントを参照してください。
+Ionic レイアウトコンポーネントの詳細については、[Header](/docs/api/header.md)、[Toolbar](/docs/api/toolbar.md)、[Title](/docs/api/title.md)、[Content](/docs/api/content.md)のドキュメントを参照してください。
 :::
 
-## Ionicコンポーネントを追加
+## Ionic コンポーネントを追加
 
-より多くのIonic UIコンポーネントでHomeページを強化できます。たとえば、`ion-content`の最後に[Button](/docs/api/button.md)を追加します：
+より多くの Ionic UI コンポーネントで Home ページを強化できます。たとえば、`ion-content`の最後に[Button](/docs/api/button.md)を追加します：
 
 ```html title="src/app/home/home.page.html"
 <ion-content>
@@ -257,12 +257,12 @@ import { RouterLink } from '@angular/router';
 ```
 
 :::info
-AngularのRouterサービスを使用してナビゲーションを実行することもできます。詳細については、[Angular Navigationドキュメント](/docs/angular/navigation.md#navigating-to-different-routes)を参照してください。
+Angular の Router サービスを使用してナビゲーションを実行することもできます。詳細については、[Angular Navigation ドキュメント](/docs/angular/navigation.md#navigating-to-different-routes)を参照してください。
 :::
 
 ## 新しいページにアイコンを追加
 
-Ionic Angularには[Ionicons](https://ionic.io/ionicons/)がプリインストールされています。`ion-icon`コンポーネントの`name`プロパティを設定することで、任意のアイコンを使用できます。次のアイコンを`new.page.html`に追加します：
+Ionic Angular には[Ionicons](https://ionic.io/ionicons/)がプリインストールされています。`ion-icon`コンポーネントの`name`プロパティを設定することで、任意のアイコンを使用できます。次のアイコンを`new.page.html`に追加します：
 
 ```html title="src/app/new/new.page.html"
 <ion-content>
@@ -301,7 +301,7 @@ export class NewPage implements OnInit {
 
 または、`app.component.ts`でアイコンを登録して、アプリ全体で使用することもできます。
 
-詳細については、[Iconドキュメント](/docs/api/icon.md)と[Ioniconsドキュメント](https://ionic.io/ionicons/)を参照してください。
+詳細については、[Icon ドキュメント](/docs/api/icon.md)と[Ionicons ドキュメント](https://ionic.io/ionicons/)を参照してください。
 
 ## コンポーネントメソッドを呼び出す
 
@@ -382,35 +382,35 @@ export class NewPage implements OnInit {
 }
 ```
 
-Ionicコンポーネントのメソッドを呼び出すには：
+Ionic コンポーネントのメソッドを呼び出すには：
 
 1. コンポーネントの`ViewChild`参照を作成します
 2. コンポーネントインスタンスでメソッドを直接呼び出します
 
-各コンポーネントの利用可能なメソッドは、APIドキュメントの[Methods](/docs/api/content.md#methods)セクションで見つけることができます。
+各コンポーネントの利用可能なメソッドは、API ドキュメントの[Methods](/docs/api/content.md#methods)セクションで見つけることができます。
 
 ## デバイスで実行
 
-Ionicのコンポーネントは、iOS、Android、PWAのどこでも動作します。モバイルにデプロイするには、[Capacitor](https://capacitorjs.com)を使用します：
+Ionic のコンポーネントは、iOS、Android、PWA のどこでも動作します。モバイルにデプロイするには、[Capacitor](https://capacitorjs.com)を使用します：
 
 ```shell
 ionic build
 ionic cap add ios
 ionic cap add android
 ```
 
-ネイティブプロジェクトをIDEで開きます：
+ネイティブプロジェクトを IDE で開きます：
 
 ```shell
 ionic cap open ios
 ionic cap open android
 ```
 
-詳細については、[CapacitorのGetting Startedガイド](https://capacitorjs.com/docs/getting-started/with-ionic)を参照してください。
+詳細については、[Capacitor の Getting Started ガイド](https://capacitorjs.com/docs/getting-started/with-ionic)を参照してください。
 
 ## さらに探索
 
-このガイドでは、Ionic Angularアプリの作成、ナビゲーションの追加、ネイティブビルド用のCapacitorの導入の基本をカバーしました。さらに深く掘り下げるには、以下を確認してください：
+このガイドでは、Ionic Angular アプリの作成、ナビゲーションの追加、ネイティブビルド用の Capacitor の導入の基本をカバーしました。さらに深く掘り下げるには、以下を確認してください：
 
 <DocsCards>
 
@@ -435,7 +435,9 @@ ionic cap open android
 </DocsCard>
 
 <DocsCard header="Capacitorドキュメント" href="https://capacitorjs.com/docs/" icon="/icons/guide-capacitor-icon.png">
-  <p>Capacitorを使用してネイティブデバイス機能にアクセスし、アプリをiOS、Android、Webにデプロイする方法を探索します。</p>
+  <p>
+    Capacitorを使用してネイティブデバイス機能にアクセスし、アプリをiOS、Android、Webにデプロイする方法を探索します。
+  </p>
 </DocsCard>
 
 </DocsCards>

docs/angular/your-first-app.md

@@ -11,9 +11,9 @@ sidebar_label: はじめてのアプリ
   />
 </head>
 
-Ionic の素晴らしいところは、1 つのコードベースで、使い慣れた Web ツールと言語を使用して任意のプラットフォーム用にビルドできることです。現実的なアプリを段階的に作成しながら、Ionicアプリ開発の基礎を学びましょう。
+Ionic の素晴らしいところは、1 つのコードベースで、使い慣れた Web ツールと言語を使用して任意のプラットフォーム用にビルドできることです。現実的なアプリを段階的に作成しながら、Ionic アプリ開発の基礎を学びましょう。
 
-3つのプラットフォームすべてで実行されている完成したアプリは次のとおりです：
+3 つのプラットフォームすべてで実行されている完成したアプリは次のとおりです：
 
 <iframe
   width="560"
@@ -25,47 +25,47 @@ Ionic の素晴らしいところは、1 つのコードベースで、使い慣
 ></iframe>
 
 :::note
-Ionic 4とCordovaをカバーしたこのガイドの以前のバージョンを探していますか？[こちらを参照してください。](../developer-resources/guides/first-app-v4/intro.md)
+Ionic 4 と Cordova をカバーしたこのガイドの以前のバージョンを探していますか？[こちらを参照してください。](../developer-resources/guides/first-app-v4/intro.md)
 :::
 
 ## 構築するもの
 
-デバイスのカメラで写真を撮影し、グリッドに表示し、デバイスに永続的に保存する機能を提供するPhoto Galleryアプリを作成します。
+デバイスのカメラで写真を撮影し、グリッドに表示し、デバイスに永続的に保存する機能を提供する Photo Gallery アプリを作成します。
 
 ハイライトには以下が含まれます：
 
-- Ionic Frameworkの[UIコンポーネント](../components.md)を使用して、Web、iOS、Androidで実行される1つのAngularベースのコードベース。
-- Ionicの公式ネイティブアプリランタイムである[Capacitor](https://capacitorjs.com)を使用して、ネイティブiOSおよびAndroidモバイルアプリとしてデプロイ。
-- Capacitorの[Camera](../native/camera.md)、[Filesystem](../native/filesystem.md)、[Preferences](../native/preferences.md) APIによって提供されるPhoto Gallery機能。
+- Ionic Framework の[UI コンポーネント](../components.md)を使用して、Web、iOS、Android で実行される 1 つの Angular ベースのコードベース。
+- Ionic の公式ネイティブアプリランタイムである[Capacitor](https://capacitorjs.com)を使用して、ネイティブ iOS および Android モバイルアプリとしてデプロイ。
+- Capacitor の[Camera](../native/camera.md)、[Filesystem](../native/filesystem.md)、[Preferences](../native/preferences.md) API によって提供される Photo Gallery 機能。
 
-このガイドで参照されている[完全なアプリコード](https://github.com/ionic-team/tutorial-photo-gallery-angular)をGitHubで見つけてください。
+このガイドで参照されている[完全なアプリコード](https://github.com/ionic-team/tutorial-photo-gallery-angular)を GitHub で見つけてください。
 
 ## 必要なツールのダウンロード
 
-最適なIonic開発体験を確保するために、以下をすぐにダウンロードしてインストールしてください：
+最適な Ionic 開発体験を確保するために、以下をすぐにダウンロードしてインストールしてください：
 
-- **Node.js** - Ionicエコシステムと対話するため。[LTSバージョンをこちらからダウンロード](https://nodejs.org/en/)。
+- **Node.js** - Ionic エコシステムと対話するため。[LTS バージョンをこちらからダウンロード](https://nodejs.org/en/)。
 - **コードエディタ** - コードを書くため！[Visual Studio Code](https://code.visualstudio.com/)をお勧めします。
 - **コマンドラインインターフェース/ターミナル（CLI）**：
-  - **Windows**ユーザー：最適なIonic体験のために、管理者モードで実行される組み込みコマンドライン（cmd）またはPowershell CLIをお勧めします。
+  - **Windows**ユーザー：最適な Ionic 体験のために、管理者モードで実行される組み込みコマンドライン（cmd）または Powershell CLI をお勧めします。
   - **Mac/Linux**ユーザー：事実上、どのターミナルでも動作します。
 
-## Ionicツールのインストール
+## Ionic ツールのインストール
 
 コマンドラインターミナルで以下を実行して、Ionic CLI（`ionic`）、デバイスやシミュレーター/エミュレーターでネイティブバイナリを実行するために使用される`native-run`、ネイティブアプリのアイコンとスプラッシュスクリーンを生成するために使用される`cordova-res`をインストールします：
 
 :::note
-Visual Studio Codeでターミナルを開くには、Terminal -> New Terminalに移動します。
+Visual Studio Code でターミナルを開くには、Terminal -> New Terminal に移動します。
 :::
 
 ```shell
 npm install -g @ionic/cli native-run cordova-res
 ```
 
 :::note
-`-g`オプションは_グローバルにインストール_を意味します。パッケージをグローバルにインストールすると、`EACCES`権限エラーが発生する可能性があります。
+`-g`オプションは*グローバルにインストール*を意味します。パッケージをグローバルにインストールすると、`EACCES`権限エラーが発生する可能性があります。
 
-昇格された権限なしでnpmをグローバルに操作するように設定することを検討してください。詳細については、[権限エラーの解決](../developing/tips.md#resolving-permission-errors)を参照してください。
+昇格された権限なしで npm をグローバルに操作するように設定することを検討してください。詳細については、[権限エラーの解決](../developing/tips.md#resolving-permission-errors)を参照してください。
 :::
 
 ## アプリの作成
@@ -90,15 +90,15 @@ ionic start photo-gallery tabs --type=angular
 cd photo-gallery
 ```
 
-次に、アプリのネイティブ機能を動作させるために必要なCapacitorプラグインをインストールする必要があります：
+次に、アプリのネイティブ機能を動作させるために必要な Capacitor プラグインをインストールする必要があります：
 
 ```shell
 npm install @capacitor/camera @capacitor/preferences @capacitor/filesystem
 ```
 
 ### PWA Elements
 
-[Camera API](../native/camera.md)を含む一部のCapacitorプラグインは、Ionicの[PWA Elementsライブラリ](https://github.com/ionic-team/pwa-elements)を介してWebベースの機能とUIを提供します。
+[Camera API](../native/camera.md)を含む一部の Capacitor プラグインは、Ionic の[PWA Elements ライブラリ](https://github.com/ionic-team/pwa-elements)を介して Web ベースの機能と UI を提供します。
 
 これは別の依存関係なので、次にインストールします：
 
@@ -132,11 +132,11 @@ platformBrowserDynamic()
 ionic serve
 ```
 
-そして、完成です！IonicアプリがWebブラウザで実行されています。アプリの大部分はブラウザ内で直接ビルドおよびテストできるため、開発とテストの速度が大幅に向上します。
+そして、完成です！Ionic アプリが Web ブラウザで実行されています。アプリの大部分はブラウザ内で直接ビルドおよびテストできるため、開発とテストの速度が大幅に向上します。
 
 ## Photo Gallery
 
-3つのタブがあります。「Tab2」タブをクリックしてください。これは空白のキャンバス、つまりPhoto Galleryに変換するのに最適な場所です。Ionic CLIにはLive Reload機能があるため、変更を加えて保存すると、アプリがすぐに更新されます！
+3 つのタブがあります。「Tab2」タブをクリックしてください。これは空白のキャンバス、つまり Photo Gallery に変換するのに最適な場所です。Ionic CLI には Live Reload 機能があるため、変更を加えて保存すると、アプリがすぐに更新されます！
 
 ![Animated GIF showing the live reload feature in an Ionic app, with changes in code immediately updating the app in a web browser.](/img/guides/first-app-cap-ng/email-photogallery.gif 'Live Reload Feature in Ionic App')
 
@@ -160,7 +160,7 @@ ionic serve
 </ion-content>
 ```
 
-`ion-header`は上部のナビゲーションとツールバーを表し、「Tab 2」がタイトルです（iOSの[折りたたみ可能な大きなタイトル](../api/title.md#collapsible-large-titles)サポートにより、2つあります）。両方の`ion-title`要素を次のように変更します：
+`ion-header`は上部のナビゲーションとツールバーを表し、「Tab 2」がタイトルです（iOS の[折りたたみ可能な大きなタイトル](../api/title.md#collapsible-large-titles)サポートにより、2 つあります）。両方の`ion-title`要素を次のように変更します：
 
 ```html
 <ion-header [translucent]="true">
@@ -235,4 +235,4 @@ ionic serve
 </ion-tabs>
 ```
 
-これは、Ionicでできるすべての素晴らしいことの始まりに過ぎません。次に、Webでカメラ撮影機能を実装し、その後iOSとAndroid用にビルドします。
+これは、Ionic でできるすべての素晴らしいことの始まりに過ぎません。次に、Web でカメラ撮影機能を実装し、その後 iOS と Android 用にビルドします。