作成日：2026-03-06

VSCode で１から Note風な Webpage をつくった件について

本当は、自分の手で PHP と CSS を書いてWebpageを作るのが一番いいのですが、ある程度AIのクリエイトするものを扱ってきて…もしかして私よりもAIのほうがデザインセンスが良いのではないか？と思ってしまったので、クリエイトの部分をAIに任せてみることにしました。

公開先

単刀直入に下記のことをお願いしました。

- 旧Twitterのようなデザイン
- 左にカテゴリー一覧
- 右に記事を表示
- 記事の管理はファイルにマークダウン(.md)で保存したい
- カテゴリー名はフォルダーで管理

AIにお願いしてから、Webpageが完成するまでに大体50Requestくらいでした。時間でいうと6時間くらいでしょうか？

これを自分でやるとおそらく最低でも１ヶ月の試行錯誤が必要になるのではないかなと思います。（mdファイルの管理、markdownのパース、デザインなど）

それを６時間で完成するとなると、AIのクリエイトは恐ろしいくらい思いどおりのことをしてしまうことに驚きを隠せませんでした。

例えば「デザイン」のセンスは「デザイナー」しかできないし、プログラムの可否（動き）は「プログラマー」しか理解できないけども、あなたのwebpageを作ります！！といった「Webクリエイター」はもしかしたら無くなってしまうのかもしれませんね。

私も生粋のHTMLプログラマー（手打ち）を子供のころから２０年以上やってきましたが、これだけ便利なものやAIのこうしたほうがいいよという機械的目線のアドバイスがあると、人間というのは独自の方法でクリエイトしてしまうんだなと感じました。

ただNetflixみたいなインパクトのあるWebデザインを作るのは、人間の手がないとおそらく難しいので、そこはフロントエンドとバックエンドの共存性なのでしょうね。

プログラマー（AI）ですけどね。でも他人に伝える文章力があれば、誰でもプログラマーになれる時代になっているのかもしれませんね。

最近では「先生が子どものためにタブレット用アプリをつくった」［現役教員が個人開発したGIGA端末で使える無料の計算ドリル『ますとれ］というのがニュースで話題になってましたが、

イラストレーターがプログラムを組んで自分の思い通りの世界を作るのも近い将来当たり前になっているのかもしれませんね。

プログラマーは「内容を理解できる読解力の人」になるのかなと思っております。AIがクリエイトするものを理解して、AIに指示を出すことができる人がプログラマーとしての価値が高まるのではないでしょうか？

例えば一般の人が

for (let i = 0; i < 10; i++){
	console.log(i);
}

といったコードをみても理解できない。ただコードを読める人なら「1から10までの数字を順番に出力するコードだな」と簡単に理解できると思います。

それを膨大なコードの中から理解して、不正してないか、エラーが出ているのはどこなのかを瞬時に理解できる人がプログラマーとしての価値が高まるのではないでしょうか？

ここのブログには、基本的に相手に伝えることをメインに置いているので「メモ」といった記事はよろしくないのかなと思っていました。

ただ、外部ツールを使うと、やはりそのウェブサイトの制約などがあったりして「書く」といったことに集中できない。そして自分のデザインやMarkdownで管理できないといったことがあって、自分のサイトで「メモ」を書くことにしました。

公開ノートのような感じで、博物館で気になった作品や、調べて必要だと思ったことを残していきたいと思います。

現時点ではフリー公開なので、もし何か参考になることがあればみていただけると嬉しいです。