技術ブログの作り方 - 要件定義編

2023/10/30

この度、技術ブログ(このサイト)を作ったのですが、当然0から100まで自分で考え設計・開発しています。
備忘録的に開発時の各工程でやることや考え方を残していきたいと思います。
ついでにこの記事にたどり着いたこれから技術ブログを作りたい・個人開発で何か作りたい方の参考になればラッキーです。

初回の今回はまずは要件定義編です。
(文章ばかりのクソ長記事なので覚悟してね)

余談

こんな小さなサイトでしかも個人のブログサイトで要件定義とは大げさなと思うかもしれませんが、個人的にモノを作るときにそれがどんな用途・規模であっても具体的に「どんな用途で・どんなものを作るのか」を把握し定義することは非常に重要だと思っています。
特に個人開発ではプライベートな時間にコツコツ作っていくことになるので、途中で飽きたりしますし作っている途中で脇道にそれたりすることもよくあります。
なので、何のためにどんな機能を作るのかというところまで初めに明確に決めておくことで完成まで進めるビジョンを作るわけですね。
ちなみに「どんな用途で」という部分はプロダクト開発だとビジネス検討とかって言われるさらに前段のフェーズとして分けられることが多いですが、今回は商用サービスでもなければ大した規模のサイトでもないのでマルっとまとめて要件定義として書き殴っていきます。

要件定義でやること

まず、最初に決めておかなければならないことがいくつかあります。
それらを決定することが要件定義フェーズのゴールです。
結論から書くと今回決めることは以下です。

  • このサイトで解決したい課題
  • どんな機能が必要か
    • 課題解決のために直接必要な要件
    • 直接必要ではないが課題解決のためにあると良い要件
  • 必要な機能の詳細な仕様

とまあ、そうだよね。という感じの内容ですね。
以降それぞれに関して詳細に記載していきます。

課題設定

まず

このサイトで解決したい課題

の部分ですが、これは考えて決めるというよりは「なぜこれを作ろうと思ったのか」を言語化していきます。
今回であれば

「Notionに自分のナレッジをためているけどせっかくなら公開できる形にしておきたいな。」
「今後もし転職だったり個人で活動するとなった場合に自分のスキルの証左になるようなものがいくつかほしいな。」
「zennやQiitaに投稿してもいいけど、超ニッチな内容とかメモ程度のものはもっと別のところに置いておきたいな。」
「所謂Jamstackみたいな構成のサイトを作ってみたいな。」
「エンジニアたるもの技術ブログの1つや2つ持っていて然るべきではなかろうか」

というお気持ちを整理した結果、技術ブログを構築しようとなったわけですが、これを解決したい課題として言語化すると

  • Jamstack構成のサイトを構築したい
  • "shin-taro" というエンジニアのスキルを証明できる成果物が欲しい
  • 自身の知見のうち、大手のサイトに投稿しないような内容を気軽に公開できるサイトが欲しい

という感じに3点にまとまりました。
これが今回の個人開発の目的でありゴールとなります。
ビジネス課題ではないのでやりたいことリストみたいになってますが、この程度のものでも無いよりは全然良いです。
(実務ではもっと具体的な課題設定するんやで)

そしてこの3つの課題を改めて確認し、作るべきものが技術ブログである必然性が再確認できました。
このことが重要で、例えば単に「"shin-taro" というエンジニアのスキルを証明できる成果物が欲しい」という課題しかないのであれば作るべきは技術ブログである必要性はなく他のものでも良いわけです。
そうすると、作っているうちに「なんか他のモノ作りたいな~」となって別のものを作り出したりして途中でやめちゃったりするなんてことが個人開発ではザラにあるわけですね。
しかし、このサイトを作る理由はこの3つだ と最初に定義にしてしまえば自分の中で技術ブログを作る理由が明確になるしゴールが決まっているのでモチベーションが落ちにくいのです。あくまで個人的にですが。

基本要件の定義

続いて

どんな機能が必要か

