はじめに
エンジニアになって半年が経ちました。
膨大なエラーと向き合う中で、「あれ？前もこのエラー見たよな…」という機会が多くなり、
「いちいちググるのめんどくさい」と感じた刹那、私はrails newしていたのでした。
目次
アプリケーションの概要
エラー記録用アプリケーション「Error Note（エラーノート）」
エラーを記録しておくだけの超シンプルなアプリケーションです。
システム要件
| item | require | version |
|---|---|---|
| OS | AmazonLinux AMI | 2.0 |
| Application Server | Unicorn | 6.0.0 |
| Web Server | Nginx | 1.20.0 |
| DB Server | AWS RDS(MySQL) | 8.0.25 |
| Backend | Ruby | 2.7.2 |
| BackendFramework | Ruby on Rails | 6.1.3.2 |
| Frontend | HTML, CSS, Javascript | - |
| FrontendFramework | Vue.js | 2.6.12 |
| AutomaticDeployment | Capistrano | 3.1.0 |
開発期間
4ヶ月間（設計・デモ版作成・Vue.jsのインプット含む）
ざっくり機能紹介
エラー記録機能
その名の通り、エラーを記録します。タイトル、エラーの内容を入力すれば保存できるので、ちょっとしたエラーでもサクッと書き留めておくことができます。
エラーが解決した際には、解決法を入力しておくことができます。
しばらく経ってから「このエラーどこかで見たな…」と思ったときは、「マイページ」から過去に作成したノートを参照します。
他の人にエラーを見られたくないときは、作成したノートを「非公開」に設定することもできます。
ストック機能
ノートの詳細画面から、他の人が作成したノートをストックすることができます。
ストックしたノートは、「マイページ」から確認することができます。
検索機能
キーワードを入力することで、ノートを検索できます。
使い勝手を良くするための機能改修を検討中です。
苦労したポイント
Vue.jsとRailsの融合
今回の開発で初めてVue.jsを使いました。
Railsを用いた開発では、Controllerで定義したインスタンス変数をView側に渡して、動的なデータを表示します。
対するVue.jsは、RailsをAPIとして使用します。フロント側からバック側（RailsAPI）にリクエストを投げ、バック側でデータをゴニョゴニョして、jsonとしてフロントに返却。フロントでそれらを表示します。
Vue.jsに関しては最小限のインプットで挑んだため、正直かなりしんどい戦いになりました。
いまだに定数の管理とかライフサイクルを咀嚼できていません。
まだまだVue.jsと仲良くなるための戦いは続きそうです。
ちょっとだけ視野が広がったからこその悩み
まだエンジニアではなかった頃に、ポートフォリオを作りました。
その頃はまだアプリを「動かす」ことで精一杯でしたが、ようやく「動かす」以外の部分にも視野が広がってきました。
- 開発フローはどうするのか
- ログはどのように管理していくのか、どうしたら参照しやすいか
- メールの送信等を検証しやすくするにはどうすれば良いか
などなど、気になる範囲が広がったことで、もちろんそれらに費やす時間も増えました。
まだまだエンジニアとしては半人前以下ですが、継続的なアウトプットを続けて、視野を広げていきたいです。
まとめ
アプリケーションを１から作るというアウトプットは、かなりの時間と労力を使います。
しかし、学習効果としてのリターンは十分にあったと感じられました。
エンジニアとしての業務も忙しいですが、合間を縫ってアウトプットを続けていきます。
最後までご覧いただきありがとうございました。
（↓Githubのスターを頂けると泣いて喜びます。）
あとがき
共同開発に誘ってくれて、一緒にErrorNoteを開発してくれたtoshiroに心からの感謝を。