CodePen ou texto Sublime? Se falamos de programação para web, o nome HTML, CSS e JavaScript chega imediatamente até nós. Existem várias maneiras de chegar lá. Até, se abrirmos um bloco de notas, podemos começar a trabalhar escrevendo "html". É verdade que para ver o resultado do que você está programando em um pad, você precisará de um procedimento trabalhoso para perceber o progresso.
Esses sites são os principais playgrounds para desenvolvedores de aplicativos para usuários do dia. Para saber mais sobre as vantagens e desvantagens desses programas, vamos analisá-los profundamente neste artigo (pelo menos, tudo o que sabemos). Como sempre digo, com certeza alguns de vocês aqui conhecem mais do assunto. Se sim, comente tudo o que nos escapa aqui. Teremos o maior prazer em discutir!
Hoje vamos analisar CodePen, JSBin, Plunkr, sublime, CSSDeck, Dabblet e LiveWeave. Quais são as mais conhecidas e as ferramentas mais utilizadas neste ambiente. Existem mais, é claro.
Mas para todos vocês que não sabem do que se trata o FrontEnd ou o BackEnd, vamos explicar um pouco. O front-end ou interface é a parte visual que o usuário que está navegando poderá ver na web. O BackEnd será a parte que o administrador do site controla. Na programação, se você inserir o código por meio de uma ferramenta que exibe o resultado simultaneamente, isso será chamado de front-end.
CodePen
Para muitos, a ferramenta mais completa de tudo o que falamos. Usado como uma ferramenta web que é a coisa mais próxima de uma comunidade para mostrar o seu trabalho. Uma espécie de Youtube do programador. Nele, você poderá ver o trabalho dos programadores afiliados à web e contatá-los caso tenha algum interesse, ver o perfil deles, acompanhá-los nas redes e até assinar o canal deles para ver todos os seus projetos futuros.
Apresentação de conteúdo, suporte e atalhos de teclado
A apresentação do CodePen é a mais interessantePorque com apenas alguns cliques, você pode trabalhar no processo imediatamente. Com linhas de html, css e javascript muito bem separadas. Além da parte visual, que você pode intercalar para cima e para baixo para ver claramente o seu progresso. Ajudando assim a diferenciar bem cada idioma. Algo que é útil para programadores mais novos.
Seu suporte na web, torna mais suportável quando você deseja começar a usar algo que realmente não conhecemos muito bem. Isso não significa que seja melhor para você, depende das necessidades que temos. Mas sim, para conhecer um pouco melhor o ambiente antes de se comprometer a instalar qualquer coisa no computador de origem "desconhecida".
Se você é um daqueles que costumam usar casos totalmente teclado quando você trabalha, CodePen será maravilhoso para você. Outras ferramentas precisam plugins ser capaz de usar atalhos de teclado para preencher o ambiente. Isso torna o trabalho um pouco mais desconfortável (embora seja igualmente eficaz depois de instalado). CP. integra como padrão um sistema que o fará preencher as mesmas linhas de código que se repetem, como poderia ser em uma lista. Você escreve como deseja que a lista apareça e clica em Tab.
A versão Pro também permite muito mais opções por um preço de € 9,00 para o pacote básico a € 29,25 para o pacote “Super”. Poder atualizar em vários dispositivos simultaneamente o que fazemos em um. Também um modo cooperativo, um "modo professor", etc. Beneficie-se se quiser aqui.
JSBinName
JSBin é uma ferramenta que podemos qualificar como direta. Uma vez que você vai para o seu domínio web, ele estará pronto para começar a desenhar seu próximo projeto, sem demora. E embora sua primeira encenação não seja muito atraente, é confortável.
JSBin é simples, com a estrutura básica criada em html para não perder tempo, você vai intercalar entre as diferentes linguagens para completar o trabalho. Primeiro temos o HTML, depois CSS, Javascript e finalmente o seu trabalho visualmente. E embora pareça mais difícil, você terá os mesmos tipos de atalhos sem instalar nada. Diretamente do navegador.
Porém, achei mais desconfortável visualizar o código corretamente, uma vez que ele está oculto devido às colunas subsequentes. Já que, com o laptop, você deve desistir ou desistir com o trackpad e não é muito fluido.
Possui apenas duas parcelas, gratuitas ou pagas. É um pouco mais caro do que o CodePen, embora se você pagar anualmente, será mais lucrativo se você puder pagar € 120.
CSSDeck
O ambiente de trabalho de CSSDeck é diferente do visto acima. Dividido em apenas duas colunas, código-visual, CSSDeck trabalha com 3 linhas abaixo com as quais divide os diferentes tipos de linguagem. Com uma apresentação em forma de rede social e um ambiente de trabalho mais limpo em cores claras. Parece uma ferramenta simples. Embora às vezes, isso não signifique que seja negativo.
Com mais de sessenta mil usuários cadastrados e mais de duzentos e cinquenta mil projetos criados, pesquisar e encontrar o que deseja não será difícil. O idioma de sempre, se pode ser um transtorno para quem não conhece inglês, mas neste social vermelho A imagem é muito importante, então não acho que seja um grande desafio.
plunkr
plunkr é a ferramenta menos atraente que encontrei até agora. A apresentação é aglutinada em mensagens e falta de imagens. O carregamento do conteúdo é lento e não muito útil à primeira vista. Além disso, a ordenação por data faz com que qualquer programação, por mais simples que seja, fique na primeira posição. Para ver algo mais interessante, você deve ir para a guia que diz: «Mais visto«. Isto é, se você não o traduziu com o Google antes.
Dizem também que de acordo com a web, eles estão na versão 1.0.0. Então isso explica um pouco sobre o design, a apresentação e os possíveis erros que você encontra ao navegar na web.
Como uma vantagem, se você ficar sem ideias, você não terá que sair ou abrir outra aba no Plunkr, já que diretamente da barra lateral direita você pode caminhar com outros projetos e visualizá-los instantaneamente. Isso tornará mais fácil para você coletar ideias rápidas e aplicá-las ao seu projeto ao mesmo tempo.
brincar
brincar é uma ferramenta simples, você entra e cria. Embora você possa se cadastrar e ter seu nome de usuário através do GitHub, não é algo que se destaque muito na web. Com um fundo em um gradiente de amarelo a vermelho, na parte visual e um fundo branco na parte do código (como é normal), o projeto Dabblet é apresentado, embora você possa alterá-lo na guia CSS. Pra mim é melhor deixar em branco, já que esse gradiente tudo que dá é um pouco vida a
Quando você está editando, você pode configurar as guias que vê facilmente. Mesmo se você quiser alternar para colunas ou linhas para uma visualização confortável, dependendo da pessoa que está editando. Alterar o tamanho da fonte, salvar como anônimo sem registrar ou validar o código HTML são outras possibilidades que o Dabblet oferece à primeira vista. Embora não seja a primeira opção que eu escolheria, pode ser que leve em consideração em versões futuras se elas forem atualizadas.
Uma das coisas que eu menos gostei, mas que grandes programadores podem gostar, é que você não tem a opção de tabular um rótulo e fazer com que ele se escreva. Ou seja, coloque HTML e clique na aba e escreva "html" e "/ html" automaticamente. Algo que nos outros aplicativos se faz.
LiveWeaveGenericName
LiveWeaveGenericName É muito parecido com os outros, não tem nada que os outros não possam oferecer em termos de utilidade. O que destacamos neste projeto é o seu design, uma cor escura semelhante ao CodePen mas com uma distribuição quadrada. Poder mudar o tamanho a gosto. Há também o modo de limpeza e o «fora de linha« onde o código que você editar não será refletido visualmente, até que você o ative. Não é um recurso que você ache muito útil, como designer, é importante ver sempre o que você edita em tempo real, mas alguém certamente achará útil. E embora, como sempre, você possa se cadastrar, o usuário não tem um papel de liderança. Uma vez que, mesmo se você não se registrar, você pode salvar seu projeto.
Texto Sublime
Esta ferramenta É totalmente diferente do que você viu até agora na análise. O Sublime Text não é um recurso da web, mas um aplicativo. Por um lado, é certamente mais útil tê-lo na área de trabalho. Principalmente devido a possíveis travamentos ou travamentos de internet por excesso e possível perda de trabalho. Por outro lado, não é uma ferramenta tão visual quanto as anteriores. Além de não ter a possibilidade de uma comunidade para compartilhar projetos.
Aqui tudo é do zero. Você deve criar guias para colocar as linhas de código e renomeá-las para saber qual é. Se o primeiro for HTML, o segundo CSS ... ou vice-versa. Ele também não tem atalhos para o que será completamente manual, exceto para as aspas.
Conclusão
Todos os programas são semelhantes com certos toques pessoais de cada empresa que levam a ter prós e contras neles. Cada um escolherá o que mais lhe convier, minha recomendação é usar CodePen ou CSSDeck para o ambiente e a rede social que gerencia. Mas, se gostou mais de outro, deixe um comentário e explique seus motivos, com certeza eles serão úteis.