手動インストール
AWS Amplify を始めるには、クイックスタートスターターテンプレートの使用をお勧めします。ただし、まったく新しいディレクトリまたは既存のフロントエンドアプリから始める場合もあります。その場合は、npm で create-amplify を使用することをお勧めします。
npm create amplify@latest? Where should we create your project? (.) # press enterこのコマンドを実行すると、現在のプロジェクトに以下のファイルを含む軽量な Amplify プロジェクトがスキャフォールドされます。
├── amplify/│ ├── auth/│ │ └── resource.ts│ ├── data/│ │ └── resource.ts│ ├── backend.ts│ ├── tsconfig.json│ └── package.json├── node_modules/├── .gitignore├── package-lock.json├── package.json└── tsconfig.json必要に応じて、create-amplify やスターターテンプレートを使用せずに AWS Amplify を手動でインストールできます。このガイドでは、プロジェクトを初期化し、依存関係をインストールし、最初のバックエンドを作成する方法について説明します。
手動セットアップ
まず、選択したフロントエンドフレームワークがまだ持っていない場合は、npm init -y でプロジェクトの package.json を作成します。次に、バックエンドを構築するための Amplify 依存関係をインストールします。
npm add --save-dev @aws-amplify/backend@latest @aws-amplify/backend-cli@latest typescript次に、バックエンドのエントリーポイント amplify/backend.ts を以下のコードで作成します。
import { defineBackend } from '@aws-amplify/backend';
defineBackend({});これで npx ampx sandbox を実行して、最初のバックエンドを作成できます!
define* 関数を使用してリソースを 定義 できます。たとえば、認証を定義できます。
import { defineAuth } from '@aws-amplify/backend';
export const auth = defineAuth({ loginWith: { email: true }});またはデータリソースを定義できます。
import { a, defineData, type ClientSchema } from '@aws-amplify/backend';
const schema = a.schema({ Todo: a.model({ content: a.string(), isDone: a.boolean() }) .authorization(allow => [allow.publicApiKey()])});
export type Schema = ClientSchema<typeof schema>;export const data = defineData({ schema});新たに定義されたこれらのリソースは、その後バックエンド定義にインポートされて設定されます。
import { defineBackend } from '@aws-amplify/backend';import { auth } from './auth/resource';import { data } from './data/resource';
defineBackend({ auth, data});既存プロジェクトのアップグレード
既存のフロントエンドアプリをアップグレードすることもできます。既存の Amplify code-first DX (Gen 2) アプリをアップグレードするには、Node.js パッケージマネージャー (例: npm) を使用して関連するバックエンドパッケージを更新します。
npm update @aws-amplify/backend @aws-amplify/backend-cli次のステップ
以下の次のステップをお勧めします。