AIよりもVercelとNext.jsに感動した話

Why I Was More Impressed by Vercel and Next.js Than AI

コーディング経験ゼロのマーケターがSEOの勉強のためにサイト制作に挑戦。AIの進化に期待を寄せるも、本当に感動したのはVercelとNext.jsが提供する魔法のような開発・公開体験だった。その理由を語ります。

AIよりもVercelとNext.jsに感動した話のヒーロー画像

「自分のサイト、欲しいけど…」ノーコードの限界

はじめまして。今年できたばかりのベンチャーで働くマーケターです。これまで、WordPressやSTUDIOといった便利なノーコード/ローコードツールを使って、Webサイトを作った経験はありました。見た目も綺麗なサイトが作れるし、それはそれで素晴らしい体験でした。

しかし、僕にはずっと拭えない「もどかしさ」がありました。それは、これらのツールが非常に優れているがゆえに、サイトが動く「中身」がブラックボックス化されてしまうことです。

SEOを本気で学ぶには、サイトの構造を理解し、表示速度を改善し、タグを自由に埋め込み、時にはAPIを連携させて…といった「実験」が不可欠です。AIを使って爆速で改善サイクルを回す、なんてこともやってみたい。そのためには、どうしてもコードとCLIでサイトを直接触る必要があったのです。

「AIがコードを書いてくれる時代」という希望

そんなある日、希望の光が差し込みます。世はまさに「大AI時代」。

ChatGPTやGeminiといった生成AIが、文章や画像をあっという間に作り出していく。「もしかして、AIに頼めばサイトのコードも全部書いてくれるんじゃないか?」

淡い期待を胸に、早速AIに語りかけました。「SEOに強い、シンプルなブログサイトのコードをください」と。

すると、驚くべきことに、AIは本当にそれらしいコードを吐き出したのです。HTML、CSS、JavaScript…呪文のような文字列が画面を埋め尽くします。「すごい!本当にできた!」と興奮したのも束の間、僕はすぐに気づきました。

「で、このコードの塊をどうすれば『サイト』になるんだ…?」

そう、AIは完璧な「部品」をくれましたが、それをどう組み立てて、どこに置けば「家(サイト)」になるのか、全く教えてはくれなかったのです。結局、またしても専門知識の壁が目の前に現れ、僕は天を仰ぎました。

Next.jsとVercelとの出会い

サイト構築の方法を改めて検討する中で、僕は『Next.js』と『Vercel』というキーワードに出会いました。当初はまた専門用語の壁かと身構えましたが、調べていくうちに、それが全くの杞憂であったことを知ります。

Next.jsの衝撃:「配線済みのレゴ基盤」が最初から手に入る

まず驚いたのが「Next.js」です。これはWebサイトを作るためのフレームワーク(Framework)。感覚的には、電源や配線がすでに仕込まれた大きなレゴの基盤を渡されるようなものです。

家を建てる時、まず電柱を立てて配電盤から作りませんよね。Next.jsは、Webサイトにおけるページの表示方法(基盤)、ページ間の移動(配線)、全体の構造(土台)といった、最も重要で面倒な部分を、最初からセットで用意してくれています。

僕たちがやるべきなのは、好きなブロック(コンテンツ)を組んで、デザインや体験(クリエイティブ)に集中することだけ。配線や土台づくりに時間を取られず、いきなり作品づくりを始められる。この事実に、まず度肝を抜かれました。

Vercelの衝撃:「作った作品を即日ショーケースに並べてくれる物流センター」

そして僕の価値観を完全に破壊したのが、「Vercel」でした。これはNext.jsなどで作られたサイトを「ホスティング(Hosting)」、つまり世界に公開してくれるサービスです。

もしNext.jsが配線済みのレゴ基盤なら、Vercelは組み上げた作品をそのまま受け取り、写真を撮って、世界中のショーケースに並べてくれる自動物流センター。

作品(コード)が完成した瞬間に、Vercelのシステムがそれを梱包・搬送し、世界中のショーケース(ユーザーのブラウザ)に並べてくれます。この魔法のような体験は、信じられないほど簡単な3ステップで実現します。

  1. ドメインを取得しておく。
  2. 書いたコードをGitHub(ギットハブ)で管理する。
  3. そのGitHubアカウントをVercelに繋げて、ワンクリック。

…たったこれだけ。

かつて僕を苦しめたサーバー契約も、黒い画面での複雑なコマンド入力も一切不要。この手軽さ、このスピード感こそ、僕が知りたかった「現代のサイト作り」の答えでした。

DBも認証も「繋ぐだけ」

驚きは、サイトの公開だけでは終わりませんでした。

作ったブログの記事を管理するために、データベース(DB)が必要になります。これもまた専門知識の塊だろうと身構えていたのですが、Vercelは「Neon」という相性抜群のDBサービスと、驚くほど簡単に連携できました。

さらに、ブログの管理画面を作るために必要な「Google認証によるログイン機能」。これも、Google側の管理画面(GUI)で設定した情報をコピー&ペーストしてくるだけで、あっという間に実装できてしまったのです。

一つひとつの体験が、「え、これもこんなに簡単なの?」という驚きの連続。VercelやNext.jsを中心に、開発を楽にするための巨大な生態系(エコシステム)が形成されていることを肌で感じました。

AIの裏で起きていた「開発環境」の地殻変動

冷静になって、僕は考えました。なぜ、あれほど世間を賑わせているAIよりも、この一連の開発体験に心を奪われたのだろうか、と。

おそらく、AIの進化が「誰の目にも見える派手な進化」だとしたら、開発環境の進化は「僕のようなマーケターには全く知覚できない、静かな地殻変動」だったからです。

僕が知らないだけで、このような革命的な変化がこの20年間ずっと開発の世界では絶え間なく起きていたのでしょう。(GitHubがない時代があったなんて…)

AIが「部品」を高速に作ってくれるのだとしたら、Vercelを中心としたエコシステムは、その部品を組み立て、動かし、世に送り出すまでの「生産ライン」そのものを革命していた。

今回、その生産ラインの凄さの片鱗に、ほんの少しだけ触れることができた。それが、何より嬉しかったです。

【結論】AIだけじゃない。僕らの知らない世界も、すごいことになっている

AIの進化が、今後世界を大きく変えていくことは間違いありません。

しかし、それと同じくらい、あるいはそれ以上に、開発の世界では「作る」「届ける」ための環境が、僕たちの知らないところで劇的に進化していました。

もし、かつての僕のように「専門外だから」と一線を引いてしまっている人がいるなら、ぜひ一度、今の開発ツールに触れてみてほしい。

きっとそこには、あなたが思っているよりもずっとシンプルで、知的好奇心をくすぐる面白い世界が広がっているかもしれません!