オンラインスターターを使ってAngularをすぐに始めましょう。または、ターミナルを使ってローカルでも開始できます。
オンラインで試す
プロジェクトを設定せずに、ブラウザでAngularを試したい場合は、オンラインサンドボックスを使うことができます。
ローカルに新しいプロジェクトを設定する
新しいプロジェクトを開始する場合、Gitなどのツールを使用するために、ローカルにプロジェクトを作成するのが一般的です。
前提条件
- Node.js - v^18.19.1以降
- テキストエディタ - Visual Studio Codeを推奨
- ターミナル - Angular CLIコマンドを実行するために必要
手順
以下のガイドは、ローカルにAngularプロジェクトを設定する手順を説明します。
Angular CLIをインストールする
ターミナルを開き（Visual Studio Codeを使用している場合は、統合ターミナルを開くことができます）、次のコマンドを実行します。
npm install -g @angular/cli
WindowsまたはUnixでこのコマンドを実行する際に問題が発生した場合は、CLIドキュメントを参照してください。
新しいプロジェクトを作成する
ターミナルで、CLIコマンドng newを実行し、目的のプロジェクト名を入力します。次の例では、my-first-angular-appというプロジェクト名を使用します。
ng new <project-name>
プロジェクトの設定に関するいくつかのオプションが表示されます。矢印キーとEnterキーを使ってナビゲートし、必要なオプションを選択します。
特に好みがなければ、Enterキーを押してデフォルトのオプションを採用し、設定を続行してください。
設定オプションを選択し、CLIがセットアップを実行すると、次のようなメッセージが表示されます。
✔ Packages installed successfully. Successfully initialized git.
これで、ローカルにプロジェクトを実行する準備が整いました！
ローカルに新しいプロジェクトを実行する
ターミナルで、新しいAngularプロジェクトに切り替えます。
cd my-first-angular-app
この時点で、すべての依存関係がインストールされているはずです（プロジェクト内にnode_modulesフォルダが存在することを確認できます）。次のコマンドを実行してプロジェクトを開始できます。
npm start
すべてが正常に完了すると、ターミナルに次のような確認メッセージが表示されます。
Watch mode enabled. Watching for file changes...NOTE: Raw file sizes do not reflect development server per-request transformations. ➜ Local: http://localhost:4200/ ➜ press h + enter to show help
これで、Localのパス（例：http://localhost:4200）にアクセスしてアプリケーションを確認できます。コーディングを楽しんでください！🎉
次のステップ
Angularプロジェクトを作成したので、基本概念ガイドでAngularの詳細について学ぶか、詳しいガイドからトピックを選択してください！