ブログディログサービス開発レビュー

ブログ開発を始めた理由

以前、GitHub Pagesをベースに運営していた開発ブログがありましたが、自分でブログを作ってみることにしました。GitHubにコードをプッシュして記事をアップロードする方法が面倒だったためです。自分で開発すれば、ブログを運営しながら経験した不便を効果的に改善できると考えました。

たとえば、訪問者の言語に応じて異なるコンテンツを提供する機能を実装できます。英語圏のユーザーには英語で、韓国のユーザーには自動的に翻訳されたコンテンツを表示する方法です。以前は翻訳APIの品質が満足できなかったため、困難がありましたが、ChatGPTの進歩により、今では高品質の翻訳が可能になりました。

また、自分で開発して運営するサービスの楽しさも大きな理由の1つです。ソフトウェアは完成形でとどまらず、常に改善されています。自分で開発すれば、使いながら感じた不便をすぐに解決し、必要な機能を自由に追加して発展させることができます。この点から、自分でブログを作成して運営することに決めました。

開発スケジュール

開発開始から完了まで合計2週間かかりました。サービスの規模に比べて迅速に開発を完了できた最大の理由は、AIの支援です。CURSOR IDEのComposer機能を活用してコーディングの方向性を指示する方法で進めたため、開発時間が大幅に短縮されました。

CURSOR IDE APIの使用料金として約40ドル（基本サブスクリプション料金20ドル＋追加料金20ドル）を支払いましたが、節約された時間を考慮すると、十分に価値のある投資でした。

技術スタック

SEOが重要なブログサービスであるため、SSRを強力にサポートするNext.jsをフロントエンドフレームワークとして選択しました。さらに、TypeScriptとTailwindCSSを併用して開発生産性を最大化しました。

バックエンドは軽量で高性能なGoとMongoDBの組み合わせで構築し、今後はRedisを導入してさらに効率的に改善する予定です。

CI/CDはGitHub Actionsを使用してDockerイメージをビルドし、個人用のHarbor Dockerレジストリにアップロードした後、自宅のローカルサーバーで実行するように構成しました。AWSを使用すればより便利でしょうが、費用負担が大きいため、既存のゲーム用PCを初期化してProxmox上にUbuntuをインストールし、UPSを接続して運用しています。

画像リソースはAWS CloudFrontとS3を連携して提供しています。

使用した主要ライブラリ

• TipTap（オープンソースエディターライブラリ）
  一般的なMarkdownエディタは、左側でMarkdownを入力し、右側でプレビューを提供する方法です。しかし、TipTapを使用すると、ノーション（Notion）のようにスタイルを直接適用して編集でき、より直感的なユーザーエクスペリエンスを提供します。

• next-i18next（多言語サポートライブラリ）
  Next.jsで簡単に多言語機能を実装できるように支援する代表的なライブラリです。現在のプロジェクトでは、Googleスプレッドシートで翻訳データを管理して使用しています。

  

サービス機能紹介

• スタイルが適用された編集機能

  ブログサービスの中心はコンテンツなので、コンテンツの作成および編集機能が直感的で使いやすい必要があります。開発者だけでなく一般ユーザーも簡単に使用できるように、TipTapライブラリを活用してスタイルが適用されたエディタをサポートしています。また、ショートカット機能を追加して、たとえばConfluenceのようにEキーを押すと編集ページに移動するなどの便利な機能を提供し、ユーザーエクスペリエンスを向上させました。

  

• 自動翻訳レベル

  1つの記事を複数の言語に自動翻訳できれば、執筆者はさまざまな国の人々とより簡単にコミュニケーションできます。これにより、記事執筆者の利便性を向上させることが目標です。各投稿の上部にはサポートされる言語リストが表示され、ユーザーが希望する言語を選択すると事前に翻訳されたコンテンツが提供されます。

  

• ユーザー名ベースのアドレス設定

  YouTubeのように<https://blog.danver.io/@0921pig>のような形式で、各ブログにユーザー名（ユーザー名）でアクセスできるように設定しました。これにより、より直感的で理解しやすいURL構造を提供しようと努めました。今後は、ユーザーがカスタムドメインを設定できる機能もサポートする予定です。

まとめ

2週間という短い期間で一人で開発したプロジェクトであるため、まだ不足している点が多くあります。自分で使用しながら発見した改善ポイントをまとめ、着実に改善していく計画です。

ただし、管理しなければならないプロジェクトが増えると見逃す部分が生じるかもしれません。 これを補うために、ClickUpを使用してプロジェクトスケジュールを体系的に管理してみようとしています。効率的に進行しながら、ブログをさらに発展させていく過程自体を楽しみたいです。 🚀