Angularで再読み込み時に404エラーがでる
1
なぜ404エラーとなるのか
AngularをはじめとするSPAでは、URLごとに実態のあるページが存在する一般的なサイトとは異なり、index.htmlをクライアント側で書き換えるため直接特定のアドレスにアクセスするとエラーがでます。
開発環境では出ない理由
開発環境だと開発サーバ側でindex.htmlを読み込んでくれているので問題にならないのですが、デプロイ時には自分で設定することになります。設定内容はファイルが見つからない時はindex.htmlを参照してくれというものですので、Angularではなくサーバ側のapacheやnginxなどの設定ということになります。なのでデプロイ時に顕在化する問題となります。
APacheの場合
.htaccessファイルに下記を指定します。サブドメインを使ってホスティングする場合、サブドメインのルート（サブドメインのindex.htmlのある場所）に下記を設置すればいいです。
<pre…
Ionic(Angular)でtabとサイドバーを備えたプロジェクトを作成する
概要
上記の画像のようなサイドメニューとタブバーを備えたプロジェクトを作成します。
流れ
IonicのデフォルトテンプレートのひとつであるTabプロジェクトにサイドメニューを追加します。
参考文献
https://petercoding.com/ionic/2019/05/05/side-menu-in-ionic4/
https://ionicframework.com/jp/docs/api/menu
準備 デフォルトのプロジェクトを作成する
下記のコマンドを打ってTabバーを備えたプロジェクトを生成します。
%…
Angular(Ionic)でグラフを描写する
1
グラフ描写のライブラリ
Ionicでグラフを描写するライブラリにはいくつかあるようですが、安定していてよく使われているchart.jsを使いことにしました。意外に簡単でびっくりしました。
インストール
プロジェクトのルートフォルダに移動して、Terminalで下記コマンドを実行します。
npm…