フロントエンドのWeb開発が完全に変わってしまったかもしれない

だれでもエンジニア / 山浦清透
4 フォロワー
2 回視聴·2024/10/10
shadcn/ui、v0でWebフロントエンド開発が完全に変わってしまったかもしれません。
\学費完全無料!/
【働きながら学べる】エンジニア実習アプレンティス。内定直結のエンジニア実習。給与をもらいながらスキルを身につけられます。
https://apprentice.jp/lp
■独学で自走できるエンジニアになるためのプログラミング学習サービス
https://dokugaku-engineer.com/
■UdemyでAWSやGitの入門講座を販売中
https://linktr.ee/yamaura
■プロフィール
山浦 清透(やまうらきよと)
Web系エンジニア
1987年生まれ、福岡県出身。京都大学大学院卒。
2014年に未経験からエンジニアに転向し、既存サービスの運営、新規事業の立ち上げ等を経験。プログラミングの修得に四苦八苦してきた経験から、開発現場で使えるエンジニアリング知識を発信。Udemy受講者数14万人。
今日なんですけども
Web のフロントエンド開発が
完全に変わってしまったかもしれないっていうね
ちょっと驚きのことがありました
フロントエンド開発って言ったら
UI を作るのがメインの仕事で
UI 構築が非常に大変なわけなんですよね
今までいろんな開発者が
生産性を上げるために
例えばブートストラップとかで
いろんなツールを作って
生産性を高めてきたんですね
ですがですね
少々前にシャットCNUIで
大規模なアップデートがあって
これがねちょっとねやばいんですよ
今までいろんなブートストラップとかツールで
生産性が上がりましたみたいな
非じゃない変化が起きてます
もう本当に
このシャットCNUI
これ皆さんご存知ですかね
これ何かっていうと
UIライブラリーになります
いろんなUI
デザインのパーツですね
がのライブラリー集なんですね
特徴としては
このUIのパーツ
コンポーネントって言うんですけど
コンポーネントのコードごとを
自分のプロジェクトに
パッとコマンド一発で取り込めますよ
っていうのが大きな特徴になってます
それ何が嬉しいのみたいな話なんですけど
コードごと取り込めると
すごいカスタマイズ性が高くて
いろんなパーツとかを取り組んだときに
デザインに一貫性に
見た目に一貫性を持たすことができるんですよね
しかもコマンド一発で
依存関係とかも含めて
パッとインストールできて
しかもいろんなフレームワークに対応していて
どんなプロジェクトでも
パッとインストールができるっていうのが
取り込めるっていうのは
すごい良いところなんですね
ここまでだと
まあまあなんか便利だねみたいな
そんぐらいの話なんですけど
本当に驚くのがすごいのは
VZEROっていう
生成AI系のツールがあるんですね
これはデザイン系の生成AI系のツールで
いわゆるプロンプト
自然言語でこういうのをデザインして
こういうサイトをデザインしてとか
こういうパーツをデザインして
みたいことを言うと
バーっとパーツとかデザインが
出来上がってくるっていうものなんですね
これの裏側に使われているのが
ShutCNUIなんです
実装は出てくるコードが
ShutCNUIで実装されてるんですね
つまりこれ何が起こるかっていうと
こんなデザインが欲しいみたいな感じのことを
自然言語で言うと
そのデザインがすぐにデザインされて
ちなみにこのデザインするとき
すごい便利なのが
キャプチャーを使えるんですね
このサイトと同じ見た目にしてほしい
みたいな感じだったら
キャプチャーを取って
それを添付して依頼したら
その通りにそのサイトが出てきますと
そしてそれのコードが
全部ShutCNUIで出来てるんで
コマンド一発で依存関係も含めて
全てのコードが自分のプロジェクトに
一発で一瞬で取り込めれるんですよ
これは驚くほど生産性が高い
一瞬でコードがUFIが構築できちゃうんです
しかもそのShutCNUIで出てきたコードを
例えばChatGPTでよくやってるのは
コードを分割して整理整頓して
みたいな感じで依頼すると
綺麗にコードを整理整頓してくれて
あとはその整理されたコードを
コパイドとかカーソルとかを使いながら
実際に自分のプロジェクトに取り込む
UIがものすごいスピードで
本当にこれが出来てきます
多分僕が自力で
僕の裸なんですけど
何も使わずに実装するよりも
10倍とか10倍じゃ本当に効かないくらい
早く出来ます
すんごいインパクトです
フロントエンド開発が完全に変わってしまうような
インパクトだと思ってます
今まで開発者は
例えばどのフレームワークを使うのがいいか
リアクトがいいかとか
ビューオーがいいかとか
そういったところを主に議論してきたというか
結構注目がかかってきたと思うんですけど
そこも大事なんですけど
それはどっちのフレームワークがいいかみたいな
そこに出る差なんかよりも
はるかに大きな差が
今ここで生まれた
もうUIをどれだけ早く作れるかみたいなのが
きっとこれからより重要な論点になってくるはずです
というわけでここでちょっとお知らせです
弊社が運営する株式会社ユーグルでは
アプレンティスというサイトを運営しております
内定直結型のエンジニア実習サービスになっております
学費完全無料で給料をもらいながら
スキルを見つけることができるような
そんなサービスになっております
ぜひエンジニアモンを叩いていただきながら
またシャットCNUIそしてVZERO
使ってみてもらってね
このインパクトをぜひ味わってほしいです
それではまた
