# いらっしゃいませ！ 5分で学べる。ハチコのAI実践カフェ おはようございます。この番組では、ママエンジニアハチコがAIでできたことや、おすすめのAI活用法をお届けしています。 もしこの放送を気に入っていただけたら、いいねやフォローお待ちしております。とっても励みになります。 さて、9月15日、月曜日、祝日、皆様いかがお過ごしでしょうか。 先週何度かお話しした、塗り絵アプリについて、追加でちょっと工夫した点があるので、今日はそのお話をしてみようと思います。 # 脱ベタ書き！設定ファイル活用のススメ ということで 今日のテーマはこちら ベタ書きから設定ファイルへ まず 塗り絵アプリの概要について さくっと振り返ってみようと思います 私が今回作った塗り絵アプリは まず最初の画面にカテゴリーを選択するボタンが出てきて それをポチッと押すと 今度はそのカテゴリーに分類されている 塗り絵のサムネイルが出てきます そしてさらにそこでポチッと押すと 塗り絵が出てきて あとパレットとかが出てきて 塗り絵ができるという流れになっています コードは全部クロードコードに書いてもらいました 最初は3つカテゴリーを用意して うまく動くかなって作っていったんですよね この先 どんどんカテゴリーを増やしたり 塗り絵を増やしたりしていきたいなと思ってるんですけど 最初に書いてもらったときは ベタッとカテゴリー名がページというか プログラムの中に埋まっている状態だったんですよね 時と場合によるんですけど こういう固有のデータがページに埋まっているのが いい時と悪い時とあって 今回みたいに今後カテゴリーが増えていくぞとか 塗り絵が増えていくぞとか あとはカテゴリー名を表示する箇所が複数あるぞとか そういったときは コードの中にベタ書きするよりも 別のファイルに情報をまとめておいたほうが 管理しやすかったり 修正するときも楽だったりします 今回はカテゴリー.jsonという JSONファイルというものにまとめてくれました 内容は まずはカテゴリー名 そして そのカテゴリーを選択するボタンに クロードコードが絵文字をそれぞれ 振ってくれてるんですよね なので その絵文字 それから 塗り絵を管理しているホルダー 今回はカテゴリーごとにホルダーを作って その下に塗り絵の画像を入れています 例えば 動物の塗り絵だったら Animals っていうホルダーの下に塗り絵を置いてるんですよね なので 動物っていうカテゴリーと Animals っていうホルダー名を ひも付けておく必要があるので そのホルダー名も一緒に管理します あとは 塗り絵のファイル名ですね ファイル名は カテゴリー一つに対して 複数存在するので 一対一対に書けるような形で 書いてもらっています 正直 バイブコーディングでいろいろ AI に書いてもらう もしくは修正してもらうんであれば ベタ書きのままでも そんなに困ることはないかなって思います でも これからもっと複雑なものを作っていきたいなとか バイブコーディングをきっかけに プログラムを自分でも組めるようになりたいなという方は ぜひ情報を一箇所に固めておくとか 情報を再利用しやすいようにするとか あとは修正しやすいようにする みたいな視点を持って 行動をブラッシュアップしていけると いいかなって思います ということで 今日もここまで聞いてくださって 本当にありがとうございます 一緒に AI で毎日ちょこっと進化していきましょう それでは またね