Gambi Code

Gambi code é um ambiente de desenvolvimento front-end online, que disponibiliza ao usuário um espaço para escrever código HTML, CSS e Javascript e executá-los diretamente no navegador.

Tecnologias Utilizadas

• Vue 3
• Tailwind CSS
• CodeMirror 6

Funcionalidades

Na versão atual do projeto, as seguintes funções estão disponíveis:

• Editor de código com tabs separadas para cada linguagem (HTML, CSS e Javascript)
• Execução do código, com o resultado exibido em uma janela
• Download do código escrito, em formato .zip
• Função de copiar código do editor atual para a área de transferência

Configuração e execução

Atualmente o projeto está disponível através do link https://gambi-code.netlify.app/

Caso deseje instalar e testar localmente, basta clonar o projeto e rodar os comandos abaixo no seu terminal:

Instalar as dependências do projeto

npm install

Build dos arquivos de estilo do Tailwind

npx tailwindcss -i ./src/input.css -o ./dist/output.css

Compilar e executar para desenvolvimento

npm run dev

Screenshots