【個人開発】超ニッチなサービスをNuxt.jsとFirebaseを使って3日間で開発した話

はじめに

こんにちは!FundastA Inc.の片田です!

エンジニアに転職して半年が経ちました。

きちんとしたサービスを個人で作るのは、転職活動をしていた頃のポートフォリオ以来でしたが、

久しぶりにどうしても作りたい衝動に駆られてしまい、寝食以外を忘れて開発に没頭してしまいました…。

当記事では、僕が3日間で作った超ニッチなサービスについてご紹介させていただければと思います!

GoodCoffeeの紹介

今回開発したサービスは、GoodCoffee (グッドコーヒー) というサービスです。

サイトは下記URLから。

https://goodcoffee.dev

サービス概要

GoodCoffeeは、一言で言えばコーヒーをカッピングして、そのデータを管理するアプリケーションです。

「カッピング」とは、ワインでいうところのテイスティングみたいなものです。

生豆の卸業者さんや、インポーター(輸入者)さん。それから焙煎士の方がそのコーヒー豆のポテンシャルを評価するための手法で、コーヒー豆に得点をつけることでそのコーヒーの品質を表すことができます。

また、コーヒー豆生産国で行われるコーヒー豆のオークション(COEと言います)でも、カッピングで豆の品質を評価して順位付けしています。

なぜこのサービスを作ったのか

僕は元々バリスタとして働いていた当時、あったらいいなこんなサービスって思っていました。

エンジニアになった今日、それを実現してみたかったのです。

自分で言うのもなんですが、正直これ誰が使うんや…って思ってます。

でもいいんです。個人開発なんて自慰行為のようなものなのですから…。

自分が使えて、自分が満足できればいいかなあ。今度は収益化できるものも作ってみたいけれど。

要件定義

実現したかった機能はこちら。

  • カッピング機能(タイマー付きでリアクティブに画面が遷移していくやつ)
  • ユーザー登録機能(emailだけでなく、SNS認証も)
  • お試し機能(アカウント作成しなくても一個だけコーヒーをカッピングできる)
  • カッピング結果をSNSにシェアする機能

以上です!

非常にシンプルなアプリですが、あまり盛り込みすぎてもなあと思い、このくらいの規模感で作りました。

技術選択

クライアント

クライアントはNuxt.jsで作りました。

僕の専門分野はサーバーサイドですが、今までちょこちょこ触っていたこともあり、ただ動くものを作るだけなら学習コストもかからないかと思ったのでNuxt.jsを選択しました。

ちなみに、今回は特にSSRする必要もなかったので、SPAモードで開発しました。

CSSフレームワーク

最近流行のTailwindCSSを使用しました。

理由としては、bootstrapやVuetifyを使うと、いかにもそのフレームワーク使いました的なデザインになるのが嫌だなあと思ったのと、ひたすらシンプルでよかったので、使い勝手が良さそうで用意された最低限のコンポーネントのデザインも綺麗なTailwindCSSを選択しました。

インフラとかバックエンドとか

これはFirebaseで全て完結しています。

作りたい機能がシンプルだったので、Firebase使えば工数少なく済むしなあ、と言うくらいの気持ちで選択しました。

ありがたいことに、副業先でFirebaseをガッツリ使わせていただいており、そこで得た知見を生かせるかなあと思ったのも理由の一つです。

AuthenticationとFirestoreのセキュリティルールだけでバックエンドの機能は完結しています。

また、SPAなのでホスティングもFirebase Hostingで行っています。

なぜ爆速で開発できたか

ひとえにFirebaseが便利すぎました…!

Firestoreのデータモデリングさえきちんと考えれば世の中のアプリケーションはあらかたサーバーサイドを書くことなく実現できてしまいそうな気がしています…。

また、Nuxt.js + TailwindCSSもDXがよかったです。

僕は最低限のCSSしかかけませんが、それでも特につまづくことなく開発できたのはうれしかったです。

タイトルでは3日間としておりますが、もっと具体的には約30時間ほど、80commitsで開発できています。

(まだちょこちょこバグがあるけど運用しながら改善していきます。。)

苦労したところ

セキュリティルールをゴリゴリ書く部分が結構大変でした。

スキーマ検証や値のバリデーションも行っているので、セキュリティルール書くだけで5〜6時間かかりました笑

あとは利用規約とプライバシーポリシー書くのが地味に大変でした。。

今後の課題

諸々のバグ修正、さらに追加したい機能もいくつかあるのでそれらをのんびり追加しつつ運営していきます。

知り合いのバリスタさんとかに使ってもらいつつフィードバックをもらいたいなあと思いつつ、バリスタさんに使ってもらうにはネイティブアプリにした方が良いと思うので、Flutterをちゃんと勉強してみようかなあと思いつつ。

おわりに

誰が使うんや!ってくらいニッチなサービス作っちゃいましたが、満足かつ楽しかったので良しとしましょう。

個人開発たのしい。。。。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA