Desenvolvemento FrontEnd: CodePen ou texto sublime?

CodePen ou texto sublime?
CodePen ou texto sublime? Se falamos de programación web, o nome de HTML, CSS e JavaScript chéganos de inmediato. Hai varias formas de chegar. Mesmo, se abrimos un bloc de notas podemos comezar a traballar escribindo "html". É certo que para ver o resultado do que está a programar desde un pad, necesitará un laborioso procedemento para notar o progreso.

Estes sitios son os principais parques infantís para os desenvolvedores de aplicacións para os usuarios do día. Para saber máis sobre as vantaxes e desvantaxes destes programas, imos analizalos neste artigo (polo menos, todo o que sabemos). Como sempre digo, seguro que algúns de vós aquí coñecedes máis o tema. Se é así, comenta todo o que aquí se nos escapa. Estaremos encantados de discutir!

Hoxe imos analizar CodePen, JSBin, Plunkr, sublime, CSSDeck, Dabblet e LiveWeave. Cales son as ferramentas máis coñecidas e as máis empregadas neste contorno. Hai máis, por suposto.

Pero para todos os que non sabedes de que vai o FrontEnd ou o BackEnd, expliquemos un pouco. A interface ou interface é a parte visual que o usuario navegante poderá ver na web. O BackEnd será a parte que controla o administrador do sitio. Na programación, se introduce código a través dunha ferramenta que mostra simultaneamente o resultado, chamarase front-end.

CodePen

Para moitos a ferramenta máis completa de todo o que falamos. Utilízase como unha ferramenta web que é o máis parecido a unha comunidade para amosar o seu traballo. Unha especie de youtube do programador. Nesta, poderás ver o traballo dos programadores afiliados á web e contactar con eles por se tes algún interese, ver o seu perfil, seguilos nas redes e incluso subscribirte á súa canle para ver todos os seus proxectos futuros.

Presentación de contido, soporte e atallos de teclado

A presentación CodePen é a máis interesantePorque con só uns poucos clics, podes traballar de inmediato. Con liñas moi ben separadas de html, css e javascript. Ademais da parte visual, que podes intercalar cara arriba e abaixo para ver con claridade o teu progreso. Axudando así a diferenciar ben cada lingua. Algo que resulta moi útil para os programadores máis recentes.

O seu soporte web, faino máis soportable cando se quere comezar a usar algo que realmente non sabemos moi ben. Iso non significa que sexa mellor para ti, depende das necesidades que teñamos. Pero si, para coñecer un pouco mellor o entorno antes de comprometernos a instalar calquera cousa no ordenador de orixe "descoñecida".

Se es dos que está acostumado a usar Casi totalmente teclado cando traballas, CodePen será marabilloso para ti. Outras ferramentas precisan plugins para poder empregar atallos de teclado para encher o entorno. Isto fai que o traballo sexa un pouco máis incómodo (aínda que igual de efectivo unha vez instalado). CP. integra de serie un sistema que che fará cubrir as mesmas liñas de código que se repiten, como podería ser nunha lista. Escribe como quere que apareza a lista e fai clic en Tab.

A versión Pro tamén permite moitas máis opcións por un prezo de 9,00 € para o paquete básico a 29,25 € para o paquete "Super". Poder actualizar simultaneamente en varios dispositivos o que facemos nun. Tamén un modo cooperativo, un "modo profesor", etc. Benefíciate se queres aquí.

JSBin

JSBin é unha ferramenta que poderiamos cualificar como directa. Unha vez que acceda ao seu dominio web, estará listo para comezar a elaborar o seu próximo proxecto sen demora. E aínda que a súa primeira posta en escena non é moi atractiva, é cómoda.

JSBin é sinxelo, coa estrutura básica creada en html para non perder tempo, intercalarase entre os diferentes idiomas para completar o traballo. Primeiro hai HTML, despois CSS, Javascript e finalmente o teu traballo visual. E aínda que pareza máis difícil, terá o mesmo tipo de atallos sen instalar nada. Directamente dende o navegador.

Non obstante, resultoume máis incómodo ver o código correctamente, unha vez que está oculto debido ás seguintes columnas. Xa que, co portátil, debes renunciar ou baixar co trackpad e non é moi fluído.

Só ten dúas cotas, de balde ou de pago. Isto é un pouco máis caro que CodePen, aínda que se o pagas anualmente é máis rendible se podes pagar 120 €.

CSSDeck

CSSDeck
O ambiente de traballo de CSSDeck é diferente da vista anterior. Dividido só en dúas columnas, de código visual, CSSDeck funciona con 3 filas cara abaixo coas que divide os diferentes tipos de linguaxe. Cunha presentación en forma de rede social e un ambiente de traballo máis limpo en cor clara. Parece unha ferramenta sinxela. Aínda que ás veces iso non significa que sexa negativo.

