¿CodePen o Sublim Text? Si parlem de programació web se'ns ve de seguida el nom d'HTML, CSS i JavaScript. Hi ha diverses formes d'arribar a això. fins i tot, si obrim un bloc de notes podem posar-nos a treballar escrivint «html». És cert, que per veure el resultat del que vas programant des d'un bloc, necessitaràs d'un laboriós procediment per notar avanços.
Aquests llocs són les principals zones de joc per als desenvolupadors d'aplicacions per a usuaris del dia. Per conèixer més profundament els avantatges i desavantatges d'aquests programes anem a analitzar-los profundament en aquest article (al menys, tot el que sabem). Com sempre dic, segur que alguns d'aquí coneixeu més el tema. Si és així, comenteu tot el que se'ns escapi aquí. Estarem encantats de debatre!
Avui anem a analitzar CodePen, JSBin, Plunkr, sublim, CSSDeck, Dabblet i LiveWeave. Que són els més coneguts i les eines que més es fan servir en aquest entorn. Hi ha més, és clar.
Però per a tots els que no sapigueu de què tracta l'FrontEnd o backend, explicarem una mica. El Front-End o interfície és la part visual que l'usuari navegant podrà veure a la web. El backend, serà la part que controla l'administrador de el lloc. En programació, si el teu introdueixes codi a través d'una eina que mostren els resultats de forma simultània, això se li dirà front-end.
CodePen
Per a molts l'eina més completa de totes les que parlem. Usada com una eina web que és el més semblant a una comunitat per mostrar els teus treballs. Una mena de Youtube de programador. En aquest, podràs veure el treball dels programadors afiliats a la web i contactar amb ells per si tens algun interès, veure el seu perfil, seguir-lo en xarxes i fins i tot subscriure al seu canal per a visualitzar tots els seus futurs projectes.
Presentació de l'contingut, suport i dreceres de teclat
La presentació de CodePen és el més interessant, Ja que amb pocs clics, pots treballar en el procés immediatament. Amb línies molt ben separades de html, css i javascript. A més de la part visual, que podràs anar intercalant amunt i avall per veure clarament els teus progressos. Ajudant així a diferenciar bé cada llenguatge. Una cosa que va molt bé per a programadors més novells.
El seu suport web, Ho fa més suportable quan vols començar a fer servir alguna cosa que realment no coneixem molt bé. Això no vol dir que sigui millor per a un, depèn de les necessitats que tinguem. Però sí, per conèixer una mica millor l'entorn abans de comprometre'ns a instal·lar res a l'ordinador d'origen «desconegut».
Si ets dels que està acostumat a fer servir GAIREBÉ totalment el teclat quan treballes, CodePen et resultarà meravellós. Altres eines necessiten de plugins per poder usar dreceres de teclat per a omplir en l'entorn. Això fa una mica més incòmode el treball (encara que igual d'efectiu un cop instal·lat). CP. integra de sèrie un sistema que et farà omplir les mateixes línies de codi que es repeteixen, com podria ser en una llista. Escrius com vols que aparegui la llista i cliques Tab.
La versió Pro a més, permet moltes més opcions per un preu de 9,00 € el paquet bàsic fins 29,25 el paquet «Super». Podent actualitzar en diversos dispositius simultàniament el que fem en un. També una manera cooperativa, un "manera professor», etc. Benefíciaate si vols aquí.
JSBin
JSBin és una eina que podríem qualificar com directa. Ja que un cop et dirigeixes al seu domini web, aquesta, estarà a punt per començar a traçar el teu proper projecte, sense dilació. I encara que la seva primera posada en escena no resulti molt atractiva, si és còmoda.
JSBin resulta senzilla, amb l'estructura bàsica creada el html per no perdre temps, aniràs intercalant entre els diferents llenguatges per completar el treball. Primer està HTML, després CSS, Javascript i finalment el teu treball de forma visual. I encara que sembli més difícil tindràs els mateixos tipus de dreceres sense instal·lació de res. Directament des del navegador.
No obstant això, m'ha semblat més incòmode el fet de visionar el codi correctament, una vegada que s'oculta a causa de les columnes posteriors. Ja que, amb el portàtil, has de donar cap amunt o cap avall amb el trackpad i no va molt fluid.
Només té dues quotes, gratis o de pagament. Aquesta és una mica més car que CodePen, encara que si ho pagues anualment, et surt més rendible, si pots pagar 120 €.
CSSDeck
L'entorn de treball de CSSDeck és diferent a l'vist anteriorment. Dividit en dues columnes únicament, codi-visual, CSSDeck treballa amb 3 files cap avall amb les que divideix els diferents tipus de llenguatge. Amb una presentació en forma de xarxa social i un entorn de treball més net en color clar. Sí que sembla una eina simple. Encara que de vegades, això no vol dir que sigui negatiu.
Amb més de seixanta mil usuaris registrats i més de cents cinquanta mil projectes creats, buscar i trobar el que vols no et resultarà difícil. L'idioma com sempre, si pot ser un inconvenient per a aquells que no sàpiguen anglès, però en aquesta xarxa social prima molt la imatge, per la qual cosa no crec que sigui un gran desafiament.
Plunkr
Plunkr és l'eina menys atractiva que m'he trobat fins al moment. La presentació està aglutinada en missatges i falta d'imatges. La càrrega de l'contingut és una mica lenta i no resulta molt útil a simple vista. A més, l'ordenació per data, fa que qualsevol programació, per molt simple que sigui, pugui estar en primera posició. Per veure alguna cosa més interessant t'hauràs d'adreçar a la pestanya que posa: «Més vist«. Això, si no ho has traduït amb Google abans.
Dir també, que segons la web, són a la versió 1.0.0. Pel que això explica una mica el disseny, la presentació i els possibles errors que et trobis a l'anar navegant per la web.
Com avantatge, si et quedes sense idees, No hauràs de sortir ni obrir una altra pestanya en Plunkr, ja que directament des de la barra lateral dreta pots caminar amb altres projectes i visionar a l'instant. Això resultarà més còmode per recollir idees ràpides i aplicar-les al teu projecte en el mateix instant.
Dabblet
Dabblet és una eina simple, entres i creguis. Encara pots registrar i tenir el teu usuari a través de GitHub, no és una cosa que destaca molt en la web. Amb un fons en un degradat groc a vermell, a la part visual i un fons blanc a la part de codi (com és normal), es presenta el projecte de Dabblet, encara que podràs canviar-lo des de la pestanya de CSS. Per a mi, millor tenir-ho en blanc, ja que aquest degradat l'únic que dóna és una mica de vida a
Quan estàs editant, pots configurar les pestanyes que visualitzes fàcilment. Fins i tot també si vols canviar a columnes o files per a una visualització còmoda depenent de la persona que estigui editant. Canviar la mida de font, guardar com a anònim sense registrar-te o validar el codi HTML són més possibilitats que ofereix a primera vista Dabblet. Tot i que no és la primera opció que jo escolliria, si pot ser a tenir en compte en futures versions si van actualitzant-se.
Una de les coses que menys m'ha agradat, però que pot ser que agradi a grans programadors, és que no té l'opció d'tabular una etiqueta i que s'escrigui sola. És a dir, posar HTML i clicar a l'tabulador i que s'escrigui «html» i «/ html» automàticament. Una cosa que en les altres aplicacions si es fa.
LiveWeave
LiveWeave és molt similar als altres, no té res que no puguin oferir els altres pel que fa a utilitat ens referim. El que destaquem d'aquest projecte és el seu disseny, un color fosc similar CodePen però amb una distribució en quadre. Podent canviar la mida al gust. També hi ha el manera clara i la manera «fora de línia« on el codi que editis no es veurà reflectit en el visual, fins que el activis. No és una característica que vegi molt útil, com a dissenyador, és important sempre veure en temps real el que edites, però algú li trobarà alguna utilitat segur. I encara que, com sempre, puguis registrar-te, no manté un protagonisme l'usuari. Ja que, encara que no et registres, pots guardar el teu projecte.
Sublim Text
aquesta eina és totalment diferent al que hagis vist fins ara en l'anàlisi. Sublim Text no està com un recurs web, sinó com a aplicació. D'una banda segur que és més útil tenir-la a l'escriptori. Sobretot per les possibles caigudes d'internet o les congelacions per excés i la possible pèrdua de treball. D'altra banda, no és una eina tan visual com les anteriors. A més de tampoc tenir la possibilitat d'una comunitat per compartir projectes.
Aquí tot és des de zero. Hauràs crear pestanyes per col·locar les línies de codi i tornar a nomenar per saber quin és cada un. Si la primera és HTML, la segona CSS .. o a l'inrevés. Tampoc té dreceres per la qual cosa serà completament manual, excepte per les cometes.
Conclusió
Tots els programes són similars amb certs tocs personals de cada empresa que porten a tenir pros i contres en ells. Cadascun triarà el que més cregui que li convé, la meva recomanació és usar CodePen o CSSDeck per l'entorn i la xarxa social que maneja. Però, si t'ha agradat més un altre, deixa un comentari i explica els teus motius, segur que resultaran útils.