# 20250703_AIを使えば何でもできるわけじゃなかった

###### tags: `ブログ記事`

- [ ] 公開（ブログ公開担当者がいじるやつ）

太字斜体で書いてある内容を埋めて行ってください．
文章，画像は太字斜体の下の行に入れてください．
最初に書く時はREADMEを読んだら読むといいと思います．

<br>

## 表示されない情報
***書いた人の名前(自己紹介文と同じ名前)***
{
かんば
}

***記事の簡単な説明(検索した時にタイトルの下に出てくる文章)***
{
生成AIは土台となる知識がないと使っても効率が上がらなかったという話です。
}

<br>

## 表示される部分
***サムネイル画像***
{

}

***カテゴリ***
以下の中から該当しそうなカテゴリを選択してください
※一つだけ選択してください
- [ ] 対外活動
- [ ] 活動の様子
- [ ] メンバーの趣味
- [ ] 実務訓練体験記
- [ ] NUTMEG Advent Calendar 2023

***タグ***
以下の中から該当しそうなカテゴリを選択してください．当てはまる物がない場合は適宜追加してください.
言語
- [x] HTML
- [x] CSS
- [ ] Python
- [ ] Go
- [ ] Ruby
- [x] JavaScript
- [x] TypeScript
- [ ] Dart
- [ ] Rust
- [ ] Kotlin
- [ ] Swift

フレームワーク・ライブラリ
- [ ] Ruby on rails
- [ ] Vue.js
- [ ] Nuxt.js
- [x] React.js
- [x] Next.js
- [ ] Gin
- [ ] Flluter

ツール
- [x] GitHub
- [ ] ターミナル
- [ ] WSL
- [ ] Ubuntu
- [ ] Docker
- [ ] Raspberry Pi
- [x] Figma

分野
- [ ] チームづくり
- [x] フロントエンド
- [ ] バックエンド
- [ ] インフラ
- [ ] Web-design
- [ ] API関係

---

***以下に本文を記載してください***
## はじめに
今年からNUTMEGに入ったかんばです。
　このブログでは、AIを使って開発しても何でもできるわけじゃなかったという話を書きます。

## Webページを作るまで
　自分は4月にNUTMEGに入ったあと、メンター会でフロントエンドの学習を始めました。HTMLがページの構成を作り、CSSでページがデザインされ、JavaScriptで動的な処理が記述することを本当に一から教えてもらいました。
　そこまでは何となくイメージがついたのですが、「Reactは役割によってWebページを要素に分割して、構造・見た目・動きを一体化させて開発できるから便利だよー」という話から怪しくなり、コンポーネント指向ってむしろわかりづらくね？、仮想DOMってなんだ？、ReactとNext.jsは何が違うんだ？など説明されてもイメージできなくて何も分からん！状態になりました。
　そこで、メンターのうっちーさんに自分でWebページを作ってみて、理解を進める方法を提案されました。
　自分も何か作りながら学べばいけるんじゃね、と考えて、どうせなら動きのあるwordleっぽいゲームを作ろうということで話が進みました。

## 一度全部AIに任せてみよう、となる
　検索とGeminiとの対話を繰り返しながら、ページの制作を進めていき、何となくwordleと呼べるものが出来上がりました。
ですが、特にゲームのロジックの部分はほとんどを AIに頼ったいたため、完成しても今一満足感がありませんでした。
　そこで、タイミングよくGemini CLIの存在を知り、ターミナルから生成AIを使ってどこまでこのサイトを成長させることができるか、いわゆるバイブコーディングを試してみたくなりました。

## 意外にAIに任せっきりじゃうまくいかない、と気づく
　最初はゲームロジックの部分を大雑把な指示でもガンガン実装を進めてくれたので、Geminiすげーと思ってました。
　しかし、ファイルの行数が多かったり、web上に公開されている記事が少ないライブラリを使ったりすると、エラーのループに陥るなど指摘されている通りの弱点も感じました。
　何より、自分の知識が不足していることを感じました。APIに制限以上のリクエストを送っていることに気づかずにエラーに苦しんだり、和訳した単語リストをJSON形式で保存することを思い付かずに苦しんだりと、気付けばすぐに修正できるエラーに時間をかけることがありました。
　何が分からないかも分からないと、AIに適切な質問をすることもできないと感じ、任せっきりではうまくいかないんだなと感じました。

## まとめ
AIを使うと自分の能力を越えた実装ができるようになります。
　一方で、基礎的な知識の土台と、「やったことがないけどある程度理解できる」ぐらいの知識の地図ができていないとAIに振り回されてかえって開発の効率が落ちてしまうと感じました。
　AIが曖昧に繋げてくれた知識をそのままにせず、調べたりAIにに聞くことで、地図を広げていき、NUTMEGでの活動に活かそうと思います。