*とりあえずChatgptに日本語を直してもらった
投資複利計算ツールを作ってみた
こんにちは！日本でエンジニアとして働いている社会人3年目の中国人、葉子です。
今回は、自作した投資複利計算ツールについてご紹介します。
プロジェクト概要
今年、新しいNISA制度をきっかけに、私自身も投資の勉強を始めることにしました。そして、投資や貯蓄の計画を立てる上で重要な複利計算を簡単に行えるツールを作成しました。このツールは、ユーザーが複利計算を手軽に行い、その結果を視覚的に確認できるように設計されています。
URL: 複利計算ツール
使用技術
-
フロントエンド: React, Next.js
- ユーザーインターフェースの構築にNext.jsを採用し、シンプルかつ高速な動作を実現しました。（自分の仕事では主にシンプルなReactを使っていますが、Next.jsはフロントエンドからバックエンドまで対応できるので、次の個人開発ではNext.jsだけを使う予定です。）
-
バックエンド: Python (FastAPI)
- 計算ロジックは仲間が作成したもので、それを基にAPI処理をFastAPIで実装しました。
-
デプロイ: Vercel (フロントエンド), Render (バックエンド)
- フロントエンドとバックエンドをそれぞれ適切なプラットフォームにデプロイ。
- 計算にnumpyとpandasを使用した結果、VercelのServerless Functionのメモリがオーバーしたため、バックエンドはRenderにデプロイしました。
- Renderは無料プランを利用しているので、GitHub Actionsを使い、定期的にRenderのサーバーを呼び出しています。
主な機能
- 複利計算: 初期投資金額、利率、投資期間などを入力することで、複利の増加額を計算します。
- 結果の視覚化: 計算結果をグラフで表示し、視覚的に理解しやすくしています。
- ユーザーフレンドリーなUI: シンプルで直感的に操作できるデザインを心がけました。
プロジェクトのポイント
-
フロントエンドとバックエンドの分離設計
フロントエンドとバックエンドを明確に分離することで、保守性を高めました。 -
レスポンシブデザイン
モバイルとデスクトップの両方で快適に利用できるよう、レスポンシブデザインを採用しています。 -
APIによる効率的なデータ処理
入力データはバックエンドに送信され、計算処理を行った後、結果を返します。これにより、フロントエンド側の負荷を軽減しています。 -
多言語対応
今は日本語、中国語、英語を対応しています
課題と今後の改善点
-
エラーハンドリングの強化
入力データのバリデーションや、APIエラー発生時の処理をさらに強化したいと考えています。 -
投資シミュレーションの追加機能
現在の機能に加え、取り崩し機能を追加予定です。
最後に
このプロジェクトを通じて、フロントエンドとバックエンドの統合やデプロイについて深く学ぶことができました。ぜひ使ってみていただき、ご意見やフィードバックをいただけると嬉しいです！