バイブコーディングの重要性
みなさん、こんにちは。フリーランスの学校に所属している海野です。毎週金曜日は、Udemy AIコースのベストセラー講師でもある海野が、あなたの仕事と生活を楽にするAI活用術をお届けしていきます。
今日は、フリーランスが一番身につけるべきAIスキルについてお話をしたいと思います。
それはですね、バイブコーディングですね。きっとね、この話を聞いてくださっているあなたも、あなたもというか、バイブコーディングってまだ触ってはいないという方も多いと思うんですよね。
この放送は、だいたい毎回1000人ぐらいの方が聞いてくださっています。ただ、おそらく1000人中何割ぐらいなんですかね、多分半分もバイブコーディングやってますっていう方はいらっしゃらないんじゃないかなというふうに想像をしています。
なので、もしも既にバイブコーディングやってるよっていう方いらっしゃれば、本当にすごいめちゃめちゃ進んでいる人だと思います。
AIを使うっていう方法ってたくさんあるんですよ。
ChatGPTで無料プランで気軽に使う、これを第一ステップだとしたら、バイブコーディングで何かツールを作るっていうのは、ステップ5とか6とか結構難易度というかハードルは高いと思うんですね。
でも、やっぱりChatGPTにさらっとチャットで聞くっていうのとはまた全然違う世界が見えてきます。
なので、ぜひ今年中に始めてもらいたいなとは思うものの、来年の始めにとか、来年やることチャレンジの一つにバイブコーディング入れてもらいたいなと思って、この年末に今日こうやってお話をしています。
じゃあ、バイブコーディング、何がいいのかというところをお話ししたいんですけども、私はバイブコーディングという言葉ができる前からバイブコーディングをしていました。
具体的に言うと、私まずプログラム書けません。本当に書けません。全く書けません。
なんですけど、ChatGPTの確かGPT4だったと思うんですよね。2023年です。2023年に私はChatGPTを使ってコーディングを始めたんですね。
これはすごいわと思って、でも当時のGPT4は本当にやっぱり今に比べたら全然性能がダメダメで、一つの今だったら一発でできるようなサイトを作るのに10日間かかったりしたんですね。
何十時間もかけてやりました。本当に大変だった。しかもコードは出してくれるんだけれども、それをどうやってウェブサイトにするのかとか全くわからない状況だったので、
それもちゃんとGPTに聞いて、メモ帳を開いて、そのコードを貼り付けて、保存をして、拡張紙を.htmlにするとか、そういうところまで教えてもらって、
それを世の中の人に見れるような状態にするにはどうすればいいんだとかっていうのを聞いてみたいな、そんな感じでやってたんですよ。
そういう苦労をめちゃめちゃして5日間くらいかけて、今だったら一瞬でできるようなものを作っていたわけなんですけども、今パイプコーディングができるとどんなことがどうなるかというとですね、
例えばこういう機能、私が2023年に作ったJAT GPTと一緒に作ったサイトというのはテキストを装飾してくれるというサイトだったんですね。
例えばこんにちはっていう風に入れたら、そのこんにちはを吹き出しの中に入れたりとか、あとちょっとびっくりマークみたいな、びっくりしてるみたいな感じの吹き出しの中に入れたりとか、
いろいろそういうことができるようなものを作ったんです。それでそのテキスト装飾ジェネレーターって言うんですけども、
そのテキスト装飾ジェネレーターを今パイプコーディングで作るとしたらどんな風にするかといったら、まず最初にやることはフォルダを作ります。
この中にフォルダを作ります。テキスト装飾ジェネレーターみたいなことが分かるような名前のフォルダを作って、それを何でもいいんですよね。
いっぱいありすぎて何でもいいんだけど、分かりやすいのはVSCode、Visual Studio Codeっていう無料のツールがあります。
これはエディターです。要するにエディターをインストールしてもらって、それで開きます。開いた後に、チャットGPTにあなたが有料で契約をしているという状態でお話をしますね。
そしたらそこで、Codex for VS Codeかな、そんな感じの拡張機能がありますので、拡張機能をインストールします。
そのVSCodeの中にあります。それでコーデックスを開くと、あなたのチャットGPTアカウントと紐付けてくださいみたいな感じで出てきますので、
そしたらそれをクリックするとログイン画面になります。チャットGPTのアカウントでログインをすると、そのVSCodeが紐付いて、VSCodeの中でコーデックスを使えるようになるんですね。
私はそうやってコーデックスを使っています。コーデックスはメインではなくて、私はクロードコードでやっているので、同じようなことをクロードコードでやるので、クロードコードの拡張機能を入れて、クロードコードのアカウントと紐付けて、VSCodeでやっているという感じですね。
そうやってコーデックスとかクロードコードを開いて、フォルダーを開きます。装飾ジェネレーターという名前のフォルダーを開きます。そしたら、こういうサイトを作りたい、みたいなことを言えばいいんです。
さっき私が言ったような、こんにちはって入れたら、ちょっと見せてあげるといいですね。こういうふうに装飾してくれると。記号とかでこうやって装飾してくれるようなジェネレーターを作りたいですと。いくつか種類も入れたい、みたいな感じで言うと、それでもう作ってくれます。それだけでいいと思うな。それだけでできるんじゃないかな。
たぶん、できましたとかって言って、その後どうやって公開するかってところまでは言ってくれないかもしれないので、その時は最初に言ってもいいんだけども、後からこれを他の人にもアクセスしてもらえるようにするにはどうすればいいの、みたいなことを聞くと、じゃあバーセルっていうのを使いましょうとかね、なんとかっていうのを使いましょうとかって言ってくれるので、それでお願いみたいな感じで。
バーセルは無料で使えます。商用利用じゃなければ無料で使えるので、商用利用じゃないんだけど、みたいな話をしたら、じゃあバーセルがいいですねとかって言ってくれるので、バーセルを使ってることが多いんじゃないかなと思います。ちなみに私のX装飾ジェネレーター、私がバーセルだったような気がするけど、ちょっと覚えてない。違ったらごめんなさい。
テキスト装飾ジェネレーターの作成
そんな感じで、それだけですよ。ほんとそれだけ。多分1時間もしないでできます。なのでぜひね、やってほしい。この装飾ジェネレーターパクっていいからやってみてください。このアイディアでやるといいんじゃないでしょうか。
基本的に私はですね、自分の生活に役に立つようなことをAIで実現するのがいいんじゃないかなというふうに思っているので、ぶっちゃけウェブサイトを作ろうみたいなのにはそんなに職種が動かないというか、私は別に今ウェブサイトを作りたくないんですよね。
なのでそんなに響かないんですけども、そういうなんか自分のXのポストを楽にするような機能とか、そういうのを作るっていうのはすごくいいんじゃないかなというふうに思っています。今ね、ちょっと作りたいChrome拡張機能が2つぐらいあって、時間が足りないような状況なんですけども、ちょっとね、今それを作っている場合じゃないんですよ。
今私ノートメンバーシップの教科書みたいなね、教科書じゃないんだけど、Uminoのノートメンバーシップの成功の方法みたいな感じの解説した教材を作っています。そっちでコーデックスとかクロードコードとかいっぱい使っていて、ちょっとそっち用にクレジットを残しておきたいので、今ちょっと車の拡張機能を作る余裕がないんですけども、ぜひ皆さんにはチャレンジしてもらいたいです。
私からの宿題としてテキスト装飾ジェネレーターを作ってみてください。どんなものかっていうのは、ちょっと私の作ったテキスト装飾ジェネレーターのリンクをここに貼っておきますので、見てみてください。面白いと思いますよ。これを2023年にプログラミング全然できない人が作ったっていうのが、結構すごいんじゃないかなと思っています。よかったら真似して作ってみてください。それではまた、Uminoでした。
