Nuevos recursos para diseñadores web y desarrolladores (mayo de 2020)

Si es diseñador web o desarrollador y desea aprovechar al máximo su tiempo libre, eche un vistazo a esta ronda de la serie Fresh Resources.

En esta lista, encontrará un par de referencias para ejemplos de código y recetas, códigos de una sola línea y artículos que estoy seguro le enseñarán un par de trucos nuevos para mejorar sus habilidades de codificación. Entonces, sin más preámbulos, entremos.

CSS Doodle

Utilizando Web Component, esta pequeña biblioteca le permite crear patrones no convencionales fácilmente usando solo la sintaxis CSS.

Gráfico circular y el ejemplo de código CSS Doodle

Microsoft Edge DevTools

Esta herramienta permite a los desarrolladores depurar un sitio web que se ejecuta de forma remota en una computadora con Windows. Esto lo convierte en una herramienta bastante útil para los desarrolladores que administran múltiples sitios web que se ejecutan en una red local.

Eliminar la instalación de herramientas para MS Edge

Colores jajaja

Si alguna vez ha sentido curiosidad por los nombres de algunos colores en particular, debe consultar esta colección de colores. Colors LOL presenta paletas de colores definidas con nombres de colores excesivamente descriptivos que hacen que los colores suenen súper interesantes.

Colores con más nombre descriptivo

Rosetta

Una biblioteca simple para internacionalizar su contenido web definido en JavaScript. Presenta una API simple y fácil de seguir, funciona en navegadores modernos (excepto Internet Explorer, desafortunadamente) y tiene un tamaño de menos de 300 bytes.

El logo de Rosetta

Iosevka

Iosevka es una familia de fuentes monoespaciales de código abierto. Cubre más de 3000 caracteres, más de 6000 glifos y admite más de 150 idiomas. Está diseñado para una alta legibilidad, lo que lo convierte en una fuente perfecta para escribir código, usarlo en Terminales y para documentos técnicos.

HTMLDOM

Una colección de fragmentos de código y tutoriales para manejar el Modelo de objetos de documentos HTML (DOM) con JavaScript puro. Puede encontrar algunas técnicas básicas como verificar si un elemento tiene clase, agregar o quitar clase de un elemento, o agregar un elemento nuevo a trucos más avanzados, como hacer que un elemento sea arrastrable y redimensionable.

CSS de desbordamiento

En este artículo, Ahmad Shadeed nos muestra los detalles sobre cómo funciona el "Desbordamiento" de CSS y lo aplica en algunos ejemplos del mundo real. Una gran referencia para repasar su comprensión en CSS.

Excalidraw

Una herramienta útil para crear bocetos virtuales con una sensación dibujada a mano. La herramienta actualmente presenta varios tipos de formas, incluyendo el rectángulo, el diamante, el círculo, la línea y la flecha. Puede cambiar el tamaño o rotar libremente estas formas y cambiar sus colores, por lo que es una gran herramienta para la creación rápida de prototipos.

Glimpse Editor (no funciona)

Glimpse Editor es GIMP, una herramienta de edición gráfica gratuita, fork. El proyecto se centra en mejorar la experiencia del usuario en el editor y su objetivo es convertirlo en una alternativa gratuita popular de los pagos. Glimpse Editor actualmente funciona en Linux y Windows.

MVP.css

Una colección de reglas CSS que aplican estilos HTML estandarizados básicos en todo el navegador. A diferencia de las bibliotecas CSS similares, MVP.css le permite personalizar algunas cosas, como los colores y el radio del borde a través de las variables CSS.

Themer

Una herramienta para generar un tema de color para editores (por ejemplo, Visual Studio Code, Atom, Sublime Text), terminales (por ejemplo, Hyper, iTerm, GNOME Terminal) y algunas aplicaciones específicas (por ejemplo, Slack, Alfred, Firefox, Chrome, etc.). Una gran herramienta si desea generar colores consistentes en sus entornos de desarrollo.

Entradas para definir los colores del tema.

Marco de administrador de activos

Un complemento útil para personalizar el comportamiento de la biblioteca de medios en WordPress. Por ejemplo, si busca la imagen desde una fuente externa, el complemento ya realiza la mayor parte del trabajo pesado, por lo que puede usar una API simple para agregar su personalización.

Biblioteca multimedia de WordPress que muestra imágenes de gatos

Cliente PHP API de Google

Una biblioteca PHP mantenida oficialmente por Google que le permite conectarse a las API de Google, como Gmail, Books, YouTube y otras. Esta es la biblioteca correcta si está buscando integrar su aplicación PHP a algunos servicios de Google.

Docker Mailserver

Configurar un servidor de correo por su cuenta puede ser desalentador. Pero si su aplicación se ejecuta en un contenedor Docker, puede ponerla en funcionamiento en segundos con esta imagen Docker. Admite varios protocolos estándar para trabajar con correos electrónicos listos para usar, incluidos SMTP, POP3 e IMAP4.

Expo

Un conjunto de herramientas que permite crear una aplicación nativa para Android, iOS y la Web utilizando un único código fuente. Tener un único código fuente para sus aplicaciones multiplataforma hace que sea rápido y fácil agregar o cambiar características en todas las plataformas. Además, es más económico ya que no necesita contratar a 3 equipos diferentes de desarrolladores para trabajar en cada plataforma.

1Loc

Una colección de fragmentos de código de una línea de JavaScript para operaciones comunes. Aquí puede ver una lista de colecciones categorizadas para trabajar con DOM, DateTime, String, Arrays, Number y todo en una sola línea de código.

CSS de patrón

Una biblioteca CSS para crear patrones. Actualmente proporciona varios patrones, como patrón marcado, punto, triángulo, zig-zag y rayas, etc., por nombrar algunos. Estos patrones funcionarán en todos los navegadores, incluidos Internet Explorer 10 y 11.

Muestras de cromo

Una lista de ejemplos de código de trabajo (principalmente JavaScript) para funciones o API implementada en las versiones de Chrome. Este es un gran recurso para mantenerse al día con las nuevas actualizaciones y ver cómo funcionan.

Titiritero Webperf

Una colección de recetas de código para automatizar pruebas de rendimiento con Puppeteer. Aquí puede encontrar códigos para obtener métricas de rendimiento en tiempo de ejecución, generar informes de Lighthouse y probar su sitio con JavaScript deshabilitado, etc.

Bashtop

Un monitor de utilidad Bash para monitorear recursos, uso y estadísticas de procesador, memoria, discos, red y otros procesos en Linux. Puede ser similar al top pero aporta varios toques agradables, como una mejor interfaz de usuario, capacidad de filtrar procesos y gráficos para el uso de la red, por nombrar algunos.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *