Vercelの作ったAI、v0がやばい

画像引用元
https://twitter.com/v0

v0ってなに

v0というのは、Vercel社が作ったAIのことです。ChatGPTみたいなもんです。

Vercel社は主にウェブサイトのホスティングを行っているアメリカのSan Francisco, California洲ある、従業員数201-500名の会社です。

このサイトもVercelでホスティングされています。

そんなVercel社がつくったv0というAIはどのようなものなのでしょうか。

概要

v0のTwitterでは、このように紹介されています。

Your web development agent. Created by @vercel

日本語訳すると、「あなたのウェブ開発エージェント」です。

実際に、ウェブサイトのフレームワークの一つであるReactを得意にしているとv0のAIは供述しています。

ここで、v0のサイトを見てみましょう

ここで疑問に思った人もいるはずです。
この画面、英語しか見たありません。
とても日本語対応しているようにはみえないですよね。

実は、対応しているんです。

対応しているのは、2024年、10月2日からです。

本日から早期プレビュー版としてv0を日本語でご利用できるようになりました。今後も順次、各機能を日本語化する予定です。ぜひお試しください。

You can now change v0's default language to Japanese. Today, you'll see an early preview of this feature as we continue to ship additional… pic.twitter.com/7HyFSkm37d

— v0 (@v0) October 2, 2024

今この記事を書いてて思ったのですが、この画面、日本語化できました。（動画にもありますが）

左下のプロフィールアイコンから、Languageを「日本語版（プレビュー）」にすればできるみたいです。

「今日は何を 作り ましょうか」ではなく、 「創る」 なの、いいですよね。

ちなみに、英語モードでも、日本語のプロンプトを受け付けるようです。

他のAIとの違い

まず、間違えてはいけないのは、v0はそもそもほかのAIとはコンセプトが違います。

先ほど説明を見ていただいた通り、v0はウェブサイトの作成向けに作られているAIです。

なので、そもそも言語の理解などをメインとしているOpenAI社のChatGPTやGoogle社のGeminiとは比較をするのはあまり望ましくないです。

なので、言語の理解をメインとしているAIと、プログラムなどの理解をメインとしているAIとでは、完全に別物として比較したほうが良いといえます。

ChatGPTでは、コード生成に対応しています。
しかし、バグが多く、おおよそのコードは「ここが間違ってる」と言って人間が指摘してあげる必要があります。
一方v0はコードにミスがあったことは今まで一度もありません。（簡単なウェブページしか作成していないのもありますが）

先程述べた通り、Reactを得意としています。（現在は変わっているかもしれませんが） 公式のTwitterから見ると、Node.jsもサポートしているのだとか。

つまり、他のAIよりも、プログラムの生成や理解に特化したAIであるといえます。

何がいいのかとv0の機能について

私か記事をかいてまでお勧めするのは大きな理由があります。

v0には、画面が分割できるようになっています。
なので、右側でプログラムを評価しながら、左側でプロンプトを打ち込むことができます。

さらになんと、プレビュー機能がありますd。

画像がないのは、画像をローカルに保存しているためです。
ちゃんとURLで指定してあげれば、ちゃんと表示してくれます。

これが死ぬほど便利で。
ChatGPTにも搭載してほしいところですが、前項でも述べた通り、そもそも言語理解や生成に特化したAIですから、このような機能はChatGPTには必要ないと考えます。（あればうれしいですが）

ウェブサイトを作ってみた

百聞は一見に如かずです。やってみたら良さがわかります。

試しに、ポートフォリオをTypeScriptとReactで作ってみましょう。
製作過程は今回は関係ないので飛ばしますが、何度もこうしたいと要求を送信してみました。

一度エラーが起こったのですが、エラーログを送信したところ、正しく訂正してくれて、1度のエラーですみました。

以下が生成してみたコードです

実際に製作したウェブサイトは、ここに公開しています。 作品のボタンはいつか押せるようにしておきます。

話はそれますが、このウェブサイトを公開しようと思った経緯を話します。

このブログには実は旧URLが存在しました。それが、sora81.devです。
いまはblog.sora81.devですよね。
なぜこうしたかというと、完全に分けたかったからです。

この話は長くなりそうなので、いつかまた別記事にまとめます。

こうすると、sora81.devが開いてきます。 いままでは、blog.sora81.devに転送していたのです。

それと同時に、プロフィールのサイトほしいな、製作した作品並べたポートフォリオサイトつくりたいなってなったのがこのサイトの作成の経緯です。
そのタイミングでv0がリリースされたというのをTwitterのタイムラインで聞き、これは作るしかないと思い、作りました。

割とすぐ作ることのできたイメージです。
ある程度の理解があれば、作れるのではないでしょうか。

本当のことを言うと私はTypeScriptとReactは得意ではないです。
1時間半ほど勉強した程度なのですが、その程度でこのようなウェブサイトを作成することができました。

まとめ

いかがだったでしょうか。

まわりから見るとv0の宣伝か案件のように見えますが、まったく宣伝ではありません。
本当にお勧めしたかったので書きました。

皆さんも、v0を活用して、ウェブサイトを作成してみてはどうですか？