「トランスパイラとモジュールバンドラ」の節を再整理する

[chvmvd]

方針

• 「フロントエンドとバックエンドの統合」の項については、デプロイに関することをまとめて扱うことで理解しやすくするために、Reactの後ろに新たにデプロイに関する節を設けてそこで扱うことにする
• 演習問題1では、npmのパッケージをWebブラウザ上で扱うことの説明をしているが、Chart.jsの使い方を理解することは難しいため、よりわかりやすい問題と差し替える
• 演習問題2では、主にデプロイについて扱っているため、削除する

演習問題候補

• 「モジュールとnpm」の節で扱っているnode-emojiパッケージを使用する
• 「モジュールとnpm」の節で扱っているmath.jsパッケージを使用する
• すでに使用しているようにChart.jsを使用する
  Getting Startedの例は、CDNを使用したものであるので、ドキュメントをよく読めばわかるもののViteを使用している場合にどのようにすればよいのかが少々わかりにくいという問題がある。
• Three.jsを使用する
  Viteを前提として説明がされているため、ドキュメントを読めば使い方はわかるものの、例が複雑であるため難易度が高い。
• qrcodeパッケージを使用する
  使い方は比較的簡単だが、canvasを使う必要があるのと、説明がCJSとなっている点で少しわかりにくい。
• canvas-confetticパッケージを使用する
  使い方が非常に簡単で、面白みがある。
• Fakerを使用する
  使い方が非常に簡単
• rough-notationパッケージを使用する
  使い方が比較的簡単
• countUp.jsパッケージを使用する
  使い方が比較的簡単

演習問題案

• 演習問題1は、Fakerを使用する
  文中で触れているdate-fnsとほとんど同じレベルの問題という位置づけ
• 演習問題2は、canvas-confettiパッケージを使用する
• 演習問題3（発展）は、Chart.jsを使用する canvas-confettiがあればChart.jsはなくても十分であろうという結論となりました。