
今回以降は結構大変かも、、、
前回はPostgreSQLの導入を行ったわけですが、Oracle の経験が多少あった為、基本的なところでの戸惑いは、ほとんど問題はありませんでした。
けれど今回以降は予備知識があまりない、苦労しそう、、、
とはいっても、やらないわけにはいかないので、まずは Angular の開発環境を構築。
Angular の利用で必要になるもの
こちら の本家セットアップガイドとか、数々の入門系サイトを見ながら作業を進めます。
まずはNode.js がいる
最初に、JavaScriptの実行環境である「Node.js」をインストール。

ダウンロードした「node-v12.16.3-x64.msi」を実行。

とりあえず、インストールする場所はデフォルトのままで。

「カスタムセットアップ」?、よくわからないのでそのままで。

「Native Modules」?、たぶんいらないので無視。

ここまでで準備OK、「Install」します。

ほどなく完了。

一応、ちゃんと入っているか、以下で確認してみます。
node -v npm -v

大丈夫そう(npm=Node Package Manager 。Node.jsのパッケージ管理ツール)。
そして Angular/cli がいる
コマンドプロンプトで下記を実行
npm install -g @angular/cli

問題なく完了したようです。一応確認。
ng v

大丈夫そう(ng=angular-cliのコマンド)。
ただ、¥Users 配下にいろいろできちゃうのはう~ん、とりあえず良いけど、いずれ見直したい。。。
Visual Studio Code を使ってみる
Angular ベースのプログラム開発、「Eclipse」でも出来ないことはなさそうですが、今回は、TypeScriptの元締めでもある、Microsoftの「Visual Studio Code」を使ってみることにします。
以下からダウンロード。

そして、ダウンロードした「VSCodeUserSetup-x64-1.44.2.exe」を実行。
やはりこれも「¥Users配下」、なんか微妙だけれど、変えて面倒になるのもなんなので、今回はデフォルトのままで。

インストールが完了したら、起動してみます。

プロジェクトを作成してみる
せっかくなので、「Visual Studio Code」から一連の操作をしてみます。
まず、Terminal を表示。

Terminal から以下を入力してプロジェクトを作成。
ng new angular-app
Routing がなんちゃらとか、CSSかSCSSか?とか出てきますが、とりあえずデフォルトで進めます(いずれ解明する、ということで)。

完成したみたい。「gitがない」といってますが、とりあえず良いでしょう。
サーバーを起動してみます。
cd angular-app C:\angular-app>ng serve ※移動してからじゃないとエラーになる

なんか動いているようです。ブラウザで稼働確認してみます。

出てきますね。大丈夫なようです。
まとめ
まずは、Angularの導入・開発環境の整理が出来ました。
途中、疑問点が少しありましたが、いずれ解明するということで、先に進めることにします。
次回は、おろらくさらに面倒そうな「Spring」と「Eclipse」の導入です。
コメント