Vercel's New AI Writes Surprisingly Good Code
Вставка
- Опубліковано 14 вер 2023
- Vercel's new V0.dev launch blows me away. I've seen SO MANY AI tools for code stuff and overall I haven't been impressed. This one though...man, I'm hyped. Can't believe they got ShadCN/ShadUI and Tailwind working perfectly too 😳
Keywords REACT TAILWIND COMPONENTS HTML MIDJOURNEY CODE GENERATION
ALL MY VIDEOS ARE POSTED EARLY ON PATREON / t3dotgg
Everything else (Twitch, Twitter, Discord & my blog): t3.gg/links
S/O Ph4se0n3 for the awesome edit 🙏 - Наука та технологія
hi, I'm the guy writing the code at v0, it's not ai. please stop asking for todo list apps, that's 60% of the requests so far
Just tried it, its awesome
the title says it is AI
@@DiogoSilva-xx8nz my friends call me Al, Weird Al
Code Converter is the best one
Instructions unclear, I now have a to-do list of to-do lists of notes that enclose a weather app. How do fix?😢
4:50 would strongly advise being polite to AI for when it gains sentience and the singularity happens.
5:00 he does say please 🙏
Every time I use chatgpt, I speak to it with this type of caution 😅
Polite is inferred from an emotional state, noone in business cares about politeness, only the feely humans do, they already stay poor and weak when working for humans. Humans already accept weak living standards and working for a boss, so for these people nothing really changes, they already die without owning as much as a home or more than 1 car and have accepted this TODAY already
im fucked up with chatGPT then lol
I have a hard enough time debugging crappy human code, now I need to worry about hundreds of lines of hallucinating AI code
That's not how this works at all
As long as you can reasonably direct the prompts to a specific purpose using information that is embedded in the model (i.e. something the model learned), you can pretty much fully mitigate "hallucinations" - which is still infinitely easier to debug than often minuscule errors. Never mind that you can always just use it as a second step to making sense of code, including its own; if you think AI code is difficult to handle or somehow even remotely worse than man-made stuff, you really haven't been paying attention for the better part of the last 12 months. Use it, learn that you were wrong about it, and put your knee-jerk reaction to it in the past.
Or don't, maybe you just really like doing it the hard way, what do I know.
@@minhuang8848 It's a useful tool for sure, but gpt absolutely does "hallucinate" code and even make up plausible sounding reasons for what it wrote, all the while being completely wrong. I've had it acknowledge specific mistakes, then retype the same code verbatim, then write a specious story about how it's now fixed. It may be helpful for mocking things up but I'd be wary of counting on gpt at this point. Little bugs you miss can build up and cost more time in the long run.
So be smart and learn how to create a tech lead AI to solve the worker AI's problem
@@minhuang8848did you even understand what OP wrote ?
He’s talking about all people pumping out AI code for us to fix
And u know why I call that job security
Use a second AI to debug hallucinated code of the first AI
I hope tools like this make it more fun to build personal websites and we all just do that instead of social media
Complexity is not in the base, a lot of non-coders already use wordpress or boilerplate code for literally decades. The complexity is and always has been the specific things. All my chatGPT prompts fail where juniors ALSO fail and come to me for irl for help, which are always the very specific things. ChatGPT also fails almost all my codewars prompts, the prompts that my basic human brain could easily handly, so it's not even close yet. Even when I give an accepted solution of a codewar problem and ask for a simple refactor or small change in the assignment it utterly fails
No this will just be another tool to build medium quality cookie cutter no personality brands/websites, just like AI is doing anywhere. AI is not creative, it's only doing what has been done in the past.
for most people, personal websites don't bring money, working on other clients projects does
@@mskzzzi don't think AI code really has much to do with the outcome of the product tbh. At least in my opinion, it accomplishes same thing frontend component libraries like shadcn do; it makes it slightly quicker to get things out there and takes care of a lot of stuff you already know how to do.
A complex code base built by someone using AI generated code (when the person in question has no technical understanding of programmimg) will inevitably fall apart.
how naive can you be
I'm really pumped about this! Thanks for showing. I really like building fullstack apps, but I feel like the most tedious portion for me is always the UI (though design systems like Tailwind have helped a bunch in that regard). Even still, I'm so stoked; even got a couple devs at my company to sign up for the waitlist with me! :)
It's going to get to the point where only AI will be able to debug and fix other AI's code.
I don't think there will be a need for code per se, you could just input stuff to an AI and it can take care of the whole shebang without showing a single line of code, deploy itself, fix itself, etc.
Nah, The average quality of the Ai creates is based on the average quality of the data it’s trained on, sure in some cases it’ll be unique but the quality stays roughly the same. The reason ai is good at generating code is because of the data it’s trained on, statistically if you feed the ai code to ai, then the average code quality won’t change. Now, Ai doesn’t know what it’s generating, it just spitting out code that’s likely to work in the past because the data it has been trained. If the Ai doesn’t even know what it’s generating, how can the ai debug code effectively 100% of the time, perhaps it can if the data that has been trained on has similar problem but outside of that it will fail and hallucinates. The harder the problem and if the ai is not familiar with the problem, it’ll fail and ultimately hallucinates. I’ve had experience this myself with css where the ai can’t debug it and most of the time, I’m the one who’s able to debug it but it’s still interesting by seeing how ai try to solve it and fail at it, I’m able to eliminate what doesn’t work so I can spend more time on finding what actually works. Here's the point, even if you have infinite ai stack upon each other, if one ai (I'm being generous here) at the most top of the stack hallucinates or fail, *everything else collapse* . Why? Because Ai is probabilistic. Certain factors will lead it too hallucinates more and give inaccurate outcome or just straight mediocre outcome. You want an ai that produce uncertain results while at the same time not able to innovate ( because the outcome quality it produce is limited to the quality data it has been trained on) and not being aware what it's generating? Imagine the time and resources you need to maintain that kind of structure and suddenly everything collapse. At some point you will need human intervention (even if we have to integrate it with our brain, it’s going to be a thing in the future, just look it up) because the ai fundamentally is just statistic.
Seems like this is really helpful if you want to capture a starting point using familiar tools & relatively safe implementation.
That looks amazing! Just joined the waitlist
I love that this video is not edited an you can see how this tool really works
Amazing video Theo!
Theo pumping out videos like crazy. I’m here for it!
Frontend developers will get replaced... With ex-frontend developers who now use AI tools 😅 But for real, hard things will remain hard to do and these tools will just help us do the small and easy things faster.
The goal is to replace devs, not help them. From a business standpoint we are a money sink.
@@Ironicationthe goal is not to replace devs? The goal is to enhance productivity and make programming more efficient. If the side effect is fewer devs, that doesn't mean the aim was to replace devs.
@@chris94kennedy The only goal is to minimize the costs and maximize the profits.
Backend devs are also gonna get replaced. Remember, an AGI is an AI that can do anything a human can do, which we’ll have in about 3-5 years. Your not anything special
if your are replaced by v0 or any other basic ai code helper, your just not a great dev overall
Thanks for the work host. Much appreciated….
if you treate it like a copilot it's super powerful. generate a skeleton and change the details yourself
seeing this along with other AI tools just scares the shit out of me, its magical ngl.
What is it using for styling aside from classes? Can it use EmotionJS for instance?
Reminds me of Photoshop AI's style of direct commands applied to specific things. This is definitely useful for quick and simple web design, but I hope it doesn't cause people to trust it too much
yep
just a toy
That's awesome !
I have signed up to the waiting list. This looks awesome! (I hate styling things)
Anyone want to throw some pricing guesses?
I'm so hyped for this, I wanted to do a side project similar to this when the chatgpt api came out, glad someone is doing a full fledged project out of it. I will be using it heavily if it is even slightly good.
What a time to learn web dev. So many excitiing innovations!!!!
We are in the generation of small teams doing enterprise stuff. Unless we loose a day fighting with AI. This window will last 3-5 years. Then the templates that fit your entity will be refined and available for most, they kinda are. Need a thread, need a cart, need a streaming site, etc …still takes knowledge of terms and the basics how things work.
Ohh you were talking about this ai in prime's chat.
What about making a SearchBar that pops a Results with Result components nested whenever someone types inside SearchBar?
great, now we only need a tool to convert those to svelte components
You misspelled HTMX.
Imagine an AI tool that creates designs in figma based on prompts, then converts them into Webflow for the outer shell and Bubble for the inner, and finally hosts them. You simply explain the app's functionality, and it determines the API, server capacity, database, and everything else. It's like Alladin's jinni is at work.
When is the public release?
"i am excited for the news" proceeds to show how we lose our jibs
He is a business owner first and developer second. Makes sense that he would be exited.
@@bruv1029 Exactly. He already bragged about how he does not need to hire more devs thanks to Vercel's services. lol
I came to check if my work is still safe, it is still safe
Here it is
How does one get access to this?
the fact that at the beginning it couldn't even make a border radius was hilarious.
and what about the api server side?
I’d love to see this for Vue and Vuetify / many other frameworks.
TailwindCSS has a 950 color preset, so a darker blue is possible e.g. bg-blue-950 :)
Will v0 support sveltekit code?
whose code has this been trained on?
That's dope
Does this mean in the upcoming years frontend developers would become obsolete?
they still exist?
If it can make a user interface then it can make a REST API or a Database. I think this means all programmers need to start thinking of AI as another tool in the toolbelt.
Yes
as a frontend developer i'm already obsolete, and was even before all this appeared.
@@buc991 In what sense are they obsolete? (genuine question, not sarcastic) BTW, I am not a frontend (I was a designer in the very old days).
It looks promising. But can it do regular CSS? Non-shad UI?
Why is that ?
@@brayanjpm why is what?
Tailwind is regular css, "absolute" is .absolute { position: absolute;}
@@SandraWantsCoke In that sense sure, yes. What I'm trying to get to is, it would be nice to be able to use this AI without tailwind. e.g. not everyone uses tailwind
Looks cool...
AI will not replace me, AI will not replace me, AI WILL NOT REPLACE ME!!! AAAAAHHH 😭😭😭
having this tool it's just useful for creating small application and 100% from scratch. So it won't help anyone with already started project (unless it's shadcn/Radix), but it's fun tho
does something like this exist for non-react things?
will this affect the frontend jobs out there?
Ofc it does, it's Verchel.
dark mode... why on earth are you giving my eyes sunburn?
3:50 i swear to god i was literally thinking "just do cit" 💀
4:48, one of the first to be deceased on the AI revolution. heh
My job is screwed but this is too cool
3:49 Do Alt+ Shift + → → → to select blocks/tags. Watch Vim users look around nervously.
This is extremely useful as a back end dev who HATES HTML/CSS. But I hate React more than writing Svelte myself so won't be using it until Svelte is well supported
Stay in back end
Of course it only generates f-ing REACT components
Tailwind nonetheless 🤢🤢
Originally thought that the project looked cool but nothing that copilot couldn’t do….. but DAAAAAAMN. 😱 I can see myself letting clients prototype the UI by themselves. They literally ask for those prompts word for word. If v0 works that well, I can pick up usable code to work with, not some pipe dream from figma. Should really speed up delivering projects.
Is is amazing. A way to create custom templates for webapps and sites
copilot on vscode helps a lot and similar too, not that fancy
I succesfully made chatGPT build about 10 MVP apps with idealized specs and 10 features, but I literally have a 0% succesrate on bigger codebases (say at least 200k+ lines) at my job that go through multiple layers of design/api's and whatnot. It also failed 100% of all my codewars problems, which often have feature requests as "poor as product owners" irl come to you with. Not to mention if it succeeded after I simplified the codewars problem, changing the scope in even the most basic ways made it fail again, something which is very common in my real life job (scope change after an initial solution was done) .
Before we walk, we crawl.
Learn to prompt better.
For real. Break down big and complex into smaller and simpler parts, and let your AI tools assist you at that level.
I am not worried about losing my job, it just sucks how ai is ruining the fun of coding, now you either have to rely on it or get left behind.
All we can do is enjoy it while it lasts and be thankful we got to experience pre-prompt-engineering :)
Rely on AI, one day will be hyper productive, the next will be a wild goose chase. I’ve notice the visual aspect in ChatGPT is horrible, it codes well or misses, but the visual aspect of things are hard for it to comprehend. It doesn’t have eyes. You will learn as you correct codes. Some days you will get exact code as needed.
“Not bad meaning bad, but bad meaning good” RunDMC
How do you teach that to AI?
"It's AI you don't have to be polite"
my paranoia : 📈
ive seen elements being left over when using chatGPT too
I hope they don't make it too expensive after the closed beta
I can't see how it's going to be useful for real projects, as the AI need to have deep familiarity with the brand and the existing design system
changing colors and adding images is monkey work compared to everything the AI has already done
@@phillipanselmo8540 Brand is not just colors
come on use your imagination a little lol. LLM + image generation + this + 100M token context window
need svelte and vue support next :p
Yes people have heard of MJ 😂. Oh man dude. But seriously anything literally any fine tuned ML model works surprisingly well. It’s just the issue with OpenAI being as the only AI model. It’s generic thus giving generic output.
Vercels doesn’t just rely on ai however. The actual product itself does most of the legwork by using very specific regex functions to recursively rewrite the next prompt.
This is really cool, I hope I get to try it soon 🤠
I feel bad for FE devs. Time to start shilling for C/Low Level Programming.
Well fuck this, imma learn c++ and get into shaders i guess. Should be fine until ai catches up to it in 2 years
I wonder how it handle margins :D
When ChatGPT became huge, I was telling people that the future of UI would be freeform text input instead of clicking buttons, tabs, sliders and boxes.
Instead of managing a dashboard by picking a date range and clicking a thing, you just type what you want and the system sets everything to that. This whole "code generation" is cool for development, but the real use case will end up being in the user end.
The writer of Star Trek told people some 50 years ago, that the future is just asking for a drink and it will materialized in front of you, calling a doctor, and a holographic doctor appears in front of you healing wounds just by pointing a phone like device to a wound. They also walk around with tablets when working, and use bluetooth like devices to communicate
The newer Star trek shows actually have "Adaptive interfacing", you just put your hands in front of the control panel and nanobots form around your hands, being calibrated as you move your hands to adjust sensitivity and directional range directly related to your muscles.
Telling how things will be is easy, and every sci-fi writer already came up with each idea before you or me were born, it's creating the idea in real life the only thing that people *really* care about
Then again, clicking a button is faster and easier than typing "generate invoice"
@@flipperiflop It doesn't have to literally be text input. The endgame would be voice commands i guess.
@@flipperiflop and thinking it is faster than that saying it or typing it. Makes me think of the "pupil dilation click" they are building into Apple Vision
Senior devs ain't going anywhere but junior devs are in danger
Senior are also getting replaced soon lol. People don’t realize how fast AI is improving. Do you guys not realize that once big tech companies like Google and Microsoft replace most of their developers with AI, they can become many times more worth than they are now??? Senior devs are not that much better than an average junior dev. Compared to an AI in the near future though, the AI is hundreds of times better. Senior devs are also in the same danger
Somehow my room also gets darker when I play with AI.
it shouldve been a fish icon everyone knows bees are fish
This is God tier sheet
When ChatGPT came out I could only think of the endless integration possibilities. And that's happening now,
First FlutterFlow and now this damn, the future is here.
Nice. I dont need my frontend friends anymore 🤣
This Shayt is scary; it kicked my but out of my scepticism.
this is a really cool project, I also feel validated as I did a hackathon not too long ago where my team worked on the project that had the exact same idea but ofcourse our execution was nowhere near this good😂
Alot of people seem happy about beight kosing their jobs and being homeless.Good for Business owners and bad for their employees. Well that is the game.
Taste and design skills become SO much more important now
Yes the irony where every creative MBA is laughed at, will now be revered for "human design" , because humans often care not most about quality, but about authenticity, which AI by it's very nature cannot do. It's why you still prefer pizza in Italy instead of your non-italian local Italian restaurant, even though they look sound and smell Italian, just like chatGPT, very close. It can do the 99% but we care for the last 1% more often than the base 99%
@@xdarrenx sorry, what does MBA mean?
@@xdarrenx Great point actually
@@xdarrenx nah corporations will be using the "cutting edge authenticity models" hahaha
@@nuvotion-live But u have things in Italy like "DOP" or greek "feta" or french "champagne" . Tech changes, but people often don't. There will be a lot of people also lobbying for certification of proofs, that thigns are authentic, with many lawyers with their own AI army countering it.
"it's not some package I'm depending on", yeah, uhm, tailwind, ugh 😔
After six months of AI assist I know it’s not taking my job. It’s job is more at risk. This is painful to watch
What is at risk?
Explain
Hehe good luck with maintaining such code on commercial level
4:48 you don't need to be polite to AI
5:02 ...please remove...
😂
In my experience, code generated by AI is usually “over-engineered” and actively “fights” attempts to simplify.
In other words, it can get really complex (and hard to troubleshoot) real fast, once you go beyond the trivial examples.
yeah but thats why you run it through a ai that simplifys it duh
@@emeraldbonsai it is much faster to write the code yourself
@@Guccifer808 Yeah, I've noticed that Copilot mostly gets in the way, for me at least. It's still useful but in most cases ChatGPT just helps me with idea generation and not the actual code.
Agreed. That’s why it should be modular. Each box(div) or tag, can be removed or manipulated. Appending the body or deleting from the body is the way to go. Systems can handle the css inline. It’s 2023. Especially for most simple projects (which most are working on). I agree you’re hired. Guess you must learn React to fix errors or styles. I’d even go as far as including the JS in the divs , though that might get messy depending on the length. I need a team, new bees to write simple css styles for modules. Then a community shares modules. What’s left a heading that tilts? A image in a div with a paragraph and two descriptors? Look at all css frameworks (most) there’s not much there . Why because it’s simple headings, navigation , footers , buttons and forms. Divs or tags with children and there styles is all it is and has been. This hasn’t change even novelty css is not used due to screen real estate, eventually returning to the same look for most sites. Default. So best we can do is modulate. Join my army… new beees welcome. I just need divs from designers though most styles are done, a circle image left , title below, paragraph, small icons to the left, now trap it in a div , include inline css. Now the DOM can add or remove the option. JOIN MY ARMY.
Front end developers are going to end up being replaced. We are too focused on React, too arrogant in our thought and too nerdy to see what these corporations are leading us to like sheep.
Plus one,
I don't know what is the hype for? All white collars will be replaced in 5-10 years
@@palyanytsia Nah. Most other professions will protect themselves with regulations and laws. Only IT will be affected in the end.
I talk to chat gpt like a REAL person folks it's purpose is to talk my a like person you get a completely diff experience. It can manage all my projects like it was a real person
@@nateman10 It alive but not in the same way we are. It needs to talk to get the best out of it. Get 4.0 and ask it to act as your product manager. It can make choices and give you the reasons why and even in input and come to add your input. Don't use it for coding. Use it for saving time and dining small things. And figuring out how to build apps the motions the parts.
I have something faster , modular, and intuitive to noncoders. We can include the ChatGPT API to write the bla bla bla content. Websites are easy boxes stacked , modular is the way to go. Responsiveness is easy. I need a team to do simple css. To create a stack of divs or tags as the collection. My framework is based on JS DOM manipulation so how do you protect the code, maybe an app with a stripped browser? JS is not proprietary. Anyways anyone want to build simple css boxes to add to the modules, get at me.
It is slow enough that it makes me think they use openai to generate this, that is bad
Other than that is cool because it embraces the fact that we humans are the ones that do the real work
Haha, you're taking the piss, right? Nah man, there's no way they didn't put some money into your pocket for this one Theo. 5:10, the code is spaghetti and you didn't even achieve anything.
I got deprecated
Goodbye frontend developer career, Hello AI prompter career...
That career lasts as long as it takes for the LLM to be trained on it lol
Yo, my< says it’s slow, and copying these codes would be faster. I’m not sold but I’ll sign the waiting list . Framework on frameworks. Why not just generate code without the extra layer dependencies. If we were adding databases (maybe it does) it would be more impressive. So you must learn to prompt with it, then already know React to correct errors or styles. Modular stacking should be as easy as pasting (appending) the next child in the body. I might even go as far as just including in-line css and JS in every module (div or tag] added. Where’s the ChatGPT option to write content? Each module should be able to write or allow copying paragraphs into module. My
I mean for now it's using our slow human tools. I think computing down to the hardware is going to become a black box just like a neural network
ChatGPT provides similar results tho
Theo you have twelve lips and two tongues
yay, the future is debugging horrific AI generated code 🤡
Which is pretty much the difference between junior/senior already, and is why seniors can pick up a lot of jobs already and junior's complain they can't get their foot in the door anywhere
@@xdarrenxSeniors are also not that far off from getting replaced. Compared to juniors, seniors are not THAT much more skilled. AI though will be many many many times more skilled, less bugs, cheaper, infinitely faster. Yea seniors are also going down the drain
@@Wanderer2035 This is what I hope for, it means I can replace my boss with myself and let the AI develop my company's software, since I have much cooler ideas than my boss, but I don't have the capital to pay devs myself. Free(ish) devs would be amazing
Don't worry, you won't have to debug it, the AI will. (and the horror starts setting in)
I don't care what people say, ai is coming to take everyone's jobs... eventually, just accept it and get ready to be laid off
Well be willing to try this once they make it an option to substitute that Tailwind with pure CSS or anything beside Tailwind
Why though so negative about tailwind? You can try it not in an existing project
It's faster to code...
is this sponsored
Doing css styling with ai is slow😂
good news = your job is going away