얼마전 <a href="https://replit.com/">https://replit.com/</a> 으로 아래와 같은 디자인을 만들었습니다.
근데 조금만 기능을 추가해 보려면 유료로 넘어가야 하더군요.
<img src="/data/froala/25.05/eaa0af799dcd74511318d7f99a4367f0ac7a11bf.png" alt="eaa0af799dcd74511318d7f99a4367f0ac7a11bf.png">
Replit 를 쓰기에는 아직 확인해 봐야 할 툴들이 많습니다. 💵 내돈\~ㅜ.ㅜ
만들어진 디자인을 가지고 <span style="color: rgb(235, 107, 86);" data-raw-html="span">클로드4.0</span> 을 통해서도 구현을 해보지만 \~ 아따 느리고 진행 되다가 끊기고\~ 그러다가 2시간, 4시간 뒤에 다시 하라고 하고\~ 아따 속 터지것네\~
물론 디테일한 PRD 를 만들지 않았습니다.
그러다가 Gemini 가 속도도 빨라지고 성능도 좋아 졌다 해서 \~ 넘어가 봅니다.
제미나이에 보면 '코딩 파트너' 가 있습니다. 이녀석을 이용해 봅니다.
하지만 원하는걸 제대로 만들어 주지 못합니다.
<img src="/data/froala/25.05/bd341fae16a15fee4738f60d24b74a5dac34027f.png"> 그러다가 확실한것을 깨닫습니다.
간단한 부분개발은 챗봇을 통해서 기능 구현이 가능하지만 사이즈가 조그만 커져도 챗봇은 방법이 아니었습니다.
이럴때는 진짜 커서나, 윈드서프 같은 툴로 넘어가야 가능하겠더군요.
그러다가 <a href="https://aistudio.google.com/">https://aistudio.google.com/</a> 라는것을 발견 합니다.
여기에 Build 라는 메뉴가 있는데 이녀석이 대박 좋은 툴 이었습니다.
<img src="/data/froala/25.05/e563f14cf29ab1b329b2bca6d3bc2bf0f223785a.png">
디자인한 화면을 캡쳐해서 주고 '웹접근성 진단 도구' 를 만들어 줘\~ wcage2.2 기준으로 만들어줘
라고 했더니 \~ 워메\~ 이것이 무엇이여\~ 겁나게 만들어 줍니다.
<img src="/data/froala/25.05/a3b4d764c3bdbd6f482bc5f7112c2b1725852478.png">몇번의 오류 수정을 거쳐서 완성을 했는데 이 도구는 특별한 점이 있습니다.
바로 웹접근성 분석에 AI를 이용하여 분석할수 있게 했습니다.
와\~ 이거 선 넘는거 아뉘니\~\~ 😳
파일 다운로드도 제공되기 때문에 기능까지 다 만들어지면 다운로드 받을수 있습니다.
다운로드한 파일을 vscode 로 가지고 옵니다.
구동을 해 보는데 에러가 납니다\~ 난감 하지만 설치 해 놨던 클라인(Cline) 을 사용해 봅니다.
<img src="/data/froala/25.05/4c0ad90d6aa47bea21c8ca153420bcacae9ee222.png">여기서 클라인이 다시 한번 수정해 줍니다.
그런데 치명적인 단점이 있습니다.
클라인\~ 매우 비쌉니다\~ 기본은 금방 소진되어서 5달러를 바로 결제 합니다. <img src="/data/froala/25.05/4e8d9d401bbadfe7986c66773efba53474e87818.png">야\~ 제미나이는 100번 이상 번역을 해도 100원 때인데 이건 순식간 입니다.
어찌 되었든 클라인을 통해서 구동 버전까지 완성이 되었습니다.
이렇게 말이죠\~\~ 와 대박입니다.
<img src="/data/froala/25.05/769f02cc70565d97f6c0abc33ffb92a94827467f.png">
AI 에이전트를 통해 이제 상상하는건 이렇게 현실이 될수 있습니다.
<span style="font-size: 30px;" data-raw-html="span">👍 Good\~</span>