Algunha vez quixo que houbese unha aplicación web ou unha extensión que che permita crear e compartir prototipos de IU sobre a marcha?
Todos facemos! Todos temos ideas de como queremos que se vexan os nosos sitios ou aplicacións.
Entón, creaches un deseño moi xenial e non recordas exactamente como o fixeches?
Agora tes que atopar o xeito de compartilo. Isto pode levar días, incluso semanas, se estás a compartir un deseño bastante complexo.
Non hai razón para esperar para facer os prototipos da túa aplicación web. Créaos agora con Dabblet.
Arrastra e solta elementos, estilo e gárdao. Envíao a un deseñador para que o revise ou simplemente cópiao nunha presentación. As posibilidades son infinitas.
Que é Dabblet?
Uso incursionar, pode experimentar con pequenos fragmentos de código CSS e HTML en tempo real.
Non necesitarás ningún prefixo no teu código CSS ao usar isto. Os datos xerais de GitHub permítenche almacenar o teu contido, publicalo noutros sitios e compartilo con outros.
Esta é unha boa forma de compartir fragmentos de código con outros desenvolvedores e obter comentarios.
Como funciona?
Tan pronto como se escribe o código, a saída visual é visible ao instante encima del. JavaScript é a única exención, tendo en conta que sería irritante executalo en cada pulsación de tecla e ata pode provocar que o navegador se volva inutilizable en determinadas situacións.
Usando a opción "Executar JS" na pestana JavaScript ou o atallo de teclado (Ctrl + Intro ou Cmd + Intro) executarase JavaScript cando se execute un Dabblet. O menú de opcións permítelle modificar este estilo.
Como programador, pode cambiar entre codificar nos tres idiomas ao mesmo tempo ou ver o produto acabado.
características
A continuación móstranse as características de Dabblet que debes coñecer:
Edición rápida de CSS: Podes engadir, editar e eliminar rapidamente propiedades CSS. Os cambios reflectiranse na páxina en tempo real.
Resaltado de sintaxe: O código CSS e HTML están destacados de sintaxe, o que facilita a súa lectura e comprensión. O código tamén se validará mentres escriba. Tamén podes optar por ocultar a caixa de código se o prefires.
Autocompletar: Dabblet ofrece autocompletado para propiedades e valores CSS. Isto pode ser moi útil cando estás creando ou editando follas de estilo.
Follas de estilo CSS predefinidas: Podes acceder a follas de estilo CSS preconstruídas desde sitios web populares. Estes pódense usar para engadir estilos de forma rápida e sinxela ao teu propio sitio web.
Apoio xeral: Dabblet admite GitHub Gists, o que che permite almacenar e compartir os teus fragmentos de código con outras persoas facilmente.
Vista previa en directo: Podes ver os resultados dos cambios no teu código en tempo real sen volver cargar a páxina. Por exemplo, se cambia a cor dun texto, verá o cambio reflectido no texto mentres escribe.
Atallos de teclado: Dabblet ten atallos de teclado para tarefas comúns, como engadir unha nova regra de estilo ou comentar.
Modos de visualización múltiples: Dabblet ofrece varios modos de visualización, que che permiten ver o código e os resultados de xeito lado a lado ou encima e debaixo uns dos outros.
Pros
- CSS rápido
- Aínda que teñas a sesión iniciada, podes gardar o modo de incógnito.
- Visualizadores de valores CSS en liña para varios parámetros como ángulos, cores, duración, etc.
- Todo está en XHR, polo que a páxina nunca se actualiza, nin sequera cando gardas.
- Atallos de teclado en abundancia.
- Todo o código ten formato automático (agás para o rebaixa).
- Documentación sólida desde o principio.
Contra
- A interface é un pouco abrumadora ao principio, pero te acostumas.
- Non hai funcións de xestión a nivel de proxecto (aínda).
Integracións Dabblet
Calquera plataforma debe integrarse con outros servizos e Dabblet non é unha excepción. As seguintes son algunhas das integracións que ofrece Dabblet:
Google Analytics
Podes engadir facilmente o teu código de seguimento de Google Analytics ás páxinas de Dabblet. Isto permitirache facer un seguimento das páxinas vistas e outras estatísticas para o teu Dabblet.
Ubuntu
Dabblet pódese usar para crear temas de Ubuntu. Podes crear un novo Dabblet, engadir código CSS e HTML e previsualizar o tema nun navegador web.
DigitalOcean
Unha empresa de hospedaxe na nube única ofrece servizos de computación na nube ás empresas, o que lles permite facer crecer as súas operacións de forma máis eficiente.
Que fai Dabblet con iso?
Agora podes crear, xestionar e implementar os teus Dabblets Espazos Digital Ocean.
Isto permíteche manter todos os teus fragmentos de código nun só lugar e facilita que os compartas con outras persoas.
Alternativas para Dabblets
As alternativas sempre están presentes e, na mesma liña, aquí tes algunhas para que reflexiones cando se trata de Dabblet:
Pastebin.com
Os programadores xeralmente usan o sitio web para gardar o código fonte ou fragmentos de datos de configuración. Non obstante, calquera pode poñer calquera texto no espazo previsto.
JS Bin
JS Bin é unha ferramenta de proba gratuíta para JavaScript. O resultado pódese compartir a través dun URL curto unha vez que se introduza Javascript nun panel e HTML no outro. Fai uso dun menú que che permite seleccionar entre algunhas das bibliotecas JS máis utilizadas.
CssDeck
Esta ferramenta é excelente para crear e intercambiar casos de proba con outras persoas que che poden axudar nos teus esforzos de codificación. Con varias opcións, podes incluso colaborar en proxectos de forma instantánea con outros programadores.
Plunker
Plunker é unha plataforma dixital onde os desenvolvedores web poden facer unha chuvia de ideas, colaborar e compartir os seus pensamentos.
Por exemplo, podes comezar cun "Ola, mundo!" programa en calquera idioma e engade fragmentos de código, rebaixas e capturas de pantalla para crear unha experiencia de aprendizaxe rica.
Palabra Final
En conclusión, Dabblet é unha ferramenta útil para os desenvolvedores web, especialmente aqueles que buscan formas de facelo de forma rápida e sinxela proba o seu código.
Coas súas diversas funcións e integracións, é difícil non atopar un uso para esta plataforma.
Proba hoxe!
Deixe unha resposta