I had simply provided this image to Bolt.new, and it was capable of generating all the UI components. With this new Bolt.new feature, I was able to generate this beautiful new UX where I can simply provide an image, and it was able to autonomously generate all

of these different animations, as well as the code for all of these pages, within a couple of minutes. It hasn't even been 2 weeks since I made a video showcasing the new features of Bolt.new, called Autocode, and we already have a

huge new update. For people who don't know what this fork is, it's a fork of Bolt.new's original repo by StackBlitz. It's fully open source and local and allows you to connect to local AI models without any paywall. This is a

project created by the open-source community, led by a new, upcoming YouTuber called Cole Medan. Huge respects to him, as he was able to crowdsource all of these developments by the open-source community. Now, for people who don't know what Bolt.new is, it's an AI-

powered web development agent that allows you to prompt, run, edit, and deploy full-stack applications. It's a great tool that we've showcased multiple times on this channel; it's capable of creating various sorts of apps. So I'll leave links to those in the description

below. But now, with this new fork, we have so many new updates, even after the update video I made 2 weeks ago, which is just insane how fast the community has been working on adding new things to this repository. In fact, this branch is 48 commits ahead of the

Original StackBlitz Bolt. New main repository, which is just insane to me. Let's first get started and showcase all these significant updates as part of this release. This is where we're going to first talk about the introduction of folder imports. This is a button that is

now accessible within this fork, and it's going to allow you to start a new chat by selecting an entire folder. This is where you can provide a full codebase to Bolt. New, and it's going to be able to have context of it, so you can make

edits to it, and you can have it so that it could continue chats by even importing your previous history or even exporting chats that you can even share with other people. What's also cool is that it is now mobile-friendly, which has a pretty nice, sleek UI so that you can

even use this on your mobile if you even wanted to. With this new release, you also have Together AI integration, and there's a provider implementation guide where this latest release introduces a new provider alongside detailed implementation as to how you can simplify the setup process and configure

everything, where it showcases the provider architecture overview, the implementation steps, as well as the configuration patterns, as well as best practices. This is a subtle update, but this is the pull request that has been now integrated into the repo, and it basically improves the chat component by

focusing on prompt input persistence as well as performance optimization. It uses cookie-based caching, so that it's going to ensure that prompts are saved across sessions while debouncing techniques minimize unnecessary renders, so it's going to result in a smoother and more efficient user experience, and it's

going to be something that will definitely elevate your responses. Another small, subtle update: they've added search/chat support. Before, you weren't able to search between all of your previous task histories, but now you have the ability to search within the left-hand panel. It's just going to

make it more convenient and just make it a better AI coding agent. There are a lot of other closed pull requests that have been already merged into the overall repo, like subtle new things like fixing the UX/UI design a little bit, improving backend functionality, and so much more.

But now we're going to take a look at certain open pull requests that will soon be approved and added into the overall branch. Now, firstly, we're going to take a look at the addition of a new voice-to-prompt using browser API. This is a new feature that they're currently

working on and soon will be added where you're going to be able to prompt responses in Bolt. New, and you're going to be able to have it generate based off of what you say. As Cole also mentioned, they're working on having the ability to attach images

to prompts, which is going to greatly elevate the functionality of this coding agent, where you can provide wireframes or just simple screenshots and have the AI even describe what's happening or even replicate that basic design. And this is actually something that is going to be available very soon; it's actually

something that you can download today, but it's going to be integrated into the overall branch sooner or later, as they're currently working on refining it even better. But say if you want to actually take a look at some of these different pull requests that have not already

Been add add it to the overall branch. Well, you can easily install it, and it's quite easy to do so. What you can do is you can head over to a random pull request you're interested in; you can click on this code button, and then you

can check out with GitHub Desktop. Now you can easily install it for your operating system. I'll go ahead and leave a link to this in the description below. Go ahead and install it and log into your GitHub account. Once you have done so, go ahead and click on "Checkout with GitHub

