はじめに

この記事を書いているのはエンジニア初学者が記載しているため、技術的に間違っているなどの指摘があれば是非コメントなどで教えて頂ければと思います

【コードレビュー依頼】

今回紹介するアプリは勉強がてら個人開発したものです。
現在、動くものは作れたのですがリファクタリングが上手くいってないと感じており、どのようにしたらいいか困っています。
そのため有識者様、先人たちのお力をお借りいただけないかと思っています。
もし、「見てやろう！」「確認してやろう！！」などのお気持ちの方がいらっしゃいましたら是非、ご確認いただけますと幸いです

GitHub：https://github.com/RyuNo-13/alone-money

※コード見るのはめんどくさい「こうしたらいいよ」などアドバイスだけでもコメントいただけますと幸いです。

サービス名

アプリURL

以下のリンクからお試しいただけます

👉1人暮らしシュミレーションを試す

画面一覧

サービスの概要・開発した背景

◯きっかけ
ReactとTypeScriptをUdemyで学習していたが身についた感じがしなかった。
エンジニア系Youtubeの方の動画などを見てみると「ある程度勉強したら個人で開発した方が、自分は何が出来て出来ないのかが分かりやすい」という意見があったので試しに開発してみようと思った。

◯なぜ、1人暮らしのシュミレーションなのか
どんなものを作ろうかと考えたとき、サービスを作るなら作成したサービスが1人でも満足してくれるものがいいなと思っていた。
そこで、思いついたのが「１人暮らしシュミレーション」であった。
1人暮らしを初めて、6年ぐらい経ちそうなのだが、初めて1人暮らしをするとき1か月どれくらいの費用がかかるのか正直分からず親に任せきりだった。
1人暮らしを始めたいけど、中々前に進めない人の中には、1人暮らしをするとどれくらい費用が掛かるのか分からないことが1つの要因だと思ってた。
（実際何度か、1人暮らしにどれくらいかかるか友達とかに教えたことがあり、やっぱり費用のところは気になるよなと感じてた。。）
そこで、自分の体験をもとにどれくらいの費用が掛かるのかを簡単にシュミレーションできるように開発してみた。

使用技術

React v19
Next.js v15
TypeScript
TailwindCSS
vercel（デプロイ時に使用）

開発してみての感想

Youtubeで見た通り、開発してみて気づかされたことが多かった。反省点・学んだことも含めていくつか紹介していく。

1.考えるべきことが多い

開発初学者にとって第一の障害は「何を作ったらよいか分からない」があると思うが、そこは意外とすんなり乗り越えられた。しかし、いざ作ろうと思った時「何からはじめたらいいんだ？」となった。そのため、コードを書き始めるのではなく「どんな機能が必要か」「画面イメージはどうするか」「ファイルの構成はどうするか」「最低限必要な機能は何か」などを考えた上でコードを書こうと決め実行した。実際に考えること自体は好きなため良かったが「細かい所までしっかり考えないと」みたいな義務感に襲われた。そのため、考える時間は1週間だけと締め切りを作ることで最低限考えないといけないことに集中できるようにした。

2.コードを書くのが難しい

開発を進める前にUdemyを使用してJS、CSS、React、TSなどの動画を見て一通りできると思っていた。ただ、実際書いてみると「あれ、どうやって書けばいいんだ」みたいなことが多く、動画を見直したり、記事を調べたり、AI先生に教えてもらったりなど、知識の抜け穴が多いなと感じた。やはり、自身でイメージしたことを「自分で考えて形にする」という体験を増やしていかないとコーディングの力はつかないんだなということが分かった。

3.自分の身の丈を超える機能を作ろうとしていた

今回のアプリの機能として初期段階の構想ではFirebaseを使用して「ログイン機能」と「サーバー」を作成しようとした。
理由はUdemyの講座で使用したことがあるため。
ただ、Next.js15では学んだことをそのまま使うことができず、どのように実装したらいいのか分からず3日ほど時間を使用してしまった。
他にもいろいろ機能をつけようとしていたが、今の自分では実力不足だなと思い断念した。
見きりは早い方？だったためそこまで悪い結果（1.2か月かかってしまう）ではないと思うが最初から欲張るのは良くないと感じた。

4.勉強することが明確になった（学んだこと）

2.「コードを書くのが難しい」にも記載したが、コーディングの力は圧倒的に足りていないと感じた。そのため、Udemyなどで模写するだけでなく、自分で考えながらコードを書いていくことが大事だと感じた。リファクタリングなどコードを綺麗に書けないと実務では使えないと思うため、書籍などを通して基本的なコードの書き方なども勉強しようと思った。
また今回はDBなどは加えなかったが、DBでのデータ管理やDBから値を取得することができれば、やれることが増えるだろうと思ったため、DB系などの勉強もしてみたいと思えるようになった。

今後の展望

今回の開発で学びが多かった。今後は以下のことに挑戦していきたい。

初めて作ったサービスのため、コードがぐちゃぐちゃだと思うためリファクタリングしていきたい
- 気づいたことや修正箇所を見つけて頂いたらアドバイスいただきたい
DBを使用してユーザーの入力を保持したい
- Google認証などで管理していきたい
1ヶ月にかかる費用だけでなく、初期費用をシュミレーションできる機能を追加したい

開発者について

私は現在Webエンジニアを目指して独学で勉強中です。
このアプリを作ることで、ReactとTypeScriptの実践経験を積むことができました。
今後はさらにスキルを磨き、作りたいものを作れるエンジニアになりたいと考えています。