Це відео не доступне.
Перепрошуємо.
Build ENTIRE Frontends With ONE Prompt - OpenUI Tutorial
Вставка
- Опубліковано 3 тра 2024
- Build and iterate on the front end simply by describing what you want. No coding skills required. This is a tutorial for the OpenUI project.
Be sure to check out Pinecone for all your Vector DB needs: www.pinecone.io/
Join My Newsletter for Regular AI Updates 👇🏼
www.matthewber...
Need AI Consulting? 📈
forwardfuture.ai/
My Links 🔗
👉🏻 Subscribe: / @matthew_berman
👉🏻 Twitter: / matthewberman
👉🏻 Discord: / discord
👉🏻 Patreon: / matthewberman
👉🏻 Instagram: / matthewberman_ai
👉🏻 Threads: www.threads.ne...
Media/Sponsorship Inquiries ✅
bit.ly/44TC45V
Links:
github.com/wan...
• Power Each AI Agent Wi...
ENTER TO WIN RABBIT R1: gleam.io/qPGLl/newsletter-signup
wow you are really selling that hard despite the onslaught of negative reviews
Don't buy a product with a promise of what it might be, people got their rabbit r1's and still not everything they expected. Just like the apple vr headset, do not buy products with a promis of what it might be.
can you make the second video about the backend . maybe use kiramase
Even for free I dont want it. >.>
Second prize is 2 RABBIT R1s :)
I’d love to hear about the limitations of these tools; often the “happy path” demos look cool, but doing anything concretely useful is impossible. (Examples: OpenDevin, Rabbot R1)
i haven't seen a worse product in years
Te best way to test the limitations is by getting your hands dirty.
And also remembering that the limitations are not set just by the AI, but also by your ability to use it.
@@brunodangelo1146 In the current day and age, AI IS the limitation. You cant create anything advanced with it currently. I wish we could, but we can't just yet.
What do you expect? AI hype channels can only make money if AI is hyped.
I'm thinking of this in terms of a boilerplate generator, if it can build me basic layouts and forms to spec faster than me loading and editing the contents of a static template then it is useful as far as I'm concerned.
This is unbelievable. Exactly what i was looking for.
Dont get me wrong i am a programmer but frontend and design is not my cup of tea and this could be very helpful in shipping products faster!!!
Using AI to generate quick UI like this is just what I needed to bring my scripts to life. Thanks Matt.
more like a brain replacement Dx
@@piotrek7633 Do you use lots of your intelligence to code basic forms? And why replace your brain with software tools instead of writing directly in machine code? Your comment seems incredibly ignorant and foolish.
As a backend developer it's satisfying 😅😅
Yeah - I'm a database engineer/data scientist.
This opens up a lot of possibilities.
Its your turn next.
As a non-coder it's pointless as it all seems rather codey. I'd just sketch what I need and pay a coder to build the thing, as I don't see how this comes close to helping non-coders, and I'm not sure what real value it has to someone who can code front and back-ends? Is installing, setting up and running this thing any easier than just coding the form fields? Surely there are libraries and the like for this?
@bigglyguy8429
Yeah. The value here is for rapid prototyping.
I do database work, and rarely do UI work. This gets me basic UI code so I can glue together all my data components.
I think this is a near-perfect solution to many problems I face.
@@JohnBoen Well that's nice :) I'd just use Balsamiq and give it to many peeps for testing before even thinking about coding it. but I'm weird like that
Thank you for the video, I am running a Windows 10 version of Ollama and needed to do these additional steps to get this to run:
pip install fastapi_sso
pip install requests
pip install peewee
pip install weave
pip install itsdangerous
pip install ollama
pip install export
set OPENAI_API_KEY=xxx
cd\openui\backend
conda activate openui
python -m openui
When you run for the first time select the setup gear icon located on the upper left. Then switch to your desired Ollama model.
Then it worked, figure it would be good to share to help others running into the same issue.
Honestly, you're the only channel I'd financially support if I had enough money. You're just amazing, and all your videos are straight to the point without all the unnecessary hype or the "THIS AI WILL MAKE YOU A MILLIONAIRE" type of nonsense, lol. Keep up the good work Mr.Berman
Don't make the mistake I made of joining a certain UA-cam channels "Skool" it was $77 down the drain.
@@xraylife Why do you think It was a mistake?
Wow. Pretty much what I've been looking for. AI for me has been HORRIBLE with creating UI, so this is gold right here.
Thanks.
looks dope thanks for sharing ❤
This looks super cool. Can't wait to see how this evolves.
Interesting observation -- Rabbit Inc. plans for this to be apart of the R1. This further proves its possible.
It will continue to evolve. Great content, Matthew!
A plan of intention not proof of what is possible. I’ll believe it when I see it, and I doubt even that.
I don't see why this is not going to be integrated in Wordpress and/or Elementor/other page builder. It's so awesome !
Because the front-end part as it's demonstrated is merely 20% of the work?
Hey Matthew, I been testing some LLMs recently, and I've come up with my own logic and reasoning problem that seems to trip up some models, including ChatGPT and LLaMA based models.
"There are two windowed doors, one left and one right, which are both locked and openable with a key. You have one key in your hand. There is second key behind the left door. When you unlock a door, the key you used disappears.
If your goal is to open both doors, which door would you open first and why?"
It would be pretty cool to see this one in your rubric in future LLM reviews!
What's the answer? (I'm not ChatGPT 😂)
@@Terran_AI Pretty simple really. Unlock the left door first so that you can grab the key from behind that door. Then open the right. That way both doors are unlocked. LLMs seem to really struggle with this one though for some reason.
Cool, CGPT was correct then, just tried it
@@Terran_AI How very strange. I tried it twice, and it got it wrong both times.
Maybe the UK one is smarter 😂
I built a simple form and gave it a Zapier webhook URL, telling it to label the form inputs and to send the info to the webhook.. and it worked! Took like 30 seconds
Wow, another great tool, another fantastic tutorial; I love these really practical how-to-do it vids, they’re incredibly valuable!
I really enjoy your tutorials. Thank you so much Matthew for doing these, I learn something each time.
Hey Matthew, appreciate your efforts in bringing us the latest and the best AI content! liked and subbed
I'm a big fan. Keep doing what you are doing Matt!!!
This is so cool! Been taking front end web dev coursework (paid by employer) for HTML, CSS and Javascript (along with design thinking ) but this should help make the process much more intuitive :)
This is so like the Internet in 1995. There are 1000s of tools like this that can be built in a few days. When you start trying to use it for real it fails completey.
Reminds me of ms-access days. It's funny, it's like the entire paradigm of 5th generation programming languages was just forgotten.
We need more of these ❤️❤️❤️
Don't know how you find these so quickly. But this seems awesome! Hope it gets integrated into Pinokio.
good video. need more of these!
6:20 - This got me exciting for a moment, but then I remembered my own recent experience when I tried to use LLM to change SVG path for me. Sadly, it did NOT work that well. Apparently not even the big models out there are capable of understanding the SVG path descriptions yet, but nice try there in your testing, yeah that is exactly what intuition would tell us to do when using such tool like this.
Make a video building a entire functional SAAS project using these amazing AI tools🔥
Again, another awesome tutorial.. keep going, my friend...
I may be saying too much, but the really valuable thing is not what it does, but the code behind how it does it.
Really interesting, I spend a lot of time yesterday searching for something like this
Looking forward to using such SW as agents working with other agents, and being able to point and click what part of the UI is wrong as part of the bug reporting process. It only gets faster from here on out, folks.
It would be great if you could make a video of building a website using AI tools like OpenUI and OpenDevin for example
I was lying in the dark and when I saw the cursor on the light mode button I was like, well now im dead.
And then I just heard, "I'm not going to click it so I don't shine a light on you" 😂😂😂
Really you are mad my day with this video❤, thousands of thanks not enough for you ❤❤
Really appreciate all your efforts and amazing videos ❣️❣️
More like build a broken website with one prompt...
seriously its horrendously bad
pretty neat. will I use? no. I can just tell gpt4 make me an html webpage with my requirements and it'll do it.
Good luck 😅
Thank you for sharing!
awesome
Just what I was looking for
Hi can you please make a complete SAAS just with the help of AI. I from start to finish. Front-end backend deploy it on a server online and make it live. I am someone who does not know code and has no time to learn it but would love to build SAAS websites with AI. Can you please show us a demo SAAS build and how we can achieve this with AI. Thank you so much for this amazing content. Love to see your videos.
Although you can build applications using AI and not understand code you still need to learn enough terminology to describe what you want. The more you know, the more effective you will be. Use the AI to translate anything you come across you don’t know. I’m very dyslexic and ChatGPT has been an amazing tool, assistant, and friend.
This question indicates a total lack of knowledge of at least what it takes to make a piece of software work.
Awesome video
This is incredible, and only gonna get better
A Golden age of opensource is upon us! 💛
#WholesomeAGI 🌈
... that's great! - indeed no excuses ...
Could this build a UI to view AI agents and talk to them?
AIs will make so many job obsolete, or at least reduce the number of people who will be asked to continue doing those jobs. I'm all for AIs, but we need Universal Basic Income worldwide now.
I don't think we are there yet. And the math isn't going to work out on that yet. The rich would stay rich and everyone else would be poorer
you're kidding? Those tools will generate messy code that will be a hell to maintain. Such tool is merely enough to build a mockup or a visual prototype.
@@gokudomatic You gotta see the progression. In 10 years, the code will be perfect. I'll bet anything on it.
Exactly. Most people never think future/long-term
Universal Basic Income.... I don't think so
"Open UI *let's you describe..."
So cool! Thanks
Thanks for sharing 👍
I enjoyed the video a lot!!!
Thank you for this video. Including a new conda env was very smart (and safe). I had no problems with the installation as well, but I don't know, I'm not sure how useful it could be for larger projects. I tested it a little, it works ok with llama3 and not so well with llava. When I try to paste an image, it doesn't do anything, so I guess somehow the upload doesn't work. I didn't know about llava, from what I tested it works quite well on simple images, but not so well when it has to understand a screenshot of scientific document. Oh well.
for those that didnt notice he is in the backend folder when he dose the pip install . command
I think I know what I am doing this weekend.
Even if you were to write a step by step right here would be so helpful
One of the best video by you and tool after Devin/Devi... Thanks for showing this to us
Mathew please give a shout out to your subscribers, they have done you proud, by coming here to show you support, so please a little bit of acknowledgement .
Thanks!
Hey Matt, I'm a beginner and wanted to know how to set up ollama for it to function. This is the first time using it.
Any other similar Text to UI?
6:10 there is also moondream now available in ollama
Great, have to play with it, definitely!
Today I created a snake game, which is more realistic. If it eats food, it has an outcome later. 😂😂😂
Can you ise this with LMStudio?
0:46 "I'm gonna show you how to install this..." You're welcome, everyone. 😂
7:00 maybe you need GPT-4 from the start to read the image correctly?
This is awesome! What do you recommend for the backend?
Would be nice to fork this and make it work with other models and design systems. Nice tool!
Thank you.
Hopefully they will add streamlit support.
Bring on the threatened developer comments
would be really great if you combine this with a backend project to build a small app
Matt use anaconda navigator next it's such as easy tool to maintain environments people can grasp it super fast!!!
Cool stuff.
Any similar project that can generate "React Native" Apps that you can showcase.
Possible to show us how to combine this openui with the backend ai tool and do a login screen and save the data into the backend using these ai tools end to end ?
o my god, a signup form. most db services give that out of the box (frontend and backend). no reason to use AI for that. build something small but complicated with it and you'll see how big the limitations are. how quickly it all breaks down. my guess is that most low code no code tools are way more functional.
I don't like that it rebuilds every time.😬
How do you know the LLM didn't mess something somewhere else in the code ?
Hi, the Llama that you use, is it the 70b? Thanks for the tutorial
what about a tool wireframing to Frontend code. that would be something.
I suggest a video of how to integrate this with some backend logic also created by ai in a open source way
What about css styling? Can you tell it to change colors? Definitely something I will try soon
what llava version?
Man i have seen that the command r plus with fine tuning outperforms any model would love if you could make a fine tuning ai model guide
I really really really wish these AI hype channels would actually try demos that are not the standard ones supplied with the AI tool. Actually use it like we all would in the real world
I mean, he's pointing you to the water. It's up to you to drink.
what to they have for backend? I imagine it's much more complicated because you have things like API's, traces, tests, session management, auth, etc. I'm looking for something AI based like this if possible lol.
Incoming revoke comments as usual. Good engagement for the algo, though!
Sir I have cloned the respo using API KEYS, The app run successfully but I am not able to access Ollama Models because there is no Ollama options in settings. Thare is a GPT 3.5 Turbo and GPT 4 . How to enable Ollama models?
I’m curious how well the performance of this app will be with deepseek coder, starcoder2, mixtral and llama3.
3:40 but did it update the html so it errors on incorrect email format?
getting error from openUI,
"Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node."
how to add coloring theme to my terminal like you?
I've download the preview version, what else do I need to do as I want to use OpenUI for front end dev, please bro
can we know what the products to create backend ? similar to this.. if possible make a video on the entire end to end app creation plz plz plz .. in need .. thank u in advance
I don’t love that everything is going tailwind. CSS-in-JS scales better, easier to read, and reusable for react native, being they are style objects
I like tailwind
Have you found any cool / easy-to-use frameworks that allow for low/no-code app development with AI assisted prompting? I'm a big security / backend guy but not really UI/UX talented. Just curious if you have anything to make my life easier.
@@luka1790 i take you you haven’t been doing frontend for 10+ yrs
It only gives html, but not CSS. Only html is not of much use...
It's styled with Tailwind, looks like. Some aren't into Tailwind, but I bet an LLM could refactor it to vanilla CSS once it looks right.
Great info ! Just one question I seem to get a blank white page when I enter the host page. I think its loading slow maybe??
Can you make a video using the software to create a whole project? Just want to see the capabilities as I am a newb.
I get an error when trying to install with "pip install ."
ERROR: Directory '.' is not installable. Neither 'setup.py' nor 'pyproject.toml' found.
Bruh how long til it gets good enough to take our jobs?
Don't forget to revoke your API key!
for windows user export does not work, how you create the openai key variables? under system variable option in windows?
Very nice. 🎉 ! Will be live ? Were may I have help?
how to use this with grok?
@matthew_berman - I know that if this is html it's just a matter of linking all of it. But which workflow & tools would make that feasible? And where are you installing this, as in.... How to run this in AWS with an AÍ backend?
Ill stick to WordPress, webflow , php... Thx