\n Todo nace del c\u00f3digo para un desarrollador, por lo que es natural comenzar con la mejor herramienta de edici\u00f3n que pueda encontrar. Komodo Edit es bastante kosher por todo eso y m\u00e1s. Es un buen editor de texto multiplataforma y multiling\u00fce para que escribas y edites tu c\u00f3digo. Ah, y es gratis.\n<\/p>\n
\n La herramienta funciona en Windows, Mac, Linux\/UNIX, as\u00ed que no te preocupes. Tambi\u00e9n nos gusta por su funci\u00f3n de autocompletado de c\u00f3digo para lenguajes como HTML, CSS, JavaScript, Java, PHP, Ruby, Perl (para las 5 o m\u00e1s personas en el mundo), etc. Ese es un editor de texto inteligente.\n<\/p>\n
\n Puntos de bonificaci\u00f3n para mayor comodidad de la funci\u00f3n Project Manager para organizar y realizar un seguimiento de los archivos.\n<\/p>\n
\n 2 Creador de CSS 3.0
\n<\/h5>\n
\n \n Seamos honestos, a pesar de todo lo que amas de CSS3, no puedes evitar odiarlo un poco cuando se trata de escribir sintaxis para cosas como bordes redondeados. Es un detalle tan trivial perder el sue\u00f1o, pero lo haces de todos modos. No puedes memorizar m\u00e1s de 100 propiedades nuevas y sus respectivos prefijos. Entonces, gracias al Se\u00f1or por una herramienta como CSS 3.0 Maker.\n<\/p>\n \n Esta peque\u00f1a e ingeniosa herramienta en l\u00ednea le permitir\u00e1 copiar y pegar c\u00f3digo enga\u00f1oso en su hoja de estilo. Genera c\u00f3digo para detalles de estilo como radios de cuadros, degradados, texto y sombras de cuadros, transformaciones, transiciones y rotaciones de su elecci\u00f3n. Tambi\u00e9n mostrar\u00e1 qu\u00e9 navegadores de escritorio y m\u00f3viles admiten esas propiedades de estilo. Una peque\u00f1a \u00e1rea de vista previa mostrar\u00e1 el efecto, el c\u00f3digo se puede copiar desde el cuadro de vista o descargar dentro de un archivo HTML.\n<\/p>\n \n Para aquellos de nosotros que no podemos dedicar demasiado tiempo a detalles de estilo aparentemente banales, esta herramienta es un salvavidas.\n<\/p>\n \n \n \u00ab\u00a1Lib\u00e9rate del infierno de los prefijos CSS!\u00bb: p\u00e1gina de introducci\u00f3n sin prefijos.\n<\/p>\n \n Esta es una herramienta sensata, tra\u00edda para liberarnos del ‘infierno de prefijos' por un \u00e1ngel llamado Lea Verou de Github. Agregar\u00e1 el prefijo del proveedor (en alg\u00fan lugar que no pueda ver) a las hojas de estilo\n<\/p>\no elementos. Adem\u00e1s: no tendr\u00e1 que preocuparse por los elementos nuevos\no , los prefijos de jQuery \n \u00bfQue es no gustar?\n<\/p>\n \n \n ‘Lorem Ipsum' ha sido el texto de marcador de posici\u00f3n durante demasiado tiempo. Afortunadamente, ahora tenemos Blokk: La fuente para poner fin al ‘dolor' del lat\u00edn incomprensible.\n<\/p>\n \n Blokk le brinda un bloque de ‘texto' para usar como marcador de posici\u00f3n al crear maquetas y estructuras al\u00e1mbricas. Tambi\u00e9n es evidente que no confundir\u00e1 a los clientes menos expertos en la web durante las presentaciones.\n<\/p>\n \n \n Antes de que las fuentes de \u00edconos se convirtieran en algo, los desarrolladores ten\u00edan que contar con la ayuda de dise\u00f1adores para crear \u00edconos escalables. El tiempo que llev\u00f3 desarrollarlos (que, por cierto, incluye la creaci\u00f3n, extracci\u00f3n, implementaci\u00f3n y personalizaci\u00f3n) bordeaba lo ‘absolutamente rid\u00edculo'. Pero luego alguien convirti\u00f3 \u00edconos en fuentes y todos vivieron felices… en el futuro previsible.\n<\/p>\n \n Fontello es un gran generador de fuentes de iconos. Le permitir\u00e1 elegir entre miles de \u00edconos, personalizar su mapeo o editar sus nombres, y compilarlos en un solo archivo de fuente. Es incre\u00edble y es gratis.\n<\/p>\n \n No podemos agradecer lo suficiente a Vitaly Puzrin.\n<\/p>\n \n \n Active el JavaScript de su navegador y comience a probar c\u00f3mo se ver\u00e1 el tipo de letra elegido en un sitio real.\n<\/p>\n \n Typetester es sencillo. Le permite ingresar y comparar diferentes fuentes y probar su apariencia. Tambi\u00e9n puede jugar con el tama\u00f1o, el seguimiento, el color, etc. hasta que obtenga lo que desea. Puede comparar hasta 36 tipos de letra diferentes a la vez. Imagina la cantidad de tiempo que puedes ahorrar con eso.\n<\/p>\n \n Es genial.\n<\/p>\n \n \n La codificaci\u00f3n puede ser un poco agotadora a veces, pero la limpieza de c\u00f3digo existe en Level: Utter Tedium. Sin embargo, es necesario si desea evitar errores y cargar m\u00e1s r\u00e1pido.\n<\/p>\n \n Dirty Markup ayuda a ahorrar el tiempo que de otro modo podr\u00eda dedicar a realizar actividades m\u00e1s interesantes (s\u00e1ndwich de tocino, \u00bfalguien?). Este viene con capacidades combinadas de otras herramientas de limpieza de sintaxis \u00fanica. Estamos hablando de HTML Tidy, CSS Tidy, JS Beautify y Ace Editor. Ese es un limpiador completo.\n<\/p>\n \n Es una aplicaci\u00f3n basada en la web para limpiar y formatear su HTML, CSS y JavaScript. No podemos pedir m\u00e1s.\n<\/p>\n \n \n Es posible que te conviertas en un justiciero que mata insectos con esta poderosa herramienta.\n<\/p>\n \n BugHerd sigue el antiguo adagio de ‘Mant\u00e9ngalo corto y simple, est\u00fapido'. Puede capturar los comentarios de los clientes, resolver problemas menores por s\u00ed mismo, rastrear errores (para que los extermine). Tambi\u00e9n har\u00e1s de secretaria y gestionar\u00e1s tus proyectos.\n<\/p>\n \n Una interfaz de usuario s\u00faper f\u00e1cil de apuntar y hacer clic en su sitio permite a sus usuarios informar problemas. BugHerd los convierte en informes con toda la informaci\u00f3n que pueda necesitar (como la versi\u00f3n del navegador del usuario). Es f\u00e1cil de configurar, divertido de usar y tiene caracter\u00edsticas como capturas de pantalla autom\u00e1ticas (extensi\u00f3n del navegador), enlaces directos, archivos adjuntos, datos completos del selector y debates.\n<\/p>\n \n Con una suscripci\u00f3n est\u00e1ndar de $ 29 \/ mes, eso es una trampa.\n<\/p>\n \n \n El dise\u00f1o web receptivo es m\u00e1s que una nueva moda, ya que lleg\u00f3 para quedarse. Pero por ahora, encontrar\u00e1 que los dise\u00f1os fluidos son complicados en el mejor de los casos. Tambi\u00e9n se encontrar\u00e1 con una ira violenta tratando de probar su dise\u00f1o en varios tama\u00f1os de pantalla.\n<\/p>\n \n Afortunadamente, Screenfly es una peque\u00f1a aplicaci\u00f3n web agradable que probar\u00e1 sus consultas de @media por usted. Ingresa su URL y mostrar\u00e1 c\u00f3mo sus consultas manejan las dimensiones del dispositivo en el que est\u00e1 haciendo clic en el panel superior.\n<\/p>\n \n No tiene en cuenta la diferencia de representaci\u00f3n entre los navegadores, pero puede usar las capturas de navegador para eso. De lo contrario, es una forma simple y bellamente ensamblada de ver c\u00f3mo se ve su sitio en diferentes resoluciones.\n<\/p>\n \n \n Ya que estamos hablando de RWD, tambi\u00e9n podr\u00edamos comenzar a hablar de marcos para desarrollarlo.\n<\/p>\n \n El debate en Internet contin\u00faa sobre qu\u00e9 marco front-end es mejor: \u00bfBootstrap o Foundation? Puedes usar uno u otro. Pero Foundation est\u00e1 un poco m\u00e1s a la vanguardia cuando se trata de sistemas de cuadr\u00edcula, unidades proporcionales para el dise\u00f1o (aunque Bootstrap 4.0 Alpha se ha movido a unidades em y rem), soporte de derecha a izquierda, tablas de precios, recorridos y navegaci\u00f3n fuera del lienzo. .\n<\/p>\n \n Es obvio que preferimos Foundation. Funciona con SASS y CSS, est\u00e1 repleto de funciones y, en general, es m\u00e1s conveniente y flexible.\n<\/p>\n \n Estamos de acuerdo con Zurb en esto: es ‘locamente r\u00e1pido'.\n<\/p>\n \n \n Despu\u00e9s de una d\u00e9cada de software que puso el dise\u00f1o antes que el c\u00f3digo, Adobe finalmente les da a los programadores un Edge.\n<\/p>\n \n Esta variedad de herramientas y servicios francamente asombrosa se crea teniendo en cuenta las nuevas tendencias de codificaci\u00f3n de front-end. Nos tienen todo un lujo. Edge Animate para ayudar a los codificadores a crear animaciones y al mismo tiempo erradicar todos los rastros de Flash. Lo siento Adobe, Flash fue genial. Pero Animate usa HTML y JavaScript est\u00e1ndar, y ya sabes, una talla \u00fanica para todos…\n<\/p>\n \n Hay Edge Code para editar CSS desde dentro de un documento HTML. Inspect consolida la prueba del navegador y las pruebas de compatibilidad del dispositivo para un dise\u00f1o receptivo, y las sincroniza todas para una actualizaci\u00f3n\/personalizaci\u00f3n s\u00faper r\u00e1pida. El inmensamente popular Typekit ahora es parte de la familia Edge. Reflow a\u00fan no se ha lanzado, pero probablemente dejar\u00e1 fuera del agua a otros creadores de cuadr\u00edculas de CSS de front-end. Y a\u00fan hay m\u00e1s.\n<\/p>\n \n Sabemos. Tuvimos que levantar nuestras mand\u00edbulas del suelo tambi\u00e9n.\n<\/p>\n \n \n Vagrant es mucho m\u00e1s que un software de desarrollo virtual.\n<\/p>\n \n Esta belleza le permite crear entornos de trabajo port\u00e1tiles y f\u00e1cilmente reproducibles. Consolida el software de virtualizaci\u00f3n, la caja base del servidor y las herramientas de configuraci\u00f3n en un paquete poderoso. B\u00e1sicamente, ya no tienes que tener VirtualBox + Ubuntu + Chef. Vagrant har\u00e1 el trabajo de los tres y ocupar\u00e1 menos espacio mientras lo hace. Los usuarios avanzados tambi\u00e9n le dir\u00e1n c\u00f3mo le permite configurar f\u00e1cilmente redes de m\u00e1quinas virtuales m\u00faltiples.\n<\/p>\n \n Est\u00e1 escrito en Ruby, pero funcionar\u00e1 para PHP, Java, JavaScript, Python y C#. Puede trabajar con Vagrant en Windows, Mac OSX, Linux y FreeBSD.\n<\/p>\n \n Es superr\u00e1pido porque no tiene nada de U-friendly-I que se ve bien pero ocupa el espacio que tanto necesita. Funciona bien como un entorno de prueba para los desarrolladores.\n<\/p>\n \n Eso es lo m\u00e1s cerca que podemos estar del Santo Grial.\n<\/p>\n \n \n PageSpeed \u200b\u200bInsights de Google hace exactamente lo que dice en la lata. Le brinda informaci\u00f3n sobre el rendimiento del front-end de su p\u00e1gina. Eso ser\u00e1 una revelaci\u00f3n para muchos desarrolladores importantes y poderosos. As\u00ed que haz una fiesta de carcajadas y comienza la calvicie acelerada de todo el cabello que se va a tirar.\n<\/p>\n \n Todo lo que hace es medir el tiempo transcurrido entre: la solicitud y la presentaci\u00f3n del contenido de la mitad superior de la p\u00e1gina, y la solicitud y la presentaci\u00f3n de la p\u00e1gina completa.\n<\/p>\n \n Verificar\u00e1 los aspectos independientes de la red para calcular el rendimiento de su p\u00e1gina: configuraci\u00f3n del servidor, estructura HTML, JavaScript, CSS e im\u00e1genes.\n<\/p>\n \n Es afilado como una navaja y despiadadamente r\u00e1pido; as\u00ed que definitivamente herir\u00e1 tus sentimientos y muy posiblemente te har\u00e1 llorar si obtienes una puntuaci\u00f3n baja. Tambi\u00e9n intentar\u00e1 compensarlo d\u00e1ndote sugerencias precisas para mejorar tu desempe\u00f1o, como un padre condescendiente.\n<\/p>\n \n Y nos encanta.\n<\/p>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844581a0a86.webp\")
<\/a>\n<\/p>\n\n 3 \u2013sin prefijo
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844583d44dd.webp\")
<\/a>\n<\/p>\n.css()<\/code>o cualquier cambio que realice, porque lo cubrir\u00e1 todo.<\/p>\n\n 4 libras de bloque
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445861b498.webp\")
<\/a>\n<\/p>\n\n 5 Fontello
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445880da58.webp\")
<\/a>\n<\/p>\n\n 6 Pruebas de tipo
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384458ad95f3.webp\")
<\/a>\n<\/p>\n\n 7 marcado sucio
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384458e305ed.webp\")
<\/a>\n<\/p>\n\n 8 manada de insectos
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844590dfd3c.webp\")
<\/a>\n<\/p>\n\n 9 Mosca de pantalla
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844592db210.webp\")
<\/a>\n<\/p>\n\n 10 Fundaci\u00f3n
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459574e29.webp\")
<\/a>\n<\/p>\n\n 11 borde de adobe
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844597e33a5.webp\")
<\/a>\n<\/p>\n\n 12 vagabundo
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459a1429e.webp\")
<\/a>\n<\/p>\n\n 13 Perspectivas de PageSpeed
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459ca2be9.webp\")
<\/a>\n<\/p>\n\n 14 git
\n<\/h5>\n
![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459f578c6.webp\")
<\/a>\n<\/p>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445a2c069a.webp\")
<\/a>\n<\/p>\n