【Angular】Angularプロジェクトの作成

2021年12月11日

Angularはプロジェクト単位で開発を行っていきます。
プロジェクトを作成することで、開発に必要なファイルを一括で作成、管理することができます。

スポンサーリンク

プロジェクト作成

コマンドプロンプトでプロジェクトを作成する場所に移動してください。
そこで以下コマンドを実行します

ng new ○○○○(作成したいプロジェクト名)

プロジェクトの設定内容について2,3質問されますが、とりあえずデフォルトで良いです。
そのままEnterしてしまいましょう。
そうするとプロジェクトが作られ始めます。(結構時間かかります)

完了すると色々とファイルが作成されていると思いますが、基本的には「src」ディレクトリ配下を編集していくことになります。
そこ以外の部分は基本特にいじらなくて大丈夫です。

プロジェクトの実行

作成したプロジェクトを試しに動かしてみます。
プロジェクトのディレクトリ内に移動し、以下のコマンドを実行してみてください。

ng serve

「Compiled successfully」と表示されれば成功です。
プロジェクトのビルドが完了し、サーバーとして起動しました。
以下アドレスにアクセスして確認してみましょう。

http://localhost:4200/

Angularプロジェクトでデフォルトで用意してくれるページが表示されます。

終わりに

ここまででAngular開発のための準備は完了です。
次回以降、さらに詳細にプロジェクトの構造を記載していきます。

スポンサーリンク

Angular開発

Posted by 社畜林檎