Recurso fresco para desarrolladores web - abril de 2017
Desde el comienzo del año 2017, muchas cosas han cambiado en el mundo del desarrollo web, con nuevas aplicaciones y recursos cada dos días . Continuando con la tendencia, hoy les comparto un par de nuevos recursos de desarrollo web.
Estos recursos incluyen una aplicación web que te ayudará a aprender el nuevo módulo nativo CSS Grid, un curso que te ayudará a aprender Reaccionar desde el principio, una referencia para aprender algunos patrones de diseño PHP para mejorar tus códigos PHP y algunos más. Vamos a verlos.
Haga clic para obtener más recursosHaga clic para obtener más recursos
Encuentre toda nuestra colección de recursos recomendados y las mejores herramientas de diseño y desarrollo web disponibles.
Seductor
Un complemento de Sketch que le permite exportar su Artboard a la plantilla de correo electrónico HTML con un simple clic. Slinky se encuentra actualmente en la etapa de desarrollo activo, sin embargo, todavía hay algunas cosas que son difíciles en los bordes. Por lo tanto, siga las instrucciones para obtener el mejor resultado posible .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017.jpg)
Un directorio curado de plantillas repetitivas y plantillas para ayudarlo a comenzar un proyecto rápidamente. Contiene una lista de repetidores de numerosos lenguajes y marcos, incluidos jQuery, Angular, React, WordPress, Backbone y Electron .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-2.jpg)
CSS Grid es la próxima gran novedad que cambiará la forma en que organizamos el diseño y usamos los marcos de grillas para construir el sitio web. Sin embargo, dada la complejidad, usar CSS Grid puede ser abrumador para algunos usuarios . En tal caso, esta práctica aplicación web, Griddy, puede ser muy útil para aprender CSS Grid .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-3.jpg)
Estoy aprendiendo React en el momento de escribir y encontré un excelente curso donde puedes aprender React como principiante. El curso consiste en videos, artículos y cuestionarios. ¿Y mencioné que este curso es absolutamente gratis ?
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-4.jpg)
Chassis es una configuración de máquina virtual diseñada para crear un ecosistema de WordPress como Themes and Plugins. Le permitirá administrar visualmente las instalaciones del chasis. En el momento de escribir, Chassis todavía está en la fase de desarrollo, pero será lanzado pronto .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-5.jpg)
Una colección de tamaños de papel estándar utilizados en diferentes países, incluidos los de uso común en Japón, Francia y Canadá. Es un gran recurso que los diseñadores y desarrolladores web deberían marcar .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-6.jpg)
Una buena biblioteca de JavaScript para crear Tooltip, TippyJS viene con una gran cantidad de configuraciones para configurar cómo la información sobre herramientas debería aparecer y comportarse. Es 'temaable' de forma que puedes personalizar el aspecto fácilmente a través de CSS . Los desarrolladores apreciarán especialmente la "devolución de llamada" que proporciona.
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-7.jpg)
Comprender el patrón de diseño de un lenguaje de programación puede ayudar a producir códigos que no solo funcionan sino que también son escalables y fáciles de mantener. Si estás en PHP, este es uno de los tutoriales que debes considerar .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-8.jpg)
Guzzle es una útil biblioteca PHP para realizar solicitudes HTTP con varios métodos como "GET", "POST" e incluso solicitudes Async similares a JavaScript. Viene con una gran cantidad de métodos de funciones donde se obtiene fácilmente la respuesta de la solicitud realizada, incluido el encabezado de respuesta , el cuerpo y el código de estado .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-9.jpg)
Mini es un marco CSS con una huella mínima . Y como los otros marcos, se envía con una serie de componentes web, como cuadrícula, navegación, tabla, etc.
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-10.jpg)
Una colección de íconos de compañías y marcas, desde las más populares como eBay, Viber, Dribble y Google+ hasta las más populares como Gitter, Kirby, Viadeo. Los iconos vienen en formato SVG y pueden ser un gran recurso tanto para diseñadores como para desarrolladores.
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-11.jpg)
Una extensión de Chrome para administrar su base de datos MySQL . Es una excelente alternativa a aplicaciones como Sequel Pro y MySQL Workbence.
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-12.jpg)
Numi es una aplicación de calculadora simple, hermosa y única para Mac. Simplemente escriba "10USD en SGD" y obtendrá el resultado!
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-13.jpg)
Una configuración Docker para ejecutar Laravel . Laradock es compatible con varios motores de base de datos que incluyen MariaDB y MongoDB, así como Cache Engines como Redis y Memchaced. A pesar de que lleva el nombre de Laravel, puede usarlo para otros marcos o plataformas como WordPress y Drupal también.
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-14.jpg)
Fabrica es una colección de herramientas para desarrollar WordPress de principio a fin . Fabrica utiliza Docker para ejecutarlo rápidamente y para configurar el entorno de desarrollo y utiliza WordMove para la implementación .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-15.jpg)
Husky es un módulo de Nodo que nos permite ejecutar githooks como pre-commit
, pre-receive
y post-receive
.
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-16.jpg)
EasyMap hace que sea absolutamente fácil renderizar y agregar marcadores en Google Maps . Simplemente agregue su clave API de Google Maps y proporcione la dirección de ubicación en formato JSON y listo.
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-17.jpg)
Una práctica extensión de Chrome para ver qué herramientas, servidores y bibliotecas está usando un sitio web . Con esta herramienta, descubrí que todavía hay muchos sitios web populares que usan jQuery, incluso uno como Github .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-18.jpg)
Bash Guide, como su nombre lo indica, es una guía útil para líneas de comando básicas . Un gran recurso para desarrolladores web que recién comienzan con Terminal y Command Lines .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-19.jpg)
Chroma.js es una biblioteca de JavaScript para manipular colores . Admite muchos formatos de color, incluidos HEX, RGB y RGBA. Además de eso, también puedes manipular los colores por el brillo, el contraste y la saturación .
![](http://hideout-lastation.com/img/tech-design-tips/426/fresh-resource-web-developers-april-2017-20.jpg)
![Compruebe el rendimiento y la calidad de cualquier sitio web con Faro](http://hideout-lastation.com/img/tech-design-tips/339/check-performance-quality-any-website-with-lighthouse.jpg)
Compruebe el rendimiento y la calidad de cualquier sitio web con Faro
Google está a la vanguardia del diseño web moderno. Ofrece tantas herramientas desde Analytics hasta DevTools, todo con el objetivo de ayudar a las personas a crear una mejor web.Recientemente publicó otra herramienta útil llamada Lighthouse. Esta es una herramienta gratuita de prueba automatizada que se ejecuta en segundo plano de Chrome . Fu
![Vecteezy tiene un editor de vectores basado en el navegador bastante fresco y es gratuito](http://hideout-lastation.com/img/tech-design-tips/400/vecteezy-has-pretty-cool-browser-based-vector-editor.jpg)
Vecteezy tiene un editor de vectores basado en el navegador bastante fresco y es gratuito
No hay escasez de sitios web de vectores gratuitos para ayudar a los diseñadores a encontrar gráficos escalables de calidad . Pero hay un recurso, Vecteezy, que simplemente dio un paso más con su propia herramienta de edición vectorial en el navegador .Con Vecteezy Editor, puede construir cualquier vector que desee directamente desde su navegador web, y lo mejor de todo es que es completamente gratis .No