• 이 새로운 AI 소프트웨어인 Bolts는 코딩과 관련된 모든 소프트웨어를 대체할 수 있는 가능성을 지닙니다. Bolts는 기존 AI 코딩 소프트웨어를 단일 플랫폼으로 통합한 혁신적인 프로젝트입니다. 우선 GitHub를 살펴보면 Cloud, npm와 같은 기능을 사용할 수 있는 것을 확인할 수 있습니다. 또한 패키지 설치, 백엔드 실행, 코드 편집이 가능하며, 새로운 볼트 기능을 소개하고 있습니다. 이 기능을 통해 npm 도구 설치, Node.js 서버 실행, 타사 API와의 상호 작용, 프로덕션용 앱 배포, URL을 통한 작업 공유가 가능합니다. 팁과 요령에 대한 몇 가지 추가 정보도 제공하지만, 좀 더 구체적인 내용은 지침에 따라 확인할 수 있습니다. 이제 이 AI를 실제로 살펴보겠습니다. 이 기능은 비교적 새로운 것이어서 개발 팀에 대해 잘 모르지만, 계정을 만들어보니 팝업 창 스타일 등 사용자 경험이 다소 어색했습니다. 처음에는 로그인 방법을 알아내기 힘들었지만, 결국 로그인에 성공했습니다. 이제 차이점을 살펴보겠습니다. 텍스트 실행 명령을 이미 실행해 두었지만, 다음과 같이 명령을 입력해 봅시다. “Next.js와 Tailwind CSS를 사용하여 부동산 웹사이트에 대한 코드 작성”, “주택 사진과 가격, 기타 필요한 세부 정보를 보여주는 필러 데이터 추가”. 이는 꽤 간단한 프롬프트이며, 세부 정보를 추가하기 위해 “더 많은 정보 보여주기”와 같은 기능을 사용할 수도 있습니다. 지금은 간단하게 해보겠습니다. 생성된 결과물을 살펴보겠습니다. 대부분의 AI 프롬프트 타일 소프트웨어와 비슷하지만, 여기서 차이점을 살펴보겠습니다. 첫 번째 차이점은 코드 편집 기능입니다. 이는 Chad GPT와 비교해보면 캔버스와 비슷하지만 여러 파일과 페이지를 표시하는 옵션이 없습니다. 커서는 명확하게 VSCode와 유사하지만 여기에 AI가 추가되어 있습니다. 제가 다른 AI 소프트웨어에 대해 언급한 바와 같이, Chad GPT나 Copilot에 파일을 VSCode의 인터페이스처럼 표시하는 기능이 추가되면 게임 체인저가 될 것입니다. 하지만 현재 이 기능이 바로 모든 사람이 찾던 기능인 것 같습니다. 이보다 멋진 점은 npm run Dev와 같은 Next.js 프로젝트에 필요한 명령을 포함한 터미널이 하단에 표시된다는 것입니다. 아래로 스크롤하면 명령이 실행 중인 것처럼 보이지만, 로컬 호스트가 표시되지 않고 자동으로 미리보기로 전환된 것 같습니다. 미리보기에서 모든 세부 정보가 표시되는 것을 확인할 수 있습니다. 이 기능을 테스트해 보았고 디자인 레이아웃이 거의 동일합니다. 유일한 차이점은 메뉴에 아이콘이 추가된 것뿐입니다. 하지만 정말 흥미로운 점이 있습니다. 일반적으로 이렇게 복잡한 웹사이트를 만드는 것은 시간이 많이 걸리고 복잡하지만 이 기능을 사용하면 문자 그대로 이 모든 작업을 수행할 수 있습니다. 오른쪽 상단에 배포 옵션이 있습니다. 이를 테스트해 보면 N5를 사용하는 것으로 보이는데, 링크 없이 어떻게 진행할 수 있을지 잘 모르겠습니다. 하지만 일단 시도해 보고 결과를 살펴보겠습니다. 전체 코드 파일을 확인할 수 있습니다. 예를 들어, 레이아웃을 살펴보면 실제 코드가 표시되며 여기에서 링크를 사용하는 것을 확인할 수 있습니다. Chad GPT의 캔버스를 사용해 시도해 보았을 때 링크 태그 사이에 문제가 발생하여 제대로 작동하지 않았지만, 여기에서는 페이지에 필러 데이터가 표시되는 것을 확인할 수 있습니다. 당연히 하드코딩된 정보를 사용하도록 지시했지만 API를 사용해 테스트해 본다면 비슷한 결과가 나올 것으로 예상합니다. 코드 자체는 나쁘지 않은 것 같습니다. 패키지.json을 확인해 보면 필요한 모든 것이 설치되어 있는 것을 확인할 수 있습니다. 또한 여기에서 몇 가지 흥미로운 내용도 확인할 수 있습니다. 이제 미리보기로 돌아가서 기능을 테스트해 봅시다. 먼저 다른 탐색 옵션을 클릭해 봅시다. 약간 이상한 점이 있는데 아이콘을 사용하는 것 같습니다. 문제가 발생한 것 같습니다. 해결 옵션을 선택해 보겠습니다. Chad GPT의 Copilot과 비슷하게 코드를 적용하여 문제를 해결할 수 있습니다. 이번에는 검색을 시도해 봅시다. 정말 미친 것 같습니다. 이 기능은 정말 믿을 수 없을 정도로 뛰어납니다. 주의해야 할 점이 하나 있는데, 응답 빈도나 제한이 있는지 확인하지 못했습니다. 프리미엄 버전에 대한 언급이 있지만 확실하지는 않습니다. 현재는 무료로 사용할 수 있는 것 같지만, 분명히 제한이 있을 것입니다. 궁금한 점이 하나 있습니다. 페이지당 카드를 4개까지 추가하고 페이지를 3개까지 추가하여 총 12개의 카드가 생성되고 사용자가 다음 페이지로 이동하거나 이전 페이지로 돌아갈 수 있어야 합니다. 물론 상상력이 중요하지만 이 기능이 이러한 요구 사항을 충족할 수 있다면 정말 대단한 일입니다. 먼저 이 기능의 단점을 살펴봅시다. 이 기능은 비교적 새로운 것으로 이해하고 있지만, 여기에서 소개한 기능은 다른 플랫폼에서 결합한 적이 없는 것입니다. 하지만 현재 이 기능의 응답 속도가 상당히 느립니다. 물론 업데이트가 진행 중이라면 개선될 수 있을 것입니다. 이 기능이 실제로 작동하는지 확인해 봅시다. 코드도 살펴보겠습니다. 실제로 업데이트된 내용이 있는지 확인해야 합니다. 예상대로 확실하지 않습니다. 미리보기로 이동해 봅시다. 서버 구성 요소가 지원되지 않는다고 표시됩니다. 문제 해결을 시도해 봅시다. 이 기능이 이 문제를 해결할 수 있는지 확인해 봅시다. 수동으로 코딩한 경우 해당 원리를 이해하지 못할 경우 문제를 해결하는 데 시간이 많이 걸립니다. 만약 AI가 이러한 문제를 해결할 수 있다면 정말 놀라운 일입니다. 로딩에 시간이 걸리기는 하지만, 이 기능이 매우 뛰어난 점은 Chad GPT, 코드 편집기, 라이브 미리보기 기능이 결합되어 있고, 추가적으로 배포 기능도 제공된다는 점입니다(아직 시도하지 않았지만). 이렇게 뛰어난 기능이 모두 제공된다면 정말 엄청난 것입니다. 하지만 다른 업체가 이 회사의 기능이 시장을 잠식하는 것을 보고 있다면 이러한 기능을 자사 제품에 추가할 가능성도 있습니다. VSCode는 이미 사용 중이지만 이러한 기능과 유사한 업데이트를 추가하는 데 무엇이 걸림돌입니까? 심지어 Open AI의 경우도 마찬가지입니다. 캔버스를 이 기능과 거의 동일한 것으로 만들 수 있을 것입니다. 캔버스는 기본적으로 이 기능과 비슷하지만 VSCode의 파일과 터미널 기능이 없습니다. 반면 Open AI는 엄청난 자금을 확보한 것으로 알고 있습니다. 그러한 자금력으로 이러한 기능을 추가하는 것을 보더라도 놀랄 일이 아닐 것입니다. 아직 미리보기 업데이트 로딩이 완료되지 않은 것 같습니다. 아마도 이제 4개가 표시됩니다. 정말 미친 짓입니다. 이제 질문은 2페이지를 클릭하면 어떻게 될까입니다. 유일한 문제는 이미지가 표시되지 않는 것 같다는 것입니다. 혹은 연결된 소스가 문제일 수도 있습니다. 어느 쪽이든 이것이 얼마나 미친지 깨닫지 못할 것입니다. 이것이 내가 먼저 코드를 배우면서 만든 첫 프로젝트였습니다. 즉, 한 페이지당 집 카드를 최대 4개로 추가하고 최대 3개 페이지로 구성된 페이징을 추가하여 총 12개의 집 카드를 만들면 됩니다. 각 페이지의

원본 유튜브 영상: https://youtu.be/JnikJf0m5J4?si=ynes4-4l40JnkIcH