2024年の6月くらいから構想していたものが、ついに形になりました！
NotePressというサービスのMVPをリリースしました！
アプリの内容としては
- Notionユーザーであれば誰でもブログ構築＆執筆可能
- ドメイン＆サーバー代無料
- ブログ記事は高速表示される
- NotionのAI機能を使えば、記事を大量に量産可能(検索汚染には気を付けてね)
です。個人のブランディングとして使うのも良し、アウトプットでブログ投稿するのも良しです。個人的には「Notionメモのついでにブログ投稿できる」のが最推しポイントです。これをLPの見出しにしても良いかも…
ブログテンプレートは無料の「Minimalist」しかまだ用意できていません👇
これからも質の高いテンプレートを作って有料(買い切り)で販売していきます。
NotePressの技術スタック
NotePressの技術スタックと構成図はこちら。
複雑になりすぎたのが反省点です。ちょっと見づらいので、下記に列挙します。
フロントエンド
- Next.js App Router
- Typescript
- TailwindCSS
- shadcn/ui
- framer-motion
バックエンド
- Next.js App Router (Route Handler / ServerComponent)
データベース
- Neon
認証
- Clerk
決済
- Stripe(未実装/予定)
サードパーティAPI
- Github API
- Vercel API
- Notion API
ホスティング
- Vercel (20$ : 商用利用のため)
AI補助ツール
- Cursor
- Claude 3.5 sonnet
THE・個人開発の技術スタックですね。
データベースにSupabaseではなくNeonを利用した理由は「DBだけ必要だったから＋使ってみたかったから」です。
認証は今回Clerkを利用したので、Supabase Authentication等を利用しないので、必要ないかなという判断でした。
Supabase Authだと認証完了→Trigger Functionとかの設定が面倒だった記憶があるので、それもSupabaseを使わなかった理由かも、、ClerkだとWebhookで簡単にAPI叩けるから嬉しいポイントでした。
NotePressを開発して感じたこと・振り返り
NotePressのアイデア着想から半年くらい経ってしまったのが、今回の反省点です。
確かに少し複雑な要件でありましたが、もっと簡単にMVPが作れたはずでした。次新しいものを作るときは、なるべく簡潔な要件で開発をスタートさせ、リリースを早くしたいと考えています。
AI駆動開発の強みと弱み
今回の開発ではCursor / Claude 3.5 sonnet / Bolt.newを駆使して開発しました。メリデメを紹介します。
メリット
- 初期のポン出しは最強
- UIはほとんどAIで作れる。しかも質が良い
- 初期開発コストを50%以上削減できる
- 頼れる相棒
デメリット
- 開発後半だとポンコツになる
- ファイル記述量が多いと重くなる
- useEffect()乱用しがち
- サードパーティのAPI利用が苦手
です。AIがあるからLPも20分でクオリティ高いものが作れるしマジで感謝しています。
毛嫌いしてる人は触った方がいいと思ってます。Bolt.newとCursorのコンボでフロントエンドはすぐに完成します。
バックエンドの方から簡単になると思いきや、まさかのフロントエンドが一番の恩恵を受けてるのが面白いです。
デメリットとしては後半でポンコツになります。少しの修正でもとんでもなく重いし、待ったら待ったで全然意図しない修正や前動いてたものを壊したり。。
まだまだ扱いが難しいAIさんです。
直近でアップデートしていく実装
これからアップデートしてSNSでも告知しようと思っています。直近だと
- トップページの修正
- ステップの手順をもっと分かりやすく
- 新しい質の高いブログテンプレートの作成
- 決済の実装と販売
で、徐々にアップデートしていく予定です🚀
デプロイからリリースするまでに気を付けた事
最後に、僕の知人からいただいたご相談なのでお答えします！
デプロイが完了してからリリースするまでに気を付けたことは以下です。
- アプリのメイン機能が正常に動くかを自分で本番環境でテストした
- コミュニティ内の人や友人に触ってもらって、フィードバックを受けた
- 共有されたときのことを考えて、OGPもちゃんと機能するかチェックした
- PVの計測をしたいのでアナリティクスの導入をした
- Xでポストするのは怖いが、思い切って投稿した
くらいです。
リリース前に友人や知人にテスターを手伝ってフィードバックを受けるのは大事だなと思いました。自分が想定外のところで躓いたりしますので、参考になります。一人でも良いので誰か探してお願いしてみると良いかもです。
僕のShinCode Pro(名前変わりました)のコミュニティでは、テスター募集もできますので気になる方はご覧ください(僕は必ずテスターできます)。
ちなみにサブスクから買い切りに変更しました。。ごめんなさい。
ということで、以上です👋