Desktop." This will open this up within the repository. You can go ahead, and you can then have this URL cloned onto your desktop, and it will then open this up. You'll then see the pull request, which is the current branch you're going to be working with, and

that's especially the one that we wanted to work with, which was the "attach image to prompts" feature. So what we can do now is open this up in Visual Studio Code. Once that's done, you can go ahead, click on the three dots, and click on "New

Terminal." And from here, you can go ahead and install the new packages. I believe the install command is `pnpm install`. You can then install everything that is necessary. Once that's done, you can then start it up with the `pnpm run dev` command, and then you're going

to be able to start this up within your localhost within a couple of seconds. So we can then access this on our localhost, and you are going to be able to have all the new features, such as attaching the images like we wanted from this pull request, which was easy as that.

So now that I've gotten all of these updates out of the way, let's take a look at how you can install this locally. To get started, you're going to need to have the prerequisites fulfilled. Make sure that you have Git installed; this is to

easily clone the repository onto your computer. Make sure you have Node.js installed, Python installed, VS Code to edit the configuration environments, as well as an API key from any provider that you want to utilize. In this case, I'm using Anthropic to access the new

Claude 3.5 Sonic model. Now, if you're going to be installing with Mac or Linux, make sure you have Docker installed, because this is another approach that you can install this with. Now, since I'm on Windows, I'm not going to be using the

Docker Express way; I'm going to be running it without Docker with the pnpm command. So you need to also make sure that you have this installed. But now what we're going to be doing is getting started and showcasing how you can install this. If you're going to be

running this with Docker, it's fairly easy. You're going to need to just simply go over to your composer; after you have cloned your repository, you just want to easily paste in the build command and the compose command, and then you're going to be able to run up the

new fork quite easily within your localhost. So first things first, head over to the GitHub repository link, which I'll leave a link to in the description below, as well as all the other links that I use in today's video. So go over to this repo, click on this green button, and

Click on "Copy to Clipboard". Once you've done that, scroll back down to the installation guide. You can simply open your command prompt. Go ahead and open this, and type in the command `git clone`, paste in the link, and click Enter. Now, since I

already have this installed, I'm just going to showcase the commands and how you can easily install this. So now that you have cloned this, you can go into the `bolt.new-any-llm` folder by typing in `cd bolt.new-any-llm` and

click Enter. Once you have done that, you can then copy this to your clipboard—which is the `pnpm install` command to install the dependencies—and you can simply paste this in and click Enter. This will install everything necessary. Once you have done so, you can

then go into VS Code, and then you can open up the `bolt.new` directory that you just cloned. So go ahead and simply open this up, go over to `only.example`, and rename this to `only` and take out the `.example` part. Once you have done that, go ahead and paste in

the provider API key that you want to be utilizing with Bolt.new. In this case, I'm using the Anthropic API key, so I'm going to go ahead and paste this in. Once I have pasted this in, I can go over to File and click on Save. After you have

set your API key, you can start the application with the command `pnpm run dev`. Then you can paste this into your command prompt and click Enter. This will start this up on your localhost within a couple of seconds. So just give it a couple of seconds, and you can see

That it'll provide the link to your localhost, and then you can head over to this within your web browser. Within a couple of seconds, it should load up, and there we go. What's great is that with these new branches, you have small new additions like having the ability to

change the `index.html` file directly within the browser. So you can go ahead and input your API key for whatever provider you use. And we have so many new providers integrated into AI now. You have all these different local AI providers like Llama, as well as LM Studio, as well as using

different root LLMs like RoBERTa. So now let's go ahead and test out this new image feature. Obviously, it's not fully developed yet, but I want to take a look at it. This is where we're going to provide this mock-up app, and we're

going to be providing the UX of it to Bolt and seeing if it can replicate it. So I'm going to go ahead and ask it, "Please replicate this image's design for me." And we can go ahead and send this in. But like I mentioned before, you have the ability to import chats and

