1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

空きコマで日程調整できるアプリを個人開発した話

Last updated at Posted at 2024-07-03

こんにちは!
個人開発にアホみたいにハマってしまった大学生です。
Comma(コンマ) という📅日程調整サービスを運営しています。

最近、Webに加えて、iOSにもサービスを展開したので、
これまでの紆余曲折を記事にしていこうと思います!

サービスの概要


みんなの空きコマでサークルの練習、ミーティングをしたい!

大学生を経験した方なら、こう思ったことがあるのではないでしょうか??
Commaはそんなときに役立ちます。

自分の空きコマを入力して、友達と共有できる。
みんなの空きコマが一目でわかる。

そんな日程調整サービスです!

https://apps.apple.com/jp/app/comma-%E7%A9%BA%E3%81%8D%E3%82%B3%E3%83%9E%E3%81%A7%E6%97%A5%E7%A8%8B%E8%AA%BF%E6%95%B4/id6504521309
https://com-ma.app

作ったきっかけ

自分は音楽サークルに所属していて、空きコマで練習をしていました。
練習の日程調整は、tappyというサイトでやっていたのですが、
入力がめんどくさくて、UI/UXに改善の余地があると思ったのがきっかけです。

機能

Commaには空きコマの入力をラクにする機能があります。

週間スケジュール機能

1週間の空きコマってだいたい同じですよね??
(月は2限が空きコマ、火は3限と4限が空きコマのような感じ)

Commaには1週間の空きコマを登録する機能があり、
入力画面で、各曜日の空きコマをワンタップで反映できます

ペースト機能

文化祭などの時期は、いろんな用事の日程調整が必要ですよね??
そんなときはペースト機能を使って、二度手間を省きましょう!

サービス展開の流れ

2022年11月  Web版の開発をスタート
2023年04月 Web版をリリース
2024年03月 iOS版の開発をスタート
2024年07月 iOS版をリリース

約1年半、サービスを運営しています!

Webの技術スタック

フロントエンド

Laravel Blade + Vue.js + Vuetify

Vue.jsとLaravelを連携させて構築しました。
セットアップはかんたんで全然困らなかったです。

UIフレームワークはデザインの好みでVuetifyにしました。
アニメーション付きのコンポーネントが多数用意されていて、
classでスタイリングもできるので良かったです👍

セッションの値などをVue.jsで扱うには、
Laravel Bladeから渡す必要があるので、そこは面倒くさかったです、、

バックエンド

Laravel

プライベートでもインターン先でも使っていたLaravelにしました。
認証周りなどが最初から用意されていて、使いやすかったです!
ライブラリも充実していて、やりたいことがすぐ実現できました。

Webのメリット・デメリット

メリット

・修正をすぐに反映できる。
・維持コストが安い。
・審査がない。自由。
・インターネットがあればどんな端末でもアクセスできる。

デメリット

・検索流入が見込めない。(個人でSEO対策は限界がある。CSRだとSEO不利すぎる。)
・Adsenseの審査が厳しく、広告掲載のハードルが高い。
・ネイティブアプリと比べて、サービスへのアクセスがめんどくさい。

iOSアプリを作るモチベーション

Webの方をがんばっていたのですが、段々ネイティブアプリを開発したいと思うようになりました。
その理由は3つありました↓

AppStoreの検索流入の方が期待できそうだから。
Admobは広告単価が高く、審査も厳しくないから。
利用ハードルを下げれるから。

そんな理由で気づいたら、iOSアプリ開発のやる気が出ていました。

iOSアプリの技術スタック

クライアント

React Native + Expo + Tamagui

iOS、Androidの両方で出したかったので、クロスプラットフォーム対応フレームワークにしました。
(AndroidはGoogle Playの審査が厳しくて出せてません😭)

Flutter / React Native論争があると思うのですが、自分は
Reactに慣れていた
Dart学ぶのめんどくさい、ネスト深くなりそう(偏見)
ネイティブUIへの憧れ
といった理由でReact Nativeを選びました。

UIライブラリは、話題になっていたTamaguiにしました。
デザインが好みだったので選びました。
コンポーネントには、スタイリング用のpropsがあったので、
スタイリングしやすかったです👍
アニメーション用のpropsもあって、簡単にアニメーションを実装できました。
イマイチな点は、Betaのコンポーネントがあるところですね、、

Expoは素晴らしいフレームワークだと感じました。
ローカルストレージ、生体認証、ストアレビューなど
必要なプラグインが用意されていて、とても開発しやすかったです。
Next.jsのようなファイルベースルーティングもよかったですね〜

React Nativeエコシステムの懸念点は保守性ですね。
Commaも多くのサードパーティライブラリを使用しているので、メンテナンスが
大変になりそうだなと思いました。

バックエンド

Laravel + Firebase

バックエンドはWebと同じです。
やったことは、APIエンドポイントの用意とトークン認証の導入くらいです。

WebがOAuthに対応していたので、iOSでも対応させるために
Firebase Authenticationを使用しています。
WebではFirebase Authenticationを使っていないので、
認証データの整合性を取るのが大変でした、、
ですが、色んなOAuthプロバイダーでの認証をFirebase SDKでできるのは便利でした👍

運営を続けるモチベーション

ありがたいことに、平均DAUは10~15となっていて、使ってくれている方がいます。

「いいアプリですね!」
「〇〇の機能をつけて欲しい!」
そんなユーザーさんの声がモチベーションになっています。

このサービスでは大した収益はないのですが、(なんなら赤字😭)
自分が作ったものを評価してもらえるのは、何事にも変えられない財産だと思っています!

また、個人開発では技術面でも色んなメリットがあります↓
色んな分野の知識が身につく
新しい技術を試せる
職場で学んだことを活かせる
保守性を意識してコードを書くようになる

これから

現状、Commaのユーザー規模はとても小さいです。
これからは、ZennやSNSなどで色んなことについて発信し、Commaを成長させたいと思っています!
ここまで読んでいただきありがとうございました🙏
https://apps.apple.com/jp/app/comma-%E7%A9%BA%E3%81%8D%E3%82%B3%E3%83%9E%E3%81%A7%E6%97%A5%E7%A8%8B%E8%AA%BF%E6%95%B4/id6504521309
https://com-ma.app

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?