Saltar al contenido

Recursos nuevos para diseñadores y desarrolladores web (julio de 2021)

UI Glass Generator

Como desarrollador web, siempre hay algo que puedes aprender y crecer todos los días. Puede aprender los principios de diseño, la experiencia del usuario, el diseño de la interfaz de usuario y el comportamiento del usuario a través de datos analíticos. O puede ramificarse usted mismo en servidores, como instalar y ejecutar un paquete de servidor usted mismo.

En esta ronda de la serie, hemos reunido diferentes recursos de herramientas, podcasts, artículos y mucho más donde puede aprender múltiples disciplinas más allá de la creación del sitio web en sí. ¡Empecemos!

Recursos nuevos para diseñadores y desarrolladores web (junio de 2021)

Recursos nuevos para diseñadores y desarrolladores web (junio de 2021)

Ser un desarrollador web significa un aprendizaje constante a medida que el campo sigue evolucionando con nuevas actualizaciones en cada … Lee mas

Generador de vidrio UI

La interfaz de usuario vidriosa está regresando. Podemos ver que ahora es una parte integral del nuevo diseño de interfaz en Windows y macOS. Gracias a la última función de CSS, también podemos adoptar una interfaz similar para el sitio web, y esta herramienta hará que sea aún más fácil y rápido crear una.

Usted puede use la GUI para ajustar el color, la opacidad y el fondo de su sitio web y generará el CSS que puedes copiar y pegar.

Generador de vidrio UI

Tema VS Code Fortnite

A Tema inspirado en Fortnite para Visual Studio Code. Viene con algunos efectos especiales al habilitar el Fortnite: habilitar legendario opción. Si disfrutas del juego y las bengalas mientras codificas, este tema de VSCode es para ti.

Tema VS Code Fortnith

MakerStations

Este sitio recopila configuraciones de escritorio de varios profesionales (diseñadores, desarrolladores, escritores, etc.). No solo los presenta como inspiración, sino que también profundiza en las personalidades y razones detrás de la configuración.

Si actualmente está buscando inspiración para su nueva configuración de escritorio, no busque más. Seguramente encontrarás algunos buenos en MakerStations.

MakerStations

React.js ARIA

Una colección de funciones de React.js que ayuda a crear componentes de interfaz de usuario y sistemas de diseño accesibles para su aplicación web.

Está diseñado para brindar la mejor experiencia interactiva posible a los usuarios, ya sea que estén usando un teclado, mouse o dispositivo de asistencia. Es una gran iniciativa de Adobe para mejorar la web.

React.js ARIA

Biblioteca de pruebas de React Hooks

Hooks es un concepto en React.js para crear componentes menos rígidos y podemos crear ganchos personalizados además de los que se proporcionan integrados.

Ahora bien, si se ha encontrado con una situación en la que le gustaría realizar una prueba automatizada para el gancho personalizado, esta biblioteca será útil. Proporciona el patrón para probar su gancho React.js personalizado tan cerca como cuando se usa dentro de un componente real.

Biblioteca de pruebas de React Hooks

Tarjeta WiFi

Esta herramienta hace compartir credenciales WiFi más conveniente usando código QR. Simplemente debe ingresar el nombre de WiFi y la contraseña. Imprímelo y adjúntalo en algún lugar de la habitación.

tarjeta ifi

Umami

Umami es una aplicación de código abierto para recopilar datos analíticos. Es fácil de instalar en su propio servidor o VPS con requisitos mínimos. Solo necesita Node.js y MySQL (o PostgreSQL). Es una gran aplicación si está buscando un alternativa a Google Analytics donde posee y controla todos los datos.

Umami

El Podcast de CSS

Dirigido por el dúo de Google Developer Advocates, Una Kravets y Adam Argyle, aprenderá mucho sobre CSS; desde consejos prácticos, accesibilidad, rendimiento y mucho más. Es una de las fuentes de mejor calidad para aprender CSS y desarrollo web en general.

El Podcast de CSS

Fosscard

