こんにちはmofmofでエンジニアをしているshwldです。
mofmofでは今年の1月から毎週水曜日にみんなで個人開発する時間が設けられています。
水曜日と、毎日1時間半程度(やってない日や逆に多くやった日もありますが、均すと多分このくらい)を使って2ヶ月でSNSのようなサービスをリリースできそうなところまで持っていけたので、やったことをログとして書きます。
作っているもの
エンジニア向けの、フローメモを投稿できるSNSを作っています。
デスクトップアプリで、すぐに起動してさっと書けて
投稿内容を友達とシェアできるようなものです
作りものとしては
- Webサービス
- メールアドレスでログイン・登録
- メールアドレス、パスワードを変更できる
- プロフィールを編集できる
- 投稿
- 新規メモを作成できる
- メモに返信できる
- メモを編集できる
- メモを削除できる
- 自分のメモを一覧できる
- ページネーションできる
- 友達を招待できる
- 招待を承認できる
- 友達のメモを一覧できる
- 自分・友達のメモにコメントできる
- コメントを参照できる
- ページネーションできる
- コメントを編集・削除できる
- 招待されたことを知ることができる
- コメントが来たことを知ることができる
- エディタ
- マークダウンショートカットが使えるWYSIWIGエディタ
- 階層化可能なタグ
- コードの言語を指定してハイライト
- コードにファイル名を付与できる
- ランディングページ
- プライバシーポリシー
- GraphQL APIを使って、メモをダウンロードしたり活用できる
- デスクトップアプリ
- トレイに常駐し、ショートカットで即座に起動してメモがかける
- マークダウンショートカットが使えるWYSIWIGエディタ
- 階層化可能なタグ
- コードの言語を指定してハイライト
- コードにファイル名を付与できる
- ログインできる
- ショートカットの設定を変更できる
- macOS, Windowsにインストールできる
- アップデートが通知され、アップデートできる
- トレイに常駐し、ショートカットで即座に起動してメモがかける
といった感じです。
機能数はまあまあだと思いますが、どの機能も一般的なサービスによくあるもので、難しい機能はそこまでありません。
どんなふうに進捗したか
ここから、実際に1月から今までどのように進捗してきたかを時系列で書いていきます。
冬休み(12/27~1/3)
- 作るもので使いたい技術はなんとなく固まっていた。作るものはなんとなくこれかなーくらいで考えていたものがあった
- 12/27に
git initしてる - 12月にアドベントカレンダーを書くために作っていたサンプルアプリのコードを流用して、Next.jsベースのリポジトリを作成してv13マイグレーションを楽しんだり、Tauriどうかなって触っていた
1月1週
- 1月2週から企画が開始するので、作るものを検討、インセプションデッキを作った
1月2週
- ウェブページの画面設計を頭の中でし、それをもとにTailwindCSSを使って動きのない（ページ遷移のみで機能は未実装）画面を全ページ分実装した
- デスクトップアプリの画面も同じように動きのないものを作った
- 認証周りを実装した（流用元と別のを使うことにしたので作り直した）
1月3週
- ノートをデスクトップアプリ、ウェブページから投稿して一覧できるところまで作った
- タグ登録、検索できる
- なんとなく最低限の投稿体験ができた
1月4週
- コメントできるようになった
- サーバーサイドコードハイライトとかやってた
2月1週
- 招待・承認
- 友達を招待して繋がれる体験ができた
2月2週
- 通知
- ログイン周りとか細かいところの改善してた
2月3週
- ユーザーがGraphQL APIを使えるようにした（APIキーの発行とか、キーを使って呼び出し）
- デスクトップアプリでグローバルショートカットをカスタマイズできるようにした
2月4週
- デスクトップアプリのコード署名
- 電気通信事業者の届出（必要なのか微妙だけど届出は難しくないらしいのでやっておいた）返信待ち
- プライバシーポリシー作った
- 届出の返信待ちで暇なのでダークモード対応したり色々改善
開発は膨張する
- 2ヶ月で作り切るというラインで始めました。最低限の機能で、と思って作り始めても、2ヶ月を埋めるように色々とやってしまいます。パーキンソンの第一法則ですね...
- そして最後の方に考慮漏れとか優先度高いものが見つかることが多いので、最低限を追求するのは本当に大切...
- 2ヶ月で作り切るということを考えるなら1ヶ月半で作り切るラインを引いた方がよいですね
開発を早めるために意識したこと
- 使う技術は事前に使用感覚を掴んだ
- 今回、Next.jsのApp DirectoryやTauriはお初でしたが、使う前に数日触ってみていました。そこでつまづきが多ければやめていたと思います。
- 過去の資産を活用する
- Next.jsやPrismaは修作していたアプリがあるので、そこでじっくりどういう設計がいいのかを考えていたものを流用しました。過去たどり着いたところから作り始めることができるので、スピードアップになります。
-
Plop.jsをフル活用
- スピードを出すのにPlop.jsは欠かせません。今回のような基本的なCRUDが多用されるサービスにおいては特にテンプレからジェネレートの恩恵が大きいです。
近日リリース予定です
なかなか良いメモ体験を実現できたのではないかと思っています。
電気通信事業者の届出が受理されたらリリースしようかなと思っています。
なぜ作ったのか、コンセプトや、技術要素など別途記事を書いていきたいと思っていますので、どうぞよろしくお願いします！
追記:
リリースしました
最後に、
この記事は、株式会社mofmofの「水曜日の個人開発」の取り組み内で書きました。
Discussion