の部分について考えていきます。先ほど課題設定を行ったので、そこに向けて必要な機能要件をリストアップしていきます。
商用サービスだったり実務ならここでビジネス要件とかが上がってくるわけですが、今回はエンジニアである自分1人チームなのでマルっとまとめます。

ここで、

課題解決のために直接必要な要件
直接必要ではないが課題解決のためにあると良い要件

と分けて考えているのが重要で、実務でもよくありますが開発中は大抵の場合工数の都合から機能要件を途中で落としていく必要が出てきます。
個人開発なので納期は無限ですが、今回のモノは完成させて公開しないと課題を解決できないですから。最初から要件の重要度を決めるためにこのように定義していきます。
最初はとりあえずmustのものだけ実装して、後でやる気になったらほかの機能も追加する。と考えておくと終わりが見えて気が楽です。

ではまず、

Jamstack構成のサイトを構築したい

という課題から、Jamstackな構成にする必要があります。
Jamstackとは何ぞという話は割愛したいのですが、ここでは雑に「ホットなサーバーを必要とせず、静的なHTMLとコンテンツ管理・ビジネスロジックに責任を持つアプリケーションを完全に分離した構成」とでも言っておきましょう。

したらば、まず必要なものは記事(コンテンツ)を管理するCMSです。
そしてこのCMSの変更を検知しデータをHTMLに組み込みビルドするrenderと、それを即時デプロイできる仕組みが必要です。

具体的な技術選定は一旦置いておくとして、必要な要件は
「CMSなどでソースコードを編集せずに記事を投稿し、反映できる」
みたいな感じでしょうか。
ついでに僕はマークダウンじゃないと文章書けない体にされてしまっているので、この段階でCMSはマークダウンで書けるものに限定しておきます。
なので「CMSなどでマークダウンで記事を書き、ソースコードを編集せずに投稿・反映できる」となりました。

続いて、

"shin-taro" というエンジニアのスキルを証明できる成果物が欲しい
自身の知見のうち、大手のサイトに投稿しないような内容を気軽に公開できるサイトが欲しい

この2つは技術ブログを構築し公開する。というだけでほぼ達成できるものですが、追加で必要な要素として

  • 独自ドメインであること
  • 見たい記事がすぐ見れること

がそれぞれ挙げられます。
独自ドメインの方は対応しているサービスでホストすれば済む話です。
一方「見たい記事をすぐ見れること」はいくつか解決案があります

  • 検索機能
  • 全記事一覧
  • etc

検索機能は対応するエンドポイントを持つCMSを選定すれば、実現できますが細かい仕様を考えだすと若干ではありますが重そうです。
一方で、全記事の一覧だけでは見たい記事がすぐに見れるとは言えません。

なので今回は「全記事の一覧」の画面を作りつつ「特定のタグが付いた記事の検索機能」も作るという要件にしました。
限定的な検索機能なのでそれほど重くないですし、それなりに便利です。よりリッチな検索が欲しくなったら追々作ります。

ということで、必要な要件は

  • CMSなどでマークダウンで記事を書き、ソースコードを編集せずに投稿・反映できる
  • 「全記事の一覧」の画面
  • 特定のタグが付いた記事の検索機能

となりました。
あとは必要な機能の詳細仕様を決めていくわけですが、この辺は正直お好みでという感じですし、ある程度作りながら考える必要がある部分でもあるので今回は割愛します。

まとめ

ここまでで、解決したい課題

Jamstack構成のサイトを構築したい
"shin-taro" というエンジニアのスキルを証明できる成果物が欲しい
自身の知見のうち、大手のサイトに投稿しないような内容を気軽に公開できるサイトが欲しい

という課題に対して

CMSなどでマークダウンで記事を書き、ソースコードを編集せずに投稿・反映できる
「全記事の一覧」の画面
特定のタグが付いた記事の検索機能

という要件まで決まりました。
これで作るものが具体的に決まってきたので、次にフェーズに移っていけます!
次はデザイン編をやります。
(途中で飽きたら実装編をやります)

shin-taroのプロフィール画像

shin-taro

フロントエンドをやっています。 このブログは気ままに書いているので更新頻度は疎らです。