[Music] Hi, welcome to another video. Recently, I covered GPT artifacts, which is a clone of the artifacts feature from the recent Claude launches. The artifacts feature allows you to generate code in a chat-like interface and preview it right within the chat. You can also ask it to make changes and see live improvements. This feature is really cool because it allows you to generate code and view it without dealing with copying, pasting, and setting up environments. It really makes generating code hassle-free. Many people have really liked this feature because it makes prototyping extremely easy. GPT artifacts that I covered was cool, but it had some issues like it could not render react components well and couldn't make further changes after they were built. But today I have something pretty cool, and that's promp to UI. Promp to UI is also a clone of the artifacts feature from Claude. And although it can generate code in any language, it can only render react components as of now. So if you want to generate HTML, you can use chat GPT artifacts, or if you

want to generate react you can use this anyway although they say that that it only works with anthropics API. I'll be showing you how you can make it work with any API, whether it be open AI, a llama for local models, or Gro. It also has the same artifact generation system prompt as used by Claude, which is pretty cool. Also, its UI is pretty cool as well. Anyway, let's get it installed. Now, first clone this repo to your computer. Once cloned, nav into the folder and run the npm install command. Once done, rename the EnV example file by removing the example part. Then open it and enter your anthropic API key. Here I'll also show you how to use it with local models in a bit, but first let's put the API key here. Once done, come back to the terminal. Now run the command, and the application should start. Head over to Local Host port 3000, and you'll see the screen. On the right, you can see the preview Tab, and on the left is the chat interface. So let's ask it to create a

to-do app and see if it can make it. Okay, it's making it now and it's done. You can see that the response is on the left and the artifact is on the right. It works pretty well and has most of the things you would want. You can use the code option to view the code. It's really cool. Now let's ask it to add a heading at the top so that we can see if it can make amendments to it or not. Okay, I have sent the prompt and it's generating the artifact and it's now generated. As you can see, it has added the heading and it looks pretty cool. So it seems that it can do whatever you want and can also make changes after being generated, which is also pretty cool. But now let's also ask it to add an edit option. Okay, let's send the prompt. It's getting generated now and we have the generation here. Let's check. Okay, it has added the option and it works pretty well. It's really amazing. You can check the code and everything.

it's really cool. Let's also ask it to make something else. Let's ask it to make a food ordering app. Okay, it's getting generated now. Let's wait. Okay, it's now generated. This looks fine. It has all the cart and stuff like that. It's pretty cool. Let's also ask it to make it better. Okay, it's doing that. Let's wait. Hm, it's generated now. It has added some tabs and things like quantity and stuff. I really like this. This is fully usable, and there's code and everything for it. I really like this, but now let's also try it with local models. First, we'll need to get AMA installed. To do that, go to AMA's site, click on the download button, choose the operating system, and get it installed. Once done, go to the models page and choose a model. In my case, I'll choose the Deep Seek Coder V2 model. Click on it and copy the installation command. Now paste it in your terminal and run it. This will get the model installed on your computer once it has been installed.

you'll see this chat interface. Send a message and check if it works. Once that's done and set up, open up this file. Change anthropic to create open AI and in the library, change that as well. Make sure the line looks like this. Once done, create an open AI variable here and enter the base URL and everything like this. Now, in the model line, change anthropic to open AI and change the model from Claud 3.0 to whatever you want to use. In our case, it's the Deep Seek Coder V2 model, so I'll enter that. Once done, save it. Make sure it looks like this; otherwise, it won't work. Anyway, now run the program again and go to the same localhost port 3000. And now we can use it with local models. Let's do the same things with it. Let's ask it to generate a to-do list app. Okay, it's generating the artifact. Now, let's wait for a minute. Okay, so this doesn't work. I mean the code is fine, but it is not able to render it for some

reason. So, let's just send the prompt again and ask it to keep it simple. Let this time. Okay, it's getting generated now. This looks fine. The send button is not visible due to its color, I guess, but it's there and it works. So, this is pretty cool. Obviously, we are using a local model, so I guess I can't complain. Let's ask it to fix the send button and add the edit option. Okay, it's getting generated. Let's wait a bit. Okay, we have the code now. Looks pretty cool, although the send button is not yet fixed. At least the edit option works. It's cool, I guess. Let's ask it to make it more modern and better. Let's see if it breaks or not. Okay, it's getting generated and it fails. Okay, I guess the interface can't render the great UI that deep seek generates and crashes, but anyway, let's move on to the food ordering app. Okay, let's send the same prompt here. Okay, it's getting generated now. Let's wait. Okay, this looks almost similar to The Claw generation and works like that.

as well. So, it's pretty cool. Now, let's ask it to add the quantity and the search functionality. Okay, it's getting generated. Now we have the code here. Looks pretty cool. The quantity thing doesn't work, but at least the search does, which is cool. So, this way you can use it with local models as well. You can also use it with GPT-4 or any other OpenAI compatible model as well. It's really cool. Although I prefer the Claude model here, the DeepSeek model is also fine, although the outputs by Claude are very fleshed out and work right away, which I really like. Overall, it's pretty cool. Let me know your thoughts about it in the comments. If you liked this video, consider donating to my channel through the Super Thanks option below. Give this video a thumbs up and subscribe to my channel. I'll see you in the next video. Till then, bye. [Music]

PromptToUI + DeepSeek-Coder-V2 : GENERATE Applications with LOCAL Artifacts (Claude Artifacts Clone)

Facing the future with AI! 

Here you'll find content about multiple AI Tools that are actually useful and sometimes free.

PromptToUI + DeepSeek-Coder-V2 : GENERATE Applications with LOCAL Artifacts (Claude Artifacts Clone)

스크립트