ขนาดวิดีโอ: 1280 X 720853 X 480640 X 360
แสดงแผงควบคุมโปรแกรมเล่น
เล่นอัตโนมัติ
เล่นใหม่
●目次0:00 神AIエディタ「Cursor」を使った最新フロントエンド開発手法がすごすぎる1:47 今日使うツールを紹介2:13 Tldraw2:36 Make Real2:49 Cursor4:06 UI Sketcher4:25 GitHub Copilot5:06 実演1：Tldraw/Make Real8:36 実演2：Cursor+UI Sketcher15:18 エラーの改善案を教えてくれる17:45 お金はかかるの？19:56 エンディングブログ・アフィリエイトを体系的に学べる無料メール講座もやってます。TH-camでは話していない内容もあるので、ぜひ登録してください🙆♀meril.co.jp/affi-note/online_mail_course?blog_nm=youtube_comment_20231124
情報ありがとうございます。でも、著作権問題を考えると現時点多分Copliot Plus一択ですね。
最近「まだ○○使ってるの？」系の煽りコピーが鼻について仕方がない。。。
ただの新しい物好きのゴミエンジアだよな
伸びるから仕方ないね…鼻について離脱する人より、煽られて見にくる人の方が多いんだよきっと。
「○○がヤバ過ぎた」似たような文言が多過ぎて本当にヤバイのが埋もれる。
凄いです😳
CursorはVSCodeのフォークに過ぎないし、それを参考にVSCodeがより良い形でAIインテグレーションを進めるんじゃないかな。あと、今のところCursorよりCopilotのほうが的確なコードを出す感じがする。自分の分野だけかもしれませんが。
これはホンマにすごい！
すごい！！
凄いですね、でも、プログラミングをある程度習得した方が使うべきツールなのかなと思いました。
VSCodeからのフォークに過ぎないCursorでどうやったらVSCodeが終わるのか...Cursorが巨大で強靭なExtensionのエコシステムやGithubのエコシステムそのものを提供しているのですか？CursorはVSCodeをフォークし、OpenAIと繋げているだけです。VSCodeが終了したら即日Cursorも終了ですが、Cursorが終了してもVSCodeには影響はありません。
ちょっと大袈裟に表現しただけでガチで言ってるわけではないと思うよ笑そんな本気にならないで
@@sushiya_jp こういうアスペは時代から取り残されていくんだから放っておこう
@@sushiya_jp OSSプロジェクトをforkする自由は誰にでもありますが、fork先にリスペクトを欠くとその人は尊重を得られません。ユーザやTH-camrであってもそれは同じ。
勉強になりました！
フロントエンドエンジニアです。lp制作などには有効かもしれませんが、webアプリ開発とかに使うにはまだまだですね、、
ほんとこれ
モック制作だけに使えますね
めちゃくちゃ便利！
意地でも漫画例えをする強い意志を感じる
🎯 Key points for quick navigation:00:00 *🔥 AIコードエディターの進化がフロントエンド開発に影響*01:38 *💻 主要ツールの紹介と役割特徴*04:08 *🛠️ TLドロー、メイクリアル、カーソル、UIスケッチャーの実演*09:12 *🖌️ UIスケッチャーの使い方とデザインカスタマイズ*12:56 *✏️ カーソルのAIチャットでコーディング支援*17:16 *💲 カーソルとUIスケッチャーの料金プランと注意事項*Made with HARPA AI
Hi this is Steve from tldraw, awesome video. Ask me anything!
昔メモ帳で手書きのhtml作っていましたが、原始時代をみるようですね
凄い人だ。VSコードでも苦戦するのに
サクラエディタとかつかってたなぁ
コードの事は全くわからないですが、凄いのは伝わります
何か少しAIから離れてたらすげー進んでるー。でもまだ、プロンプトでファイルごと自動生成してリンク繋げてくれる神IDEないのかな🐑
否定的な意見多いけど用途考えるのが人の役割なんではこれからもっと発展するだろうし楽しみ
バックエンドとのやりとりはできるのでしょうかね？ ちょっと難しそうな気もしますが、htmlやcssを書く手間は省けそうです
あとはreactでかけるとかな
何故こう言うIT用語は日本語発音になるとローマ字読みになるんだろう。Cursorは英語読みだとカーサーの方が近い。
ベジータ「まるで革命のバーゲンセールだな」
「革命は加速する！」
これは楽だな−、ちょっと画面作りたいけど、デザイナいなくてCSS書くのがタルいエンジニアには恩恵が。一方でフロントのフレームワークでも仕事してくれるのかな？そうじゃなかったら、ホームページかそれに小さいプログラム仕込んだレベルの仕事が楽になる話かな、とも思わんでもない。
画面後ろのライオンさんとスターさんとクマさんも動き出したら買いますか？？？1台10万で、サポート料5万でどう思います？？？
Make real良いですね。常々、PSDとか作成されたデザインカンプからHTML,CSSとコーディングしてるの生産性が低いなと思っていました。PSDが既にあるんで直接HTML,CSSにならないかなとあるいはExcelとか描かれたポンチ絵から同じようにHTML, CSSとかにするのもめんどいなと思ってました。ラフ図からまずはHTMLとCSSが出来るだけでもかなり重宝しますね。打ち合わせしながらざざっと構成してから、HTMLにして、これをベースにコーディングを進めると効率が爆上がりですね。
twitterで評判っぽかったけどスルーしていました。 すごいです。 float:left だ rightだのころからコーディングしていたのでなおさらです。bootstrapもちょいちょいバージョンかわるし結局スクラッチかよってなってリニュの予定のLPがあったのですが。面倒ですすんでいませんでした。この動画みてこれじゃんってなりました大優勝！ 紹介ありがとうございます！
君はコーダー？
すごいけど、表面上の部分しかコーディングしてくれないなら大して役に立たないかもしれない。できればDBの処理などのロジック的な部分を処理してほしい。
ロジック部分を処理できたらロジック考える楽しさが無くなっちまう
Visual Studio Codeは、AIを活用することが主目的ではありませんよ。Microsoftは独自技術路線と言うイメージが強いので、Microsoftは標準化団体に協力したり、ライバル会社に技術協力をするようになった。その流れでライバル視してきた企業達も含めて協力し合えるようにした開発環境がVisual Studio Codeです。
技術新しくなって開発者は良かれと思って不要な部分は隠すようにする分なぜかユーザーはもっと基礎を勉強しないといけないという無限ループ
今はまだVSCodeの方がいいです。
現状まだバグが多いのですが、相当良いですね。
iOSのアプリ開発でもっと使いやすくなればな～
まぁ凄いんやけど多分、開発のどの工程を短縮するのが賢いのかを手探りしていく時期なのかとは思いますね。正直、ラフからプレーンなhtml, cssを起こすってあまり重要性は感じないかなと思います。どの道後でreactとかに書き換える事になるとなるとこの工程はあまり重要ではないと思います。逆にこれをほぼそのまま納品物に流用するってのでいいならもう、仕事として成り立たない気もしますね。
ほんとこれhtml,cssが作られたところでなwwwまあコーダーは消え失せるだろうけどね
モック作成の工数が激減しますね
革命的なすげーもん出ても、それ使う人間はベトナム人とかパキスタン人とか日本人の 1/3 の給料でやってくれるやつアサインするからいまさら日本人が覚える必要もない希ガス(´・ω・`)
指定されたデザインカンプをまるまるコードに起こしてくれるAIはまだ開発されてないですよね。とはいっても、webに関する案件自体がこれからはすべて一人でこなすような仕事が増えてくるでしょう。それでも、これからどんな案件に集中してスキルを磨いていけばいいか、それが分からないというのが今の正直なところです。
画像からhtmlにしてくれるChat GPTのプラグインもありますし、Screenshot to Codeというサービスもありますよ！
@@hayatastic0224 さまその手のchat gptのプラグインというものは見つけられなかったのですけど、Screenshot to Codeで生成したコードをベースに作成を進めるのは良いかなと思いました。問題は生成されたスタイルがtailwindだけなのかなということと、生成されたコードを見本となるデザインに近づけたときに、返って手数が多くなってしまうのではないかということです。まぁ、物は試しですよね、やっぱり😅
@@hayatastic0224ただのこーだーやん
正直言ってプログラムができるというのはもはやスキルじゃない、そんな気がします。しかも他人の仕事をやる限りはどんどんジリ貧になるしかないですね。自分でこの世の中の課題を見出して、その解決をシステムに落とし込んでビジネス組成する。それが楽になるってことでしかないので、外に出してAIが楽にしてくれた部分をやる人のしごとの価値って０に向かって低くなるしかないですよね。そこを考えないで、漫然と他人の仕事を受ける人には明るい未来は無いと思いますね。本当に凄い時代です、恐怖と同時にチャンスですね。
「Make Real」ボタンを押した後、操作が途中で止まってしまった場合、どのように対処すれば良いのか悩んでいます。
Github Copilot では、学習元となるデータセットの作成に、元のコードのライセンスを無視してAIを学習させていることが問題になりましたが、この Cursor ではどうなんでしょうか。Cursor のフォーラムなど当たってみましたがわかりませんでした。どなたかご存知ないですか？
こういったプロの驚き屋のせいでまともな情報が埋もれてCopilotなんかが普及しない。
VSCodeもコパイロット実装してくるし。AIは当たり前の機能になるんだろうね。逆にAI搭載できない中小のツールは淘汰されちゃう。
未経験とシニアエンジニアで実装力に差が出ないので、もっと高度な要求をエンジニアに求められてしまう未来が来るんですかね汗
専門は複数持っていた方が良さそうですね
技術はすごいんだろうね。。。この程度のクオリティのゴミサイトで納品できる案件って、かなりレア。結局は、WEB制作を主軸にしていない奴の戯言なんだよな。。
使用する以前の話になりますが、cursorエディタの立ち上がりが毎回とんでもなく遅くて、結局vscode使ってます💦なんでだろう
lpとか作るのには便利かもね
もう5億人くらい解説してる人見ましたがなかじさんも紹介するんですね
いや思わず叫んだわ…
おっと、のび太の悪口はそこまでだ。
どうせならEmacsに組み込んで欲しいなあ
ホンマにvscode終了か？
reactで生成できるようになったら動画つくってもらっていい？
コードが汚い。これだと遅延が多いのでは？？
少ない知識から頑張っているのは良いですが、何もかもがあまりにもひどい…
こういう若いTH-camrさんが言葉の意味を勝手にドンドン変えちゃうのはどうなのよ？ とは思いますがw
質問系掲示板の需要が減りそう
浅い…
サラッとネタバレ…
んーまだ使い物にならんな
Webサイト制作ならWixでよくない？コーディング以前にフロントエンジニアが不要。
ナルトのラストをさらっとネタバレされてしまいました。。まだ見てなかったのでとても悲しい😭
好きならいまだ見てないほうが悪い！😂
漫画の例えもコメント欄荒れるのでやめましょう
●目次
0:00 神AIエディタ「Cursor」を使った最新フロントエンド開発手法がすごすぎる
1:47 今日使うツールを紹介
2:13 Tldraw
2:36 Make Real
2:49 Cursor
4:06 UI Sketcher
4:25 GitHub Copilot
5:06 実演1：Tldraw/Make Real
8:36 実演2：Cursor+UI Sketcher
15:18 エラーの改善案を教えてくれる
17:45 お金はかかるの？
19:56 エンディング
ブログ・アフィリエイトを体系的に学べる無料メール講座もやってます。TH-camでは話していない内容もあるので、ぜひ登録してください🙆♀
meril.co.jp/affi-note/online_mail_course?blog_nm=youtube_comment_20231124
情報ありがとうございます。でも、著作権問題を考えると現時点多分Copliot Plus一択ですね。
最近「まだ○○使ってるの？」系の煽りコピーが鼻について仕方がない。。。
ただの新しい物好きのゴミエンジアだよな
伸びるから仕方ないね…
鼻について離脱する人より、煽られて見にくる人の方が多いんだよきっと。
「○○がヤバ過ぎた」似たような文言が多過ぎて本当にヤバイのが埋もれる。
凄いです😳
CursorはVSCodeのフォークに過ぎないし、それを参考にVSCodeがより良い形でAIインテグレーションを進めるんじゃないかな。あと、今のところCursorよりCopilotのほうが的確なコードを出す感じがする。自分の分野だけかもしれませんが。
これはホンマにすごい！
すごい！！
凄いですね、でも、プログラミングをある程度習得した方が使うべきツールなのかなと思いました。
VSCodeからのフォークに過ぎないCursorでどうやったらVSCodeが終わるのか...
Cursorが巨大で強靭なExtensionのエコシステムやGithubのエコシステムそのものを提供しているのですか？
CursorはVSCodeをフォークし、OpenAIと繋げているだけです。
VSCodeが終了したら即日Cursorも終了ですが、Cursorが終了してもVSCodeには影響はありません。
ちょっと大袈裟に表現しただけでガチで言ってるわけではないと思うよ笑そんな本気にならないで
@@sushiya_jp こういうアスペは時代から取り残されていくんだから放っておこう
@@sushiya_jp OSSプロジェクトをforkする自由は誰にでもありますが、fork先にリスペクトを欠くとその人は尊重を得られません。ユーザやTH-camrであってもそれは同じ。
勉強になりました！
フロントエンドエンジニアです。
lp制作などには有効かもしれませんが、webアプリ開発とかに使うにはまだまだですね、、
ほんとこれ
モック制作だけに使えますね
めちゃくちゃ便利！
意地でも漫画例えをする強い意志を感じる
🎯 Key points for quick navigation:
00:00 *🔥 AIコードエディターの進化がフロントエンド開発に影響*
01:38 *💻 主要ツールの紹介と役割特徴*
04:08 *🛠️ TLドロー、メイクリアル、カーソル、UIスケッチャーの実演*
09:12 *🖌️ UIスケッチャーの使い方とデザインカスタマイズ*
12:56 *✏️ カーソルのAIチャットでコーディング支援*
17:16 *💲 カーソルとUIスケッチャーの料金プランと注意事項*
Made with HARPA AI
Hi this is Steve from tldraw, awesome video. Ask me anything!
昔メモ帳で手書きのhtml作っていましたが、原始時代をみるようですね
凄い人だ。VSコードでも苦戦するのに
サクラエディタとかつかってたなぁ
コードの事は全くわからないですが、凄いのは伝わります
何か少しAIから離れてたらすげー進んでるー。でもまだ、プロンプトでファイルごと自動生成してリンク繋げてくれる神IDEないのかな🐑
否定的な意見多いけど
用途考えるのが人の役割なんでは
これからもっと発展するだろうし楽しみ
バックエンドとのやりとりはできるのでしょうかね？ ちょっと難しそうな気もしますが、htmlやcssを書く手間は省けそうです
あとはreactでかけるとかな
何故こう言うIT用語は日本語発音になるとローマ字読みになるんだろう。Cursorは英語読みだとカーサーの方が近い。
ベジータ「まるで革命のバーゲンセールだな」
「革命は加速する！」
これは楽だな−、ちょっと画面作りたいけど、デザイナいなくてCSS書くのがタルいエンジニアには恩恵が。
一方でフロントのフレームワークでも仕事してくれるのかな？
そうじゃなかったら、ホームページかそれに小さいプログラム仕込んだレベルの仕事が楽になる話かな、とも思わんでもない。
画面後ろのライオンさんとスターさんとクマさんも動き出したら買いますか？？？1台10万で、サポート料5万でどう思います？？？
Make real良いですね。
常々、PSDとか作成されたデザインカンプからHTML,CSSとコーディングしてるの生産性が低いなと
思っていました。
PSDが既にあるんで直接HTML,CSSにならないかなと
あるいはExcelとか描かれたポンチ絵から同じようにHTML, CSSとかにするのもめんどいなと
思ってました。
ラフ図からまずはHTMLとCSSが出来るだけでもかなり重宝しますね。
打ち合わせしながらざざっと構成してから、HTMLにして、これをベースにコーディングを進めると効率が爆上がりですね。
twitterで評判っぽかったけどスルーしていました。 すごいです。 float:left だ rightだのころからコーディングしていたのでなおさらです。bootstrapもちょいちょいバージョンかわるし結局スクラッチかよってなってリニュの予定のLPがあったのですが。面倒ですすんでいませんでした。この動画みてこれじゃんってなりました大優勝！ 紹介ありがとうございます！
君はコーダー？
すごいけど、表面上の部分しかコーディングしてくれないなら大して役に立たないかもしれない。
できればDBの処理などのロジック的な部分を処理してほしい。
ロジック部分を処理できたらロジック考える楽しさが無くなっちまう
Visual Studio Codeは、AIを活用することが主目的ではありませんよ。
Microsoftは独自技術路線と言うイメージが強いので、Microsoftは標準化団体に協力したり、ライバル会社に技術協力をするようになった。
その流れでライバル視してきた企業達も含めて協力し合えるようにした開発環境がVisual Studio Codeです。
技術新しくなって開発者は良かれと思って不要な部分は隠すようにする分なぜかユーザーはもっと基礎を勉強しないといけないという無限ループ
今はまだVSCodeの方がいいです。
現状まだバグが多いのですが、相当良いですね。
iOSのアプリ開発でもっと使いやすくなればな～
まぁ凄いんやけど
多分、開発のどの工程を短縮するのが賢いのかを手探りしていく時期なのかとは思いますね。
正直、ラフからプレーンなhtml, cssを起こすって
あまり重要性は感じないかなと思います。
どの道後でreactとかに書き換える事になるとなると
この工程はあまり重要ではないと思います。
逆にこれをほぼそのまま納品物に流用するってのでいいなら
もう、仕事として成り立たない気もしますね。
ほんとこれ
html,cssが作られたところでなwww
まあコーダーは消え失せるだろうけどね
モック作成の工数が激減しますね
革命的なすげーもん出ても、
それ使う人間はベトナム人とかパキスタン人とか
日本人の 1/3 の給料でやってくれるやつアサインするから
いまさら日本人が覚える必要もない希ガス(´・ω・`)
指定されたデザインカンプをまるまるコードに起こしてくれるAIはまだ開発されてないですよね。
とはいっても、webに関する案件自体がこれからはすべて一人でこなすような仕事が増えてくるでしょう。
それでも、これからどんな案件に集中してスキルを磨いていけばいいか、それが分からないというのが今の正直なところです。
画像からhtmlにしてくれるChat GPTのプラグインもありますし、Screenshot to Codeというサービスもありますよ！
@@hayatastic0224 さま
その手のchat gptのプラグインというものは見つけられなかったのですけど、Screenshot to Codeで生成したコードをベースに作成を進めるのは良いかなと思いました。
問題は生成されたスタイルがtailwindだけなのかなということと、生成されたコードを見本となるデザインに近づけたときに、返って手数が多くなってしまうのではないかということです。
まぁ、物は試しですよね、やっぱり
😅
@@hayatastic0224
ただのこーだーやん
正直言ってプログラムができるというのはもはやスキルじゃない、そんな気がします。
しかも他人の仕事をやる限りはどんどんジリ貧になるしかないですね。
自分でこの世の中の課題を見出して、その解決をシステムに落とし込んでビジネス組成する。
それが楽になるってことでしかないので、外に出してAIが楽にしてくれた部分をやる人のしごとの価値って０に向かって低くなるしかないですよね。
そこを考えないで、漫然と他人の仕事を受ける人には明るい未来は無いと思いますね。
本当に凄い時代です、恐怖と同時にチャンスですね。
「Make Real」ボタンを押した後、操作が途中で止まってしまった場合、どのように対処すれば良いのか悩んでいます。
Github Copilot では、学習元となるデータセットの作成に、元のコードのライセンスを無視してAIを学習させていることが問題になりましたが、この Cursor ではどうなんでしょうか。
Cursor のフォーラムなど当たってみましたがわかりませんでした。
どなたかご存知ないですか？
こういったプロの驚き屋のせいでまともな情報が埋もれてCopilotなんかが普及しない。
VSCodeもコパイロット実装してくるし。AIは当たり前の機能になるんだろうね。逆にAI搭載できない中小のツールは淘汰されちゃう。
未経験とシニアエンジニアで実装力に差が出ないので、もっと高度な要求をエンジニアに求められてしまう未来が来るんですかね汗
専門は複数持っていた方が良さそうですね
技術はすごいんだろうね。。。
この程度のクオリティのゴミサイトで納品できる案件って、かなりレア。
結局は、WEB制作を主軸にしていない奴の戯言なんだよな。。
使用する以前の話になりますが、cursorエディタの立ち上がりが毎回とんでもなく遅くて、結局vscode使ってます💦なんでだろう
lpとか作るのには便利かもね
もう5億人くらい解説してる人見ましたがなかじさんも紹介するんですね
いや思わず叫んだわ…
おっと、のび太の悪口はそこまでだ。
どうせならEmacsに組み込んで欲しいなあ
ホンマにvscode終了か？
reactで生成できるようになったら動画つくってもらっていい？
コードが汚い。これだと遅延が多いのでは？？
少ない知識から頑張っているのは良いですが、何もかもがあまりにもひどい…
こういう若いTH-camrさんが言葉の意味を勝手にドンドン変えちゃうのはどうなのよ？ とは思いますがw
質問系掲示板の需要が減りそう
浅い…
サラッとネタバレ…
んーまだ使い物にならんな
Webサイト制作ならWixでよくない？コーディング以前にフロントエンジニアが不要。
ナルトのラストをさらっとネタバレされてしまいました。。まだ見てなかったのでとても悲しい😭
好きならいまだ見てないほうが悪い！😂
漫画の例えもコメント欄荒れるのでやめましょう