Bringing React Components to AI

แชร์
ฝัง
  • เผยแพร่เมื่อ 14 มิ.ย. 2024
  • Learn how the Vercel AI SDK helps you move beyond plaintext and markdown chatbots to give LLMs rich, component-based interfaces.
    0:00 - Introduction
    0:41 - Stocks Demo
    1:37 - Ecommerce Demo
    2:48 - F1 Demo
    3:10 - AI SDK 3.0
    7:27 - Community Demos
    12:10 - Conclusion
    ◆ Build your own: vercel.com/templates/next.js/...
    ◆ Docs: sdk.vercel.ai/docs
    ◆ Blog: vercel.com/blog/ai-sdk-3-gene...
    ◆ Demo: chat.vercel.ai/
    ◆ v0: v0.dev
    #vercel #ai
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 75

  • @SuperKidontheblock
    @SuperKidontheblock 2 หลายเดือนก่อน +77

    Things like this your boss sees and emails you next day to build a startup idea. Lol

  • @denilsoncosta9837
    @denilsoncosta9837 2 หลายเดือนก่อน +23

    Vercel is really at the edge of web dev and AI. So exited to try it.

  • @mm93249
    @mm93249 2 หลายเดือนก่อน +9

    I hope vercel remains vercel and doesn’t get acquired by people like MSFT. What an amazing developer-focused company. I love it! 👏

  • @JollyCoding
    @JollyCoding 2 หลายเดือนก่อน +1

    Cheers for the shoutout on the F1 Dashboard! Love the generative AI stuff!

  • @Zackrevoluzion
    @Zackrevoluzion 2 หลายเดือนก่อน +1

    Vercel just delivers amazing innovations continuously. It's like as soon they come out with something amazing, they go "alright, next!"

  • @TomanswerAi
    @TomanswerAi 2 หลายเดือนก่อน +2

    Would be great to see you build something from scratch with this. I've been working on, but found quite challenging to get the behaviours I want. A sample build would help a lot.

  • @datasciencetoday7127
    @datasciencetoday7127 2 หลายเดือนก่อน +2

    i left full stack development a year ago for data science. now
    you are pulling me back with this

  • @samuelizevbizua
    @samuelizevbizua 2 หลายเดือนก่อน

    I triedd it out and this is just insane. Thank you Vervel team

  • @alexenax1109
    @alexenax1109 2 หลายเดือนก่อน +1

    This is dope! Love you vercel

  • @maskman4821
    @maskman4821 2 หลายเดือนก่อน

    This is really awesome, this ai will change how we build apps and the tutorials from now on will adopt this approach to generate ui and focus on functionality, database and the maintain of infrastructure, it is really something, Vercel rocks and rules 👍👏💪🥰😍

  • @paternyao
    @paternyao 2 หลายเดือนก่อน

    Mind blowing!!! This could be the next face of the entire internet!

  • @ZahZah571
    @ZahZah571 2 หลายเดือนก่อน

    This is awesome!

  • @henriquematias1986
    @henriquematias1986 2 หลายเดือนก่อน +2

    Any chance it will support libraries like Chakra-UI anytime soon?
    I feel the components can look a lot tidier compared to having tons of tailwind classes attached to them.
    It would be incredible!

  • @darawan_omar
    @darawan_omar 2 หลายเดือนก่อน +1

    I use auth js version 5 in when user loginned and visit a page that not access into it how we can logout the user by using the function signOut for clearing session in middleware in auth js

  • @fredericherrera
    @fredericherrera 2 หลายเดือนก่อน

    good video - who did the exercice logging chatbot?

  • @Sviatoslav-wv3qy
    @Sviatoslav-wv3qy 2 หลายเดือนก่อน +11

    So, as I understood, you still need to code the component that will be given in return by yourself. Now it just displays data in that component . No more, no less. Right?

    • @kale_bhai
      @kale_bhai 2 หลายเดือนก่อน +2

      Yes, you need to code your UI component yourself. And Prompt Enginner yourself to have your custom fn to be called.

    • @thatsalot3577
      @thatsalot3577 2 หลายเดือนก่อน +1

      @@kale_bhai oh I thought It was creating components on demand as v0 is capable of doing so, but yeah that'd be really slow.
      so it's just function calling for a RSC with the data props as whatever the LLM came up with as info ?

  • @jhoanmiguelescobararboleda8547
    @jhoanmiguelescobararboleda8547 2 หลายเดือนก่อน

    Seens I got related with vercel I love everything they do

  • @aaronmoroney2066
    @aaronmoroney2066 2 หลายเดือนก่อน +2

    Sorry, I don't underatand - does it just return an interactive UI component that you've coded based off the prompt? I ask it a question, and it returns the component suited to the request?

    • @InternetThe
      @InternetThe 2 หลายเดือนก่อน +1

      That's right! You provide it with a bunch of functions and components, and it will call the appropriate function and render a component when the conversation calls for it.

  • @ayoolafakoya9841
    @ayoolafakoya9841 2 หลายเดือนก่อน

    Thanks for simplifying AI development.
    Can you make a video showing how to make a ChatGPT clone with a feature where you can interact with the retrieved documents?
    I think it would help people understand how natural language UI patterns are built

  • @lucasfrutig4945
    @lucasfrutig4945 2 หลายเดือนก่อน

    its look amazing

  • @VinceTubesk
    @VinceTubesk 2 หลายเดือนก่อน

    Is it the V0 app or something different that you describe here in the video?

  • @mikopiko
    @mikopiko 2 หลายเดือนก่อน

    Is Vercel still pushing for the jamstack architecture?

  • @alycheikhouldsmail7576
    @alycheikhouldsmail7576 2 หลายเดือนก่อน +1

    But what about generating UI components for new project in development stage ? Building initial components is repetitive task where IA impact will important for developper and minimize cost ofbuilding reactjs based project.

  • @vamshikiranmorlawar
    @vamshikiranmorlawar 2 หลายเดือนก่อน +1

    Wow!

  • @highnitin
    @highnitin 2 หลายเดือนก่อน

    bang bang ❤‍🔥

  • @loquek
    @loquek 2 หลายเดือนก่อน +1

    Why do this server side tho with RSC? Why not do it client side?

  • @sumitbindra
    @sumitbindra 2 หลายเดือนก่อน

    Does this mean I can now show information as interactive widgets?

  • @darkcss1054
    @darkcss1054 2 หลายเดือนก่อน

    Can it help me generate D3 charts for my Next application?

  • @buddy.abc123
    @buddy.abc123 2 หลายเดือนก่อน +3

    Vercel has done it again!
    Please use Dark themes man, you're finishing our eyes 😅

  • @coolemur976
    @coolemur976 2 หลายเดือนก่อน +1

    This kind of makes web unpredictable - it would generate different components each time with random styling to interact with APIs. Or am I missing something ?

    • @InternetThe
      @InternetThe 2 หลายเดือนก่อน +2

      Not necessarily, you build the components upfront. But the LLM decides when to render them and what data to pass as props.
      So the components are not necessarily generated by AI. They can be though, if you give the LLM access to an eval() function and let it spit out JavaScript strings.

  • @andriisukhariev
    @andriisukhariev 2 หลายเดือนก่อน

    cool. feels like something very normal... almost not surprised... you know what i mean

  • @timooothy1234
    @timooothy1234 หลายเดือนก่อน

    Is it out to be used??

  • @salahabdo5520
    @salahabdo5520 2 หลายเดือนก่อน

    Interesting

  • @ihateorangecat
    @ihateorangecat 2 หลายเดือนก่อน +1

    _AI literally does something_
    Junior devs be like: Ima loose my job!!!!!!!! 😭😭😭😭😭😭😭😭😭😭😭

  • @coddude3284
    @coddude3284 2 หลายเดือนก่อน

    why it just responding only to trading things and not what you have mentioned in the video ???

  • @heracraft5526
    @heracraft5526 2 หลายเดือนก่อน +2

    The amount of tabs 3:52 💀

  • @megamaster7667
    @megamaster7667 2 หลายเดือนก่อน

    can't wait to give my credit card information to an AI!

  • @user-cu6lj5rd8c
    @user-cu6lj5rd8c 2 หลายเดือนก่อน

    I asked it to generate a map and it couldn't

  • @amogelangmoatswi1918
    @amogelangmoatswi1918 2 หลายเดือนก่อน

    Morty!, is that you?

  • @AbhiShake-pl3cf
    @AbhiShake-pl3cf 2 หลายเดือนก่อน +1

    It felt out of the world in initial days. Later it felt shitty. This again blew my mind

  • @dev-akeel
    @dev-akeel 2 หลายเดือนก่อน

    How many X tabs 🤔

  • @kale_bhai
    @kale_bhai 2 หลายเดือนก่อน

    Damn Lee! I'm ahead than you 😊

  • @user-cn3cu4go3s
    @user-cn3cu4go3s 2 หลายเดือนก่อน

    Just Open TH-cam or google, here comes a new generative AI😂😂

  • @explodestudios
    @explodestudios 2 หลายเดือนก่อน

    When I play with the demo, the first thing I get it deploy it yourself..

  • @user-gv9tt5un9f
    @user-gv9tt5un9f 2 หลายเดือนก่อน +33

    It's so amazing but vercel is killing front-end developers 🤣🤣

    • @leerob
      @leerob 2 หลายเดือนก่อน +23

      We're giving frontend developers more tools to be productive. v0 doesn't replace building UI for example, but it helps my get a decent first version I can build for. I still need to hook up all the business logic and polish things. It's an accelerant for building great products :)

    • @maskman4821
      @maskman4821 2 หลายเดือนก่อน

      Why are you so negative 🤔

    • @maskman4821
      @maskman4821 2 หลายเดือนก่อน

      ​​@@leerobVercel is awesome, I like this AI, making building decent UI way much easier ❤

    • @CheCortezTV
      @CheCortezTV 2 หลายเดือนก่อน +2

      Front end dev is the horse staring at the car.

  • @nithin3476
    @nithin3476 2 หลายเดือนก่อน

    lol, its easily can be done in warpcaster

  • @NukelimerCodes
    @NukelimerCodes 2 หลายเดือนก่อน +5

    I'm quitting learning Frontend engineering.

    • @maskman4821
      @maskman4821 2 หลายเดือนก่อน

      I have no idea whats in your mind but I am very excited about Vercel AI, it gives me the capability of building sleek UI easily, this is really awesome ❤

  • @samsuriahmad2128
    @samsuriahmad2128 2 หลายเดือนก่อน

    😂😂😂😅

  • @neosoulink4398
    @neosoulink4398 2 หลายเดือนก่อน +2

    Damn, some devs will definitely lose their jobs

  • @maxbarbul
    @maxbarbul 2 หลายเดือนก่อน

    Does it mean Web development is so complicated that thinking about components they implement ai to solve the problem 😂

  • @unamgege
    @unamgege 2 หลายเดือนก่อน

    wth

  • @janithchamikara3062
    @janithchamikara3062 2 หลายเดือนก่อน

    Nooooooooo

  • @vamshikiranmorlawar
    @vamshikiranmorlawar 2 หลายเดือนก่อน +2

    There goes a Frontend Developer
    :jk

  • @ahmadkhaled980
    @ahmadkhaled980 2 หลายเดือนก่อน +1

    This is quite LITERALLY replacing a front-end engineer. What the demos shows is UI being generated almost instantaneously, for free. By the end of this year, no one should learn front-end.

    • @maskman4821
      @maskman4821 2 หลายเดือนก่อน

      Why are you this negative? I feel very excited because from now on I am able to deliver decent UI even though I am not a UI/UX designer, this is sweet ❤

    • @nomanahmed3995
      @nomanahmed3995 2 หลายเดือนก่อน

      No. This is basically building different type of user interfaces. Instead of coding the UI to use navigation button, we basically code the UI to interact with the AI.
      We make premade components (duty of frontend engineer) and link it with AI, code it so that the AI detects the persons need from the message they send to the AI ("Please show me the weather in Dubai"), it will detect and tell your code that weather function is called, your code handles the logic based on the parameters AI sent you (detects country=dubai), then your code will send back the data to AI and then AI will decide to stream the premade component you programmed with the params it detected from user's message.
      Thats all, so AI just decides when to render component, it doesn't actually generate the UI automatically, thats what you have to do aka the front-end engineer. (This answer is just the jist of it so it might not have perfect details but overall the flow is correct)

  • @user-cn3cu4go3s
    @user-cn3cu4go3s 2 หลายเดือนก่อน

    Yes it is useful but dangerous.

    • @maskman4821
      @maskman4821 2 หลายเดือนก่อน

      What in the world are you talking about? 😅😮😢

    • @user-cn3cu4go3s
      @user-cn3cu4go3s 2 หลายเดือนก่อน

      @@maskman4821 If they keep on making and improving these AI stuff what in the world will happen with us

    • @user-cn3cu4go3s
      @user-cn3cu4go3s 2 หลายเดือนก่อน

      But I really appreciate the harkwork of these people 🙂

    • @Innesb
      @Innesb 2 หลายเดือนก่อน

      @@user-cn3cu4go3sThe same thing that happened when tractors were introduced into farming, and all the farm workers thought they would lose their jobs… there was an agricultural productivity boom and more farm workers were needed. The same thing that happened when desktop computers were introduced and all the admin staff thought they would lose their jobs… there was a productivity boom and more staff were needed to build, implement, train, use and repair the computers. There’s an expression that I’ve heard a few times over the past months, “You won’t be replaced by AI; you’ll be replaced by someone who knows how to use AI”!

  • @aleksd286
    @aleksd286 2 หลายเดือนก่อน +1

    What about no? Stop making everything AI

  • @gofudgeyourselves9024
    @gofudgeyourselves9024 2 หลายเดือนก่อน +6

    Please don't take away my job. I m scared

    • @maskman4821
      @maskman4821 2 หลายเดือนก่อน

      Why are you scared? You should be excited about this AI, making building decent UI way much easier is awesome ❤