はじめに
始めまして，2026新卒のnishikiです．
今回初投稿です．
この度，就活に使える成果物を作成したいと思い，バックエンド～フロントエンドまでを含めたwebアプリの開発に挑戦しました（というか今しています）．
自身のためのメモとして，また未来の就活生の糧になればいいと思い，筆を執った次第です．
余りこの記事に時間を使うつもりはないので，ところどころ適当になるかもしれませんが，初学者のあがき方として参考にしていただければと思います．
自己紹介・今まで使ったことのある言語
改めまして，就活真っ最中のnishikiと申します．
趣味としては，オーケストラでヴァイオリンを弾いたりしています．
現在は某理系大学院にM1として所属しており，普段は余りコードをいじらない研究をしています．
一方，プログラミング自体は広く浅く経験しており，一応以下の言語を触ったことがあります．
- Python
研究で使ったり，趣味として何かやりたいと思ったらとりあえず使っています． - Flutter/Dart
勉強し始めて半年強になります．実務経験はないですが，ちゃんとGUIのあるアプリを作ってみたいと思い勉強し始めました． - HTML・CSS・JavaScript
一般的な入門サイトは一通りさらった程度の経験です．発展的なものはあまり作ったことが無いです． - GAS
実質JavaScriptですが，普段の事務的な業務に使っています．めっちゃ便利！みんなも使おう！ - React
某企業でハッカソン形式の夏インターンに参加し，開発を経験しました．実装力の高いメンバーに恵まれたので，短期間で色々なことを学ばせてもらいました．
作りたいアプリの概要
技術スタック
第一に就活の成果物として利用できる点が重要なのですが，某L社の就活アドバイザーによると以下の点が重要なようです．
-
バックエンド＆フロントエンドの実装
これを行うことでアプリケーションの仕組みを理解したことが示せます． -
フレームワークの利用
企業の開発環境に近い環境で開発していることを示せることと，単純に開発がしやすくなる点で利用した方がよいようです．
これらの条件を満たす成果物として，webアプリの開発が適しているとアドバイスをもらいました．
正直なところあまり知識のない分野で迷いましたが，餅は餅屋ということで成果物の形態としてはwebアプリを選びました．
具体的には，フロントエンドとして少し経験のあったReact，バックエンドとしてSpring boot，データベースとしてFireBase Storageを用いることにしました．
バックエンドとしてDjangoでなくSpring bootを選んだ理由ですが，完成形としてJavaアプリを利用した処理を実行したかったので(pythonから動かすことも不可能ではないですが)それに合わせています．
アプリ概要
アドバイザーによると，面接で成果物について説明するためここの動機付けもしっかりとやるべきだそうです．自分の言葉で語りやすいということで，今回は趣味のオーケストラで経験した出来事をもとに決めました．
具体的には，楽譜をアップロードすると移調をしてくれるようなアプリを完成形として目指します．元となったエピソードはここで説明するようなものでもないと思うので，折りたたんでおきます．
元となったエピソード
小編成の室内楽などでは，他の楽器用の楽譜を自分の楽器で演奏することもあります．ここで問題になるのが，楽譜の調の問題です． ト音記号とヘ音記号の違いは音楽の授業でも扱うかもしれませんが，場合によっては同じト音記号の楽譜を違う音として扱う場合もあり，これが異なる楽譜を演奏することは非常に難しいです． そこで，楽譜の調を変えて普段の楽譜と同じ調にできるようなアプリを作りたいと思った次第です．ざっくりとした処理の流れは，次のものを想定しています．（本来はシーケンス図が必要ですが，本格的に開発に入ってからにします．）
- フロントエンドで楽譜画像を受け取る
- クラウドデータベースへのアップロード，バックエンドへのAPIコールを行う
- バックエンド側で画像を再取得，Audiverseというアプリを用いてMIDI（楽譜の情報を電子データとして扱う際の形式）に変換
- MIDIを操作し移調
- 再びpngやpdfに変換し，データベースにアップロード
- フロントエンドにレスポンスを送る
- フロントエンド側で結果表示＆必要に応じてダウンロード
ただ，難しそうなら途中で難易度を下げる予定です．
勉強に参考にしたサイト
この段階では，Spring bootによるバックエンドの実装，Firebaseによるデータベースの利用の経験がありませんでした．
そこで，以下のサイトを参考（写経）に勉強しました．
ToDoアプリ
spring bootのチュートリアルとして参考にさせていただきました．
画像投稿機能
Firebaseのチュートリアルとして，以下のサイトを参考にさせていただきました．
勉強した結果
Spring bootは，基本的なController，Mapperの使い方を学ぶことができましたが，まだまだ他の要素も多いようですので，追加で学びながら開発することになりそうです．
また，SQLによるデータベース処理についてもここで触れられたのはよかったと思います．
MVCモデルやRestAPIという単語についても触れられたのは大きかったです．
FireBaseは，簡単に使うことができて非常に有用なサービスであると感じました．
ToDoアプリで既にデータベース操作に触れていたことも，理解に貢献していたかもしれません．
今後の予定
次は，ReactとSpring bootの連携について学んでいく予定です．
次回⇒モチベーションが続いて就活の方針が変わらなければ11月中