Con máis de sesenta mil usuarios rexistrados e máis de douscentos cincuenta mil proxectos creados, buscar e atopar o que queiras non será difícil. O idioma coma sempre, se pode ser un inconveniente para os que non saben inglés, pero neste rede social A imaxe é moi importante, polo que non creo que sexa un gran reto.

Plunkr

Plunkr é a ferramenta menos atractiva que atopei ata o de agora. A presentación está aglutinada en mensaxes e falta de imaxes. A carga de contido é lenta e non é moi útil a primeira vista. Ademais, a orde por data fai que calquera calendario, por moi sinxelo que poida, estea na primeira posición. Para ver algo máis interesante debes ir á pestana que di: «máis Vistas«. É dicir, se non o traduciu con Google antes.

Di tamén que segundo a web, están na versión 1.0.0. Entón isto explica un pouco o deseño, a presentación e os posibles erros que atopas ao navegar pola web.

Como vantaxe, se quedas sen ideas, non terás que deixar nin abrir outra pestana en Plunkr, xa que directamente dende a barra lateral dereita podes camiñar con outros proxectos e velos ao instante. Isto fará que sexa máis doado recompilar ideas rápidas e aplicalas ao seu proxecto ao mesmo tempo.

Dabblet

Dabblet é unha ferramenta sinxela, entras e creas. Aínda que podes rexistrarte e ter o teu nome de usuario a través de GitHub, non é algo que destaque moito na web. Cun fondo nun gradiente de amarelo a vermello, na parte visual e un fondo branco na parte do código (como é normal), preséntase o proxecto Dabblet, aínda que pode cambialo desde a pestana CSS. Para min, é mellor telo en branco, xa que ese gradiente todo o que dá é un pouco vida a

Cando esteas editando, podes configurar as pestanas que ves facilmente. Incluso tamén se desexa cambiar a columnas ou filas para unha visualización cómoda dependendo da persoa que estea editando. Cambiar o tamaño da letra, gardar como anónimo sen rexistrar ou validar o código HTML son máis posibilidades que Dabblet ofrece a primeira vista. Aínda que non é a primeira opción que escollería, pode ser ter en conta en futuras versións se se actualizan.

Unha das cousas que menos me gustou, pero que poden gustar aos grandes programadores, é iso non tes a opción de tabular unha etiqueta e que a escriba ela mesma. É dicir, pon HTML e fai clic na pestana e escribe "html" e "/ html" automaticamente. Algo que nas outras aplicacións se está feito.

LiveWeave

liveweave
LiveWeave É moi similar aos demais, non ten nada que os demais non poidan ofrecer en termos de utilidade. O que destacamos deste proxecto é o seu deseño, unha cor escura semellante a CodePen pero cunha distribución cadrada. Poder cambiar o tamaño probar. Tamén está o modo claro e o «fóra de liña« onde o código que editas non se reflectirá no visual ata que o actives. Non é unha característica que che pareza moi útil, xa que como deseñador, é importante ver sempre o que editas en tempo real, pero alguén atopará algún uso seguro. E aínda que, coma sempre, podes rexistrarte, o usuario non ten un papel principal. Xa que, aínda que non te rexistres, podes gardar o teu proxecto.

Texto Sublime

Esta ferramenta É totalmente diferente do que viu ata agora na análise. Sublime Text non é como un recurso web, senón como unha aplicación. Por unha banda, seguramente é máis útil telo no escritorio. Especialmente debido a posibles fallos ou conxelacións de internet por exceso e a posible perda de traballo. Por outra banda, non é unha ferramenta tan visual como as anteriores. Ademais de non ter a posibilidade dunha comunidade para compartir proxectos.

Aquí todo é de cero. Debe crear pestanas para colocar as liñas de código e renomealas para saber cal é. Se o primeiro é HTML, o segundo CSS ... ou viceversa. Tampouco ten atallos para o que será completamente manual, agás as comiñas.

Conclusión

Todos os programas son similares con certos toques persoais de cada empresa que levan a ter pros e contras neles. Cada un escollerá o que mellor lle conveña, a miña recomendación é usar CodePen ou CSSDeck para o medio ambiente e a rede social que manexa. Pero, se che gustou outro máis, deixa un comentario e explica as túas razóns, seguramente serán útiles.


O contido do artigo adhírese aos nosos principios de ética editorial. Para informar dun erro faga clic en aquí.

Sexa o primeiro en opinar sobre

Deixa o teu comentario

Enderezo de correo electrónico non será publicado. Os campos obrigatorios están marcados con *

*

*

  1. Responsable dos datos: Miguel Ángel Gatón
  2. Finalidade dos datos: controlar SPAM, xestión de comentarios.
  3. Lexitimación: o seu consentimento
  4. Comunicación dos datos: os datos non serán comunicados a terceiros salvo obrigación legal.
  5. Almacenamento de datos: base de datos aloxada por Occentus Networks (UE)
  6. Dereitos: en calquera momento pode limitar, recuperar e eliminar a súa información.