はじめに
普段はRubyをメインにサーバーサイド開発をしています。
この度、個人開発で上場企業を比較できるサイトを個人で開発しました。
開発したサイト: 上場企業ランキング
開発に関する技術選定は今後の開発効率を左右する重要課題であるものの、個人開発の場合はを1人で行うためかなり悩みました。
今後個人開発を始める方にとって少しでも参考になることがあれば良いなと思い、本記事では私が技術選定について考えたことや採用した後の感想を記します。
基本的なスタンス
まず、今回の個人開発の目的ですが、サービスの成功を重視しています。そのため、新しい技術の習得はそれほど重要視はしておりません。
その上での基本的なスタンスです。
- 業務を通して使い慣れた技術を使う
- 新しい技術は開発効率に寄与する場合のみ採用する
- 管理コストの低いマネージドなサービスを利用する
以下、バックエンドとフロントエンドの両面から解説します。
バックエンド
WEBフレームワーク: Rails(APIモード)
- 業務で1年以上利用しているため採用
- ORM(Active Record)やテスティングライブラリ(RSpec)の使いやすさが素晴らしい
Go言語とEcho(かGin)を採用し、OpenAPI定義を生かして、OpenAPI Generatorでサーバー用のコードを自動生成する方法も検討しましましたが、それでも使い慣れたRailsよりは開発効率が落ちてしまうことを懸念し不採用としました。
インフラ: Heroku
- 定額の利用料のため(現在は、月月$7のHobbyプランを利用中)、利用料金の見通しを立てやすい
- ymlでコード化し開発環境に利用しているDockerfileをでイメージをビルドできるので、構築コストが低い
クラウドインフラ学習のためAWSやGCPも検討しましたが、利用料金過多になることを危惧し不採用となりました。
DB: PostgreSQL
- Heroku との相性が良い
インフラにHerokuを利用することが決まっていたので、相性の良さからDBはPostgreSQL一択でした。
CI/CD: GitHub Actions
- GitHubの秘匿情報管理の手間がなく安心
使い慣れたCircle CIを利用する場合も検討しましたが、今回の開発ではメリットがなさそうだったので不採用となりました。
フロントエンド
JSフレームワーク: Nuxt.js
- 業務でVue.jsを半年以上書いているため学習コストが低いため採用
- ディレクトリ構成の規約や、ルーティングの自動生成によって開発効率がかなり高い
- 設定周りの記述を
nuxt.config.jsだけで完結できて便利
Nuxt.jsほんと素晴らしいですね。今回の開発で初めて利用しましたが、すんなり導入できました。
CSSフレームワーク: Bootstrap
- モバイルフレンドリーかつフラットデザイン
- ほぼstyleタグを書かなくて済むため、JavaScript、Vue.jsのコーディングに集中できる
- ドキュメントやカスタマイズの情報が多い
- 色をデフォルトから変更するだけで、Bootstrapぽさを軽減できる
- Tree Shakingを使わないとバンドルサイズが肥大化しすぎるので注意
他にもVuetifyやMaterial、TailwindCSSも検討したものの、マテリアルデザインな点やモバイルに対応していない点、情報量の少なさから不採用としました。
ホスティング: Netlify
- GitHub と連携しデプロイを自動化できる
- ドキュメントやブログ等に情報が多い
Netlifyにホスティングを終えた後に、Vercel が無料枠で利用できスループットがよいということを知ったので、Netlifyに課題感が出てきたらVercelへの移行を検討します。
参考
まとめ
今回の個人開発では、使い慣れた技術(Rails や Heroku)を使いつつも、初めての技術(Nuxt.js や GitHub Actions)を利用することで、開発効率と技術学習を良いバランスで実現できています。
引き続き、開発したサイトをグロースしていきたいです。