Angularとnetlifyでポートフォリオサイトを作ってみた

作成したポートフォリオサイトはこちらになります。

https://portfolio-0156.netlify.com/
github:https://github.com/templa00/my-app-angular

最初Github Pagesにデプロイしようとしたが、yoomanを入れる必要があるようで、面倒だったのでnetlifyにデプロイすることにした。
Github上のAngularアプリを自動デプロイできるということでやってみてデプロイに成功するが、Page Not Foundになる。
プロジェクト側から、デプロイできるようにした。
下記コマンドでSiteIDとアクセス用のTokenの設定

ng add @netlify-builder/deploy

下記コマンドでnetlifyにデプロイすることができた。

 ng deploy

現状githubにプッシュした場合、自動的にデプロイを行いPage Not Foundになるので、その辺修正出来ればした方が良い。


・作成した感想
ほとんどhtmlとcssしか使わなかったので、Angularを使ったメリットをあまり感じなかった。
大規模になるとAngularを使ったメリットを感じるんだろうと思う。
この程度ならVue.jsで作るか、フレームワークを使わないでよかったとも思う。

・参考にさせていただいたサイト
cssのデザインがほとんどコピペで出来てしまう。
https://saruwakakun.com/html-css/reference/css-sample

visualstudio2017でtypescriptを使用する。

前提として
ツール->ツールと機能拡張を取得からjavascriptにモバイル開発Node.js開発をダウンロードしておく必要がある

ツール->拡張機能と更新プログラム->オンラインから「TypeScript HTML Application Template」を検索してダウンロードする。
vsを落としてインストールが終わったら
新しいプロジェクト->オンラインから「TypeScript HTML Application Template」を検索してプロジェクトを作成する。（TypeScriptからも選択できるようになっている？）

npmコマンドを使いたいので
拡張機能と更新プログラム->オンラインから「npm」(Package Installerでもいい)と検索して「Package Installer」をダウンロード、vsを落としてインストールを行う。

プロジェクトを右クリックし、メニューにQuick Instal Packegeと表示されるので選択する。
npmを選択し「@types/createjs」をインストールするとtypescriptでcreatejsが使えるようになる。入力補間もしてくれる。
ただ入力時使えるだけでデバッグ時使えるわけないので、index.htmlに
<script src="https://code.createjs.com/1.0.0/createjs.min.js"></script>
の入力が必要。（プロジェクトにcreatejsを落としてきて配置してもいい）