生成AIそこそこ使っていたり コード書いたり ClaudeのartifactとかV0とか触っている人!
どんどん作って 解っていこう
作ってみよう
お題
スーパーマーケットとか小売の人って競合店の価格調査するらしいやん
今時紙をもって 店内で書きかきなんて照れるやん
スマホにポチポチ 数字だけ入力すればいいやつ作りたい
ローコードツールとかノーコードツールだと
入力欄の大きさとかチョットしたところが調整できなかったりするし
作ればいい (コードはほとんど生成AIに書いてもらう!)
1 どんなのを作りたいのかをhttps://claude.ai/chat/f とか https://v0.dev/ とかに話す
・アプリの仕組み Googleスプレッドシートに商品や価格データを保存したいんでStainってのをつかって
・商品名や価格が見やすく 入力しやすい様にして
・★codepenを使っても出来る様に HTMLとCSSとJSファイルで作って
・相手は24時間365日不休で働ける化物なので 遠慮なく!
・書いたコードに どんな処理をしているのかとかのコメントを初心者でもわかるようにつけて
重要なのはどんな感じにつくりたいか こだわりはどこか
どんなプログラム言語で作りたい どんな構成にしたい それすらも質問しよう
あと 生成AIの提案に時々他にいい方法は無いかを必ず問う事
ClaudeとかV0とか使うとだいたい Ractとかいう初心者にはわけわからんプログラム言語で書く 頑張ればなんとかなるけど 解らない人は上記「HTMLとCSSとJSファイルで作って」のように指示をして codepenとかにコピペで何とかなるようにしましょ もしくは 勉強する
2 不思議な力でいろいろやってくれて プレビューしてくれる
最初っからこれでいい!とかならない まだまだできるだろうと生成AIにどん欲に指示を出す
・価格入力欄とその文字はもっと大きく
・スマホ対応でレスポンシブル?対応して
・保存できたのかわからんから 保存出来たら 「正しく保存できました」とかポップアップで表示して
・あと Stainのどこをどうすればいいのかも 超初心者にわかるように手順教えて
・コードのなかでAPIキーとかURLとか変えた方が良い所は★ココ変えろ!とわかりやすく指示する事 コード内にもコメントして
※あせらず指示は一個ずつ!プレビュー見ながら少しずつ理想に近づける
コードを生成AIに書いてもらってコピペしても動かないってなる躓きポイント!
APIキーとかいうやつ URLとかは自分の環境によって変えなければいけないのに コピペしていたら気づかなかったり忘れる スプレッドシートの名前とか列名やシート名とかも気をつけたい 賢くなりたい!
3 とりあえず形にしてみるまで何とかする
まずは形だけつくる できたら機能を付け足していく こうしたいんだけど言語化できない ならスクショ取って投げてこうしたいんだけどどう伝えたらわかりやすい?? と会話する なんとなくこんな感じのを作りたいをイメージして 伝えて 帰ってきたレスから もっとこうしようと考える
4 世界へ解き放つ
Claudeとかでプレビューつくってもパソコンの中でしか動かなかったりするし スプレッドシートとの連携とかさせるために codepenやGithubやnetlifyにあげて 共有できるようにして配布して 使ってもらって感想を聞く
プログラムとかの知識が増えたら生成AIに指示も伝えやすくなるんだよね
アプリを作っていてデータを扱うようになるとスプレッドシート使ったりAPI使ったり webhookとか使えたらできる事の幅が広がる
ノーコードツール ローコードツールも便利で速い けど 作った方が早いし自分に合った細かい調整が出来た良いなと思います
あと 競合店の価格調査そのものが非効率なのかもしれない、、、、