유튜브 영상 JnikJf0m5J4?si=ynes4-4l40JnkIcH 요약
- 이 AI는 코딩에서 모든 소프트웨어를 대체할 수 있으며 이는 볼트라고 합니다. 이것은 꼭 신규 프로젝트라고 할 수 없어요. 최근에 제가 발견했는데 기본적으로 다양한 다른 AI 코딩 소프트웨어의 조합이지만, 이걸 하나로 모두 합쳤습니다. 그래서 먼저 간단히 이것이 깃허브이고 기본적으로 우리가 이 readme에서 읽게 되면 본질적으로 클라우드를 언급하는데, 예를 들어 보와 이걸로 할 수 있는 일들에 대해서도 말해주죠. 패키지 설치, 백엔드 실행, 코드 편집과 같은 것들이죠. 그게 있는 곳에 볼티라는 말을 언급한 것인데요. 걱정 마세요. 곧 작동 방식을 보여드리겠습니다. 기본적으로 이렇게 할 수 있게 해 줍니다. MPM 도구 설치 실행, 노드.js 서버 실행, 타사 API와의 상호 작용, 채팅의 프로덕션 배포, 그리고 URL을 통해 여러분의 작업을 공유할 수 있습니다. 팁과 트릭 측면에서 그들이 언급했다고 볼 수 있는 내용들이 더 있고, 기본적으로 모든 AMA에서 더 구체적이라고 말하는 것 같습니다. 이만 잡담 그만하고 지금 바로 실행되는 걸 살펴보겠습니다. 뭔가 상대적으로 새로운 것이기 때문에 몇 가지 의견을 말하고 싶은데, 이것이 누구의 팀인지 잘 모르겠고, 여기에 계정을 만들어야 했는데 그 과정이 꽤 어려웠어요. 팝업 같은 게 있는데 좀 이상하고 확인 같은 메시지도 없었지만 결국 로그인하는 법을 알아냈고 지금 여기 계시지 않습니까? 이걸 진행해봅시다. 저는 이미 한 번 실행을 했지만 여기서 말씀드리죠. 다음js와 텔윈드 CSS를 사용하여 부동산 웹사이트에 대한 코드를 작성한다고 말하고 나서 주택에 가격과 기타 필요한 세부 정보를 표시하는 필러 데이터를 추가한다는 말을 하겠습니다. 그러면 이는 꽤 간단한 프롬프트겠죠. 추가 세부 사항 측면에서 좀 더 어려운 부분을 추가할 수 있겠지만 지금은 일단 이걸 시도해보겠습니다. 그럼 이게 어떻게 생성되는지 알아보겠습니다. 여기에서 이게 대부분의 AI 프롬프트 타일 소프트웨어와 비슷해 보이는 걸 알 수 있겠지만 이들의 차이점을 알려드리겠습니다. 첫 번째는 코드 편집기를 보여줍니다. 이걸 챗GPT와 비교해보면 이게 캔버스와 비슷한데, 단 다른 파일과 페이지를 갖는 옵션은 없습니다. 커서는 분명히 코드 스튜디오와 비슷하지만 이곳에는 AI가 있는데요. 이건 내가 항상 다른 AI에 대해 궁금했던 점인데, 예를 들어 챗GPT가 아이 기호를 열 수 있었다면 파일이 코드 스튜디오에 있는 것처럼 보이는 기능을 가졌다면 정말 엄청났을 거예요. 하지만 이건 모든 사람이 찾던 것인 것 같고 대단한 것은 여기 아래에 다음js 프로젝트에 필요한 명령어와 함께 터미널이 있는 걸 볼 수 있다는 점입니다. npm run dev와 같죠. 그리고 여기서 아래로 스크롤하면 실제로 실행 중인 걸 볼 수 있고, 로컬 호스트는 아무데도 보이지 않지만 자동으로 미리 보기로 넘어간 것 같고 여기서 상세 내용을 보여주고 있는 걸 볼 수 있죠. 제가 테스트를 했고 거의 같은 디자인 레이아웃을 가지고 있는데 차이점이 있다면 이 메뉴에 아이콘이 있는 것 같습니다. 이걸 좀 보세요. 이건 실제로 굉장한데요. 여러분이 코딩을 하지 않거나 이런 걸 다루지 않았다면 제가 리액트로 웹사이트를 만들어 본 적 있는데 템플릿, 제가 말했듯이 이런 레이아웃과 매우 유사하지만 당연히 더 많은 세부 정보들이 있었고 그냥 이렇게 처음부터 뭔가를 만드는 것은 한 시간이 걸리고 이제는 이렇게 할 수 있죠. 이 테플릿의 측면에서 이게 복사해서 붙여넣기한 것인지는 잘 모르겠습니다. 왜냐하면 챗 GPT, 클로 또는 뭐든지 시도했다면 다른 영상에서 테스트를 해봐야 하겠지만 현재는 이것이 할 수 있는 것이 말하자면 여기서 볼 수 있고 배포 옵션이 있는데 두 번째로 시도할게요. N5로 보이는데 링크 없이 어떻게 할지 모르겠지만 시도해보고 무슨 일이 일어나는지 확인하겠습니다. 기본적으로 전체 파일을 그들의 코드에 대해 볼 수 있습니다. 예를 들어 레이아웃이 있는데 여기에서 실제 코드를 보고 링크를 사용하는 걸 볼 수 있어서 다행입니다. 왜냐하면 트리브트 캔버스로 시도했을 때 태그처럼 보이는 a 태그를 중간에 사용해서 그냥 제대로 작동하지 않았기 때문입니다. 하지만 여기서는 페이지라고 보이고 이건 필러 데이터를 보여주죠. 이건 당연히 저는 어려운 정보를 사용하라고 요청했지만 API를 테스트한다면 아마도 가능하거나 적어도 비슷한 작업을 할 수 있을 거라고 생각합니다. 하지만 이 코드 측면에서 꽤 괜찮아 보이고요. 뭔가 꽤 멋지다고 생각되는 기능을 보여드리고 패키지 json을 확인해보죠. 여기서 모든 것을 설치한 걸 볼 수 있습니다. 좋아요. 여기서 여러 가지를 갖고 있고, 이것도 갖고 있네요. 다른 걸 흥미로운 것이 여기 있는데 좋아요. 지금 미리 보기로 돌아가서 이걸 시도해 볼까요? 첫째, 다른 nav를 클릭하면 어떤 일이 일어나는지 좀 보겠습니다. 이상하게 아이콘과 같은 걸 사용하지만, 좋아요. 여기서 어떤 일이 일어나는지 오류가 있다고 표시하는데, 고쳐보는 옵션을 클릭해봅시다. 어떤 일이 일어나는지 좀 보죠. 이상적으로는 문제를 해결해주는 것 같습니다. 이게 CRA 생성 검색 페이지이니까요. 좋아요. 이건 커서와 비슷해요. 이건 사실 정말 멋집니다. 아직 사용해보지 않았다면 코드를 적용하고 고칠 수 있는 기능이 있습니다. 하지만 이거는 좋아요. 검색을 시도해봅니다. 이게 이렇게 되는지 봅시다. 좋아요. 이걸 좀 보세요. 이건 사실 엄청난 기능이에요. 이건 정말 믿어지지 않아요. 그리고 제가 보지 못했거나, 제가 읽지 못했던 건 제가 몇 번이나, 얼마나 많은 응답을 입력할 수 있는지 모르겠습니다. 프리미엄 버전이 있는 것 같지만 지금은 그것에 대해 잘 모르겠습니다. 현재 무료로 사용할 수 있는 것 같지만 분명히 한계가 있을 거에요. 하지만 이렇게 해보죠. 이게 제가 보고 싶은 거예요. 이걸 할 수 있는지 보고 싶어요. 이게 엄청난 기능이 될 거예요. 제가 이렇게 말하고 싶은데요. 더 많은 하우스 카드를 페이지당 최대 네 개까지 추가하고 페이지당 최대 세 페이지까지 페이징을 추가하여 전체적으로 3개의 별도 페이지에 12개의 하우스 카드가 있고 다음 페이지로 클릭하여 돌아갈 수 있어야 합니다. 제가 말씀드리고 있는 것은 상상력이라는 뜻인데, 만약 이게 가능하다면 엄청난 기능이 될 거예요. 제가 보고 싶은 건 제가 이 문제에 대해 다른 AI도 시도해봤는지 확신할 수 없지만, 온라인으로 페이징 코드를 찾을 수 있기 때문에 비슷한 결과를 얻을 수 있을 거라고 확신합니다. 하지만 AI가 이걸 할 수 있는지 봅시다. 제가 지금 여기서 말하고 싶은 것은 이건 꽤 새로운 기능이라고 생각하고 있습니다. 제 이해에 따르면 이렇게 많은 기능들을 다른 플랫폼과 조합한 걸 보지 못했지만 그렇