O que é devPlay.app?

É o app para o Dev criar e executar ao vivo sua biblioteca de snippets de código HTML, CSS e JavaScript, usando apenas o próprio navegador de internet. Use devPlay direto no navegador ou instale a aplicação para ter a experiência similar a de um app nativo em seu dispostivo Windows, Android ou IOS. A instalação é leve pois devPlay usa apenas recursos de seu navegador. O app foi desenvolvido principalmente para ajudar quem está iniciando nos estudos do desenvolvimento web front-end, com foco nas três tecnologias fundamentais para o desenvolvimento de sites e aplicações web, que são HTML, CSS e JavaScript.

Crie agora mesmo a sua biblioteca e organize seus snippets de códigos com o objetivo de servir como referência ou mesmo para reutilização em projetos maiores, ganhando assim muito mais tempo para empreender nas personalizações do seu projeto.

Salve seus projetos

O devPlay salva seus projetos no armazenamento local do próprio navegador. Isto significa que qualquer dispositivo que você usar, computador ou smarthpone, ou mesmo que use o mesmo dispositivo com sessões/login diferentes, cada um deles terá seu próprio armazenamento independente ao usar o devPlay. Para excluir o projeto, ao selecioná-lo clique no botão "Excluir" e confirme.

Como usar?

Clique no botão "Projetos" para criar ou acessar seus projetos. Para criar um novo projeto Clique em "Novo", digite um nome para seu projeto e clique em "Salvar". Todos os projetos criados ficam alistados na caixa de seleção. Selecione o projeto que deseja editar ou visualizar e clique em "OK". Para renomear um projeto selecione ele, clique em "Renomear", digite um nome para seu projeto e clique em "Salvar".

Agora é só codar! Simples assim. Ao digitar código HTML e CSS nas caixas correspondentes, automaticamente o devPlay salva seu código no navegador e atualiza a previsualização do seu projeto. O código JavaScript não é salvo automaticamente para evitar problemas causados por execução não desejada, enquanto você escreve as funções do seu programa. Clique no botão para salvar seu código, ou simplesmente altere algo nas caixas de HTML ou CSS. O código será salvo e executado.

Previsualização e visualização em tela cheia

A qualquer momento você pode desabilitar ou habilitar a visualização prévia do seu projeto, clicando no botão "Preview". Para visualizar o projeto em tela cheia numa nova guia clique no botão "Abrir em nova aba". Se quiser trabalhar desse forma usando a visualização numa nova janela, basta recarregar a página de visualização sempre que quiser ver as suas últimas alterações.

Layout personalizado para cada dispositivo

A interface de devPlay foi desenvolvida para tentar aproveitar ao máximo o tamanho da tela de cada dispositivo. Por isso o layout para dispositivo móvel é diferente do layout para desktop. No celular você pode alternar facilmente entre as caixas de código clicando nos botões correspondentes.

Encontrou algum problema? Abaixo clique no link "Contato" e envie sua mensagem.

Esperamos que goste de devPlay.app pois foi feito com muito ❤️!