ng generateによるコード生成
コンポーネントやサービスなどのひな形を作成します。
「ng generateによるコード生成」はCoddyKit上の無料Angular Academyレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはAngular Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Angular Academyコースには全4レッスンが含まれています。
ng generate でコードを生成する
ng generate コマンド（短縮形は ng g）を使うと、正しいボイラープレートと命名規則に従って Angular の構成要素をスキャフォールディングできます。
コンポーネントを生成する
1 つのコマンドでスタンドアロンコンポーネントを作成できます。
ng generate component hello
# short form:
ng g component hello生成されるもの
hello.component.ts、.html、スタイルシート、.spec.ts テストが生成され、デフォルトでスタンドアロンとして設定されます。
フォルダー内に生成する
パスを指定すると、コンポーネントをサブフォルダーに配置できます。
ng g component features/dashboardサービスを生成する
サービス schematic を使用して、injectable サービスを作成できます。
ng g service data
# creates data.service.ts with @Injectableディレクティブを生成する
スタンドアロンディレクティブも同様の方法でスキャフォールディングできます。
ng g directive highlightパイプを生成する
テンプレートの変換に使用するカスタムパイプを作成できます。
ng g pipe truncateガードを生成する
ルートガードはナビゲーションを保護します。CLI では、関数型ガードをスキャフォールディングできます。
ng g guard authドライランでプレビューする
dry-run フラグを使用すると、ファイルを書き込まずに生成される内容を確認できます。
ng g component hello --dry-runテストファイルを省略する
テストファイルが不要な場合は、フラグを追加して .spec.ts テストの生成を省略できます。
ng g component hello --skip-testsテンプレートとスタイルをインライン化する
テンプレートとスタイルを別ファイルではなく、インラインで生成するよう指定できます。
ng g component badge --inline-template --inline-styleクイックチェック: ng generate
構成要素をスキャフォールディングします。
振り返り: 生成
ng generate（ng g）では、正しい規約に従ってコンポーネント、サービス、ディレクティブ、パイプ、ガードをスキャフォールディングできます。--dry-run、--skip-tests、--inline-template などのフラグで、生成内容を調整できます。次は、ビルドとサーブについて学びます。
AI チューターと学ぶ HTML — 無料
ブラウザでリアルコードを書いて実行し、24/7 の AI チューターから瞬時にサポートを受け、ウェブまたはアプリで続きから学習できます。
- コース
- 38
- レッスン
- 144
よくある質問
「ng generateによるコード生成」レッスンは無料ですか？
はい。「ng generateによるコード生成」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、Angular Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Angular Academyコースには全4レッスンが含まれています。
「ng generateによるコード生成」で何を学びますか？
コンポーネントやサービスなどのひな形を作成します。 ブラウザで直接実行するハンズオンコードでAngular Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Angular Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのAngular Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。
「ng generateによるコード生成」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このAngular Academyレッスンでコードを書いて実行できますか？
はい。すべてのAngular Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- 新しいプロジェクトの生成
- プロジェクト構造の解説
- ng generateによるコード生成
- ビルドとサーブ