draw a ui

draw-a-ui

Este é um aplicativo que usa o TLDRAW e a API GPT-4-Vision para gerar HTML com base em uma estrutura de arame que você desenha.

Atualmente, estou trabalhando em uma versão hospedada do Draw-A-UI. Você pode se juntar à lista de espera em draw-a-ui.com. O núcleo dele sempre será de código aberto e disponível aqui.

Isso funciona apenas pegando o Canvas SVG atual, convertendo-o em um PNG e enviando esse PNG para GPT-4-Vision com instruções para retornar um único arquivo HTML com o Tailwind.

Isenção de responsabilidade: Esta é uma demonstração e não se destina ao uso da produção. Ele não tem nenhuma autenticação, então você ficará sem dinheiro se implantá -lo.

Começando

Este é um aplicativo próximo.js. Para começar, execute os seguintes comandos no diretório raiz do projeto. Você precisará de uma chave de API do OpenAI com acesso à API do GPT-4 Vision.

Observe que isso usa o próximo.js 14 e requer uma versão do node maior que 18.17. Leia mais aqui.

 echo " OPENAI_API_KEY=sk-your-key " > .env.local
npm install
npm run dev

Abra http: // localhost: 3000 com seu navegador para ver o resultado.