---
title: "Angularの練習ということで船橋市の人口推移グラフを作ってみた"
description: "Angularの練習として船橋市の人口推移グラフを作成。"
date: 2023-09-18
tags:
  - "Angular"
  - "chart.js"
  - "TypeScript"
---

## 経緯

現在関わっているプロジェクトでAngularを使うのが決定しており、何も知らないのはアカンと思い手軽に作れるアプリケーションを探していた。

たまたまQiitaとgithubを漁っていたら[こちらが参考になる](https://github.com/limoza/population_change_graph)と感じ、練習も兼ねてWebアプリを作成した。

## 作成したもの

船橋市の人口推移グラフ
Github : [https://github.com/Suntory-N-Water/funabashi-population-trends](https://github.com/Suntory-N-Water/funabashi-population-trends)
URL : [https://funabashi-population-trends.vercel.app/](https://funabashi-population-trends.vercel.app/)

## 使用技術

フロントエンド : Angular
ホスティング : Vercel

## 感想

## 難しかったところ

- Chart.jsとng2-chartsを理解するのに時間がかかった
- ChatGPTに終始頼りきりだった
  - 特にService, TypeScriptの文法…
- レスポンシブデザイン、いまだにちゃんと分かってない

**💡ブルーベリー本あるのでもう一周しましょうね！**

## 個人的に良かったところ

- UIはデジタル庁を参考にしたけど、結構楽しい
- Angular…コワイがなくなったこと
- 可視化すると人気な町とほどほどな町が一瞬で分かって楽しい
  - 老人も減っている町は先が心配だなと

## その他

工数(要件定義 ~ 簡単なテスト迄): 17時間