Discordia está aumentando como un herramienta de comunicación interactiva para comunidades. Puede unirse a varios grupos, incluidos grupos de desarrollo y programación web, para chatear con la comunidad o hacer una llamada de voz o video.

Sin embargo, Discord es un SaaS. Si está buscando un alojamiento propio donde pueda tener más control, Fosscard puede ser una buena alternativa.

Fosscard

Código limpio PHP

Una coleccion de consejos para escribir códigos PHP que sean legibles, reutilizables y, lo más importante, mantenibles. Es un gran recurso donde puede aprender algunos consejos prácticos; por ejemplo, cómo nombrar mejor las variables, cómo estructurar el bloque condicional y cómo nombrar una función y los argumentos, por nombrar algunos.

Código limpio PHP

MiniCLI

Una pequeña Biblioteca PHP para construir la interfaz de línea de comandos (CLI). Proporciona la estructura base para registrar sus líneas de comando personalizadas, así como las funciones de ayuda y utilidad para manejar la entrada y la salida del usuario. Un gran comienzo para crear una línea de comandos basada en PHP.

MiniCLI

Uniforme CSS

A generador y marco CSS de utilidad primero construido con Sass. Es una mezcla de lo bueno de ambos mundos en la que puede aprovechar la flexibilidad del flujo de trabajo de la utilidad primero mientras sigue teniendo el poder de Sass, como las variables, las combinaciones y las funciones.

Uniforme CSS

Generador de diseño

Un herramienta en línea para generar un diseño base para su sitio web. Utiliza Grid para el diseño y proporciona GUI para generar el diseño. Por ejemplo, puedes establecer el número de columnas, filas y alineaciones. Creo que es una forma más intuitiva de generar un diseño con CSS Grid.

Generador de diseño

Fower

La metodología CSS de utilidad primero se está volviendo bastante popular. Ofrece flexibilidad para ser escalable en sitios web pequeños o grandes. Si le gusta escribir CSS en JS para su aplicación web y se inclina a enfoque CSS de utilidad primero para componer los estilos, es posible que le interese probar esta biblioteca.

Fower es agnóstico del marco para que pueda aplicarlo en varios marcos como React.js, Vue.js y Svelt, o JavaScript simple.

Fower

RTL WTF

Una gran fuente para aprender consejos, casos de uso y mejores prácticas para crear un sitio web para la dirección de escritura de derecha a izquierda, como árabe y hebreo. Este sitio web debe estar en su marcador.

RTL WTF

Notistack

Una biblioteca React.js que facilita la visualización de notificaciones de «tostadas» en su aplicación web. Es altamente configurable que le permite presentar la mejor experiencia de usuario posible.

Por nombrar algunos, puedes establecer el número máximo de notificaciones, evite duplicados al no mostrar notificaciones con el mismo mensaje y establezca el tipo de transición.

RTL WTF

Kopio

Un Aplicación de servidor de código abierto que puede utilizar para ejecutar y administrar copias de seguridad en sus propios servidores en la nube.. Kopia también proporciona una buena aplicación de escritorio que se ejecuta en Windows, macOS y Linux, donde puede administrarla cómodamente, como para crear una instantánea y restaurar la instantánea.

Kopio

DevTools de componentes web

Web Component le permite crear un componente personalizado que el navegador pueda comprender y representar. Si se ha encontrado con la necesidad de crear un componente web personalizado, necesitará esta extensión de Chrome que le permite depurar el componente web en el navegador.

DevTools de componentes web

Tipografía fluida

Una pequeña herramienta útil para crear un tamaño de texto que se adapte al tamaño de la ventana. La herramienta te ayuda a generar el estilo que permite que el texto de tu sitio web se vea genial y proporcional en cualquier pantalla.

Tipografía fluida

MillionJS

Una pequeña biblioteca de JavaScript (menos de 1 KB) para crear un interfaz de usuario interactiva para su sitio web. Implementa Virtual DOM detrás de escena y algunos enfoques únicos que hacen que sea rápido para renderizar en el navegador.

Creo que puede ser un buena alternativa a algunos marcos más establecidos como React.js y Vue.js, especialmente si solo necesita lo básico de Virtual DOM.

MillionJS