文字カウンター

文字カウンターです。テキストを入力すると、同時に文字数と段落数を計数して表示します。入力されたテキストを、そのままテキストファイルとして保存したときのファイルサイズをkB単位で表示します。

生成AIをもちいた制作

なお、このプログラムはHTML・CSS・JSを生成AIをもちいて制作しました。

一発でできました。

ちなみに、書いたプロンプトは以下のような感じです。

1回目

あなたは超優秀なフロントエンドエンジニアです。
Javascriptで、文字カウンタを作って下さい。詳細仕様は以下によります。
・文字入力エリアを一番上に配置すること。
・文字入力エリアの大きさは、横は画面幅の80％、縦は10行程度とすること。ただし、縦方向の大きさ可変とする。
・文字入力エリアは、手入力およびコピペでの入力を可能とすること。
・文字入力エリアのテキストに変更があったら、リアルタイムで文字数等をカウントすること。
・文字数をカウントするほか、パラグラフ数をカウントすること。
・パラグラフ数は、行末の改行数とすること。
・リセットボタンを文字入力エリアの下で、水平方向は中央揃えとすること。表示文字は「リセット」とする。
・入力文字をそのままテキストファイルとして保存したときの、ファイル容量を単位kBで表示すること。

ただし、リセットボタンの位置は、AIから提示ものは計数表示の下でした。ここだけ、HTMLとCSSを手修正しています。

それから、ChatGPTとClaudeだと、後者のほうが見た目を細部まで作り込む傾向があります。わたしの好みはClaudeです。先日のスロットマシンも、Claudeが凝った作りになりました。

スロットマシン

3リールのスロットマシンです。横一列のみの判定です。スペースキーでスタートして自動で止まります。 小当たりと大当たりで演出があります。 スペースキーでスタート！ …

光都ICTクラブ

AIによって、クセがあるのが面白いと感じます。