このKAZUKIN LABというサイト自体、AIを制作パートナーにしながら作っている。Web制作は初心者だが、AIに相談しながら進めることで、思っていたよりも自分の理想に近い形に育てられている。

なぜコード直書きに変えたのか

最初はノーコードのツールでサイトを作っていたが、目的のよく分からないページが増えていき、どこに何を書けばいいのか自分でも分からなくなってしまった。同じ失敗を繰り返さないために、あえて素のHTML・CSS・JavaScriptで作り直すことにした。手間は増えたが、構造がシンプルな分、迷いがなくなった。

AIとの作業の進め方

デザインや構成の相談はAIとのチャットで詰めておき、実際のコード作業はClaude Codeに任せている。役割を分けたことで、考える作業と手を動かす作業がごちゃ混ぜにならず、進め方がとても分かりやすくなった。

  • 記事テンプレートをコピーしてarticlesフォルダに保存する
  • 目次ファイル（articles-data.js）に1ブロック追記する
  • これだけで一覧ページに自動反映される
KAZUKIN

AIおもしろいよね

まとめ

AIに全部お任せするのではなく、仕組みの部分は自分でも理解しながら進めているのが、このサイトの作り方の特徴だと思う。これからも自分で育てていけるメディアとして、少しずつ記事を増やしていきたい。

俺式評価

  • 🧑‍💻 Web制作初心者への優しさ　★★★★☆
  • 📁 記事追加の分かりやすさ　★★★★★（テンプレコピー＋1ブロック追記）
  • 🧩 Page1問題の再発防止　★★★★★
  • 🤝 AIとの役割分担の気持ちよさ　★★★★☆
  • 🌱 自分で育てていける感　★★★★★

※本記事は個人の感想・制作記録です。記載のサービス・ツールの提供各社とは何の関係もありません。個人の非公式サイトです。商標は各権利者に帰属します。