input folders of your full codebase, which is really cool. We're going to go ahead and send this in, and we can see it's going to start off by having all the files generated for it by first planning, and it's going to go ahead and

also preview it afterwards within a couple of seconds. I had simply provided this image into Bolt.new, and it was capable of generating all the UI components. And with this new Bolt.new feature, I was able to generate this beautiful new UX where I can simply

Provide an image, and it was able to autonomously generate all of these different animations, as well as the code for all of these pages, within a couple of minutes. Now, I also recommend that you take a look at the roadmap, because they have a lot of cool new things that

they're focusing on, and it just goes to show how committed the community is to making this the best AI coding agent available. But with that thought, guys, I hope you enjoy today's video on all of these new updates to the new fork of B.  Huge respects to the community, and

if you are one of these developers who have improved this fork, definitely comment down below, and I'll definitely give you a spotlight in the next update video. But with that thought, guys, I hope you enjoyed today's video. I'll leave all these links in the description below.

Follow me on Patreon so that you can stay up to date with the latest AI news, as well as joining our private Discord. Follow me on Twitter for free daily AI news. Lastly, subscribe, turn on the notification bell, like this video, and check out our previous videos

because there is a lot of content that you'll definitely benefit from. But with that thought, guys, have an amazing day, PR positivity, and I'll see you guys fairly shortly. Peace out, fellas.

Bolt.New (UPDATE): BEST OpenSource AI Coding Agent! (Image Support, Upload Folders) Local + FREE!

World of Ai is here to push the creative use of Artificial Intelligence (AI) applications for simple day-to-day tasks!

Here at WOA, you will find tips, tricks, and guides using AI applications to help you out in your day-to-day life. Going to strive to make your life easier! I will show you how and what you need to do to help your life out! I will strive to show you the wonders of AI and if that interests you, then make sure you subscribe to the channel now!


WorldofAI

Bolt.new의 새로운 기능 및 오픈소스 포크

Bolt.new는 단일 이미지에서 UI 컴포넌트를 생성할 수 있습니다.

몇 분 안에 여러 페이지에 대한 애니메이션과 코드를 생성합니다.

스택블리츠의 오픈소스 포크로 로컬 AI 모델 연결이 가능합니다.

콜 메단이 이끄는 오픈소스 커뮤니티에서 만들었습니다.

Bolt.new는 풀스택 애플리케이션을 만들기 위한 AI 기반 웹 개발 에이전트입니다.

전체 코드베이스를 제공하기 위한 폴더 가져오기 도입.

Together AI 통합 및 공급자 구현 가이드.

즉각적인 입력 지속성 및 성능 최적화를 통해 채팅 구성 요소가 개선되었습니다.

이전 작업 기록에 대한 검색/채팅 지원이 추가되었습니다.

브라우저 API를 사용한 음성 프롬프트.

프롬프트에 이미지를 첨부하는 기능.

GitHub 데스크톱을 사용하여 포크를 설치하는 방법에 대한 지침입니다.

전제 조건: Git, Node.js, Python, VS Code 및 API 키.

Mac/Linux(도커 포함) 및 Windows(도커 제외) 설치 방법.

리포지토리를 복제하고 `pnpm install` 명령을 사용합니다.

only.example` 파일에서 API 키를 설정합니다.

'pnpm run dev' 명령으로 애플리케이션을 시작합니다.

브라우저에서 직접 `index.html`을 변경하는 기능.

이미지 복제 기능을 테스트합니다.

채팅 및 입력 폴더 가져오기 기능.

로드맵을 확인하고 기여에 댓글을 달도록 권장합니다.

행동 유도: Patreon, Twitter에서 팔로우하고, 구독하고, 동영상에 좋아요를 누릅니다.

Bolt.New (UPDATE): BEST OpenSource AI Coding Agent! (Image Support, Upload Folders) Local + FREE!

Bolt.New (UPDATE): BEST OpenSource AI Coding Agent! (Image Support, Upload Folders) Local + FREE!

스크립트