¡Estamos a finales de 2021! El tiempo realmente vuela y el mundo actualmente está tratando de recuperarse de los efectos de la pandemia. Pero todavía estamos aquí para presentar las mejores herramientas a nuestros compañeros desarrolladores y diseñadores web. En esta ronda de la serie, presentamos varias herramientas relacionadas con CSS, JavaScripty algo herramientas web Esto te ayudara ser más productivo como desarrollador web. Avancemos para ver la lista completa.
Nuevas funciones para diseñadores y desarrolladores web (noviembre de 2021)
Nuevas funciones para diseñadores y desarrolladores web (noviembre de 2021)
Una cosa que me encanta de la industria del desarrollo web es que nosotros, como desarrolladores, seguimos innovando para hacer … Leer más
simulación de faro
Una herramienta web que le permite probar el rendimiento del sitio con Faro de Google. Simula el sitio web a varias velocidades de red que cubren la latencia y la velocidad del ancho de banda. El resultado mostrará el sitio de puntuación. FCP (primera pintura de contenido) y LCP (pintura de mayor contenido). Una herramienta útil para investigar y obtener una visión más amplia del rendimiento de su sitio.
velloso
Un cliente GraphQL para Vue.js. Tiene poco menos de 4 KB y está disponible como un componente de orden superior o gancho, lo que lo hace muy flexible para integrarlo en su aplicación Vue.js. Además, también es compatible Mecanografiado y suspender API sale de la caja.
meterse con el DNS
El DNS es uno de los temas en Internet que no es fácil de entender. Editar la entrada de DNS también puede ser aterrador porque puede hacer que su sitio se caiga durante días si de alguna manera está mal configurado. Ahí es donde entra en juego la herramienta Mess with DNS. Proporciona un campo de juego, un dominio ficticio, para experimentar con la configuración de DNS.
formas poligonales
Polygon Shape es un escaparate para demostrar la capacidad del clip-path de CSS para crear formas irregulares como un polígono, una estrella, una flor e incluso una mariposa.
diminutowow
Una colección de herramientas útiles para sus necesidades digitales diarias. Aquí puede encontrar una herramienta para convertir imágenes de HEIC a JPG y viceversa, SVG a PNG, recortar video, XML a JSON, convertir una época, fusionar archivos PDF e incluso crear un meme mucho más.
omatsuri
Otra colección que deberías marcar. Omatsuri contiene algunas herramientas útiles como una para generar triángulos con CSS, otra para generar sombras de color, convertir SVG a JSX, generador de lorem ipsum, generador de datos falsos y mucho más. Tanto los diseñadores como los desarrolladores apreciarán todos estos tipos de herramientas.
Búsqueda de herramientas
ToolHunt es una especie de curador de herramientas que recopila todo tipo de herramientas de diseño y desarrollo. Aquí puedes encontrar herramientas para diseñadores, desarrolladores, para colaborar o para mejorar la productividad. Algunos de los temas son gratuitos, premium o freemium. Es una gran fuente para encontrar nuevas herramientas o buscar inspiración para nuevos productos digitales.
MobbinDiseño
Una biblioteca de inspiración de diseño para aplicaciones móviles con más de 50 000 capturas de pantalla. Se pueden buscar y ordenar en categorías para que pueda encontrar fácilmente capturas de pantalla de aplicaciones populares como Facebook, Target, Airbnb, WSJ y muchas otras. Es una gran fuente para encontrar inspiración de UI/UX para aplicaciones móviles sin tener que instalar la aplicación.
CSS
CSS es una biblioteca para «optimizar» CSS. Elimina redundancias, comprime código (p. ej., transforma la sintaxis o los valores en sus abreviaturas) y crea reestructuraciones, como fusionar declaraciones, reglas, etc., lo que da como resultado una salida de estilos CSS mucho más pequeña. Puede ejecutarlo como una CLI independiente o integrarlo con bibliotecas y herramientas como Gulp, Grunt, Webpack y PostCSS.
RegexAprender
Esta herramienta tiene como objetivo hacer que el aprendizaje de RegEx sea más agradable y comprensible. Proporciona algunas lecciones interactivas para aprender RegEx que comienzan desde lo básico y lo llevarán al tema más avanzado a medida que complete cada lección. Definitivamente encontrará que es una de las mejores fuentes para aprender RegEx.
conocimiento fuente
Esta es una iniciativa de Google en colaboración con el equipo de Google Font y expertos en tipografía de clase mundial para presentar la mejor fuente para aprender Font. Estos son materiales detallados que normalmente solo puede obtener en las universidades, como tipografía básica, glosarios utilizados en tipografía, clasificación y más.
Tipografía fluida moderna
CSS ha recorrido un largo camino en los últimos años, incluida la forma en que maneja el tamaño de fuente en pantalla con abrazadera() ocupación. Esta función le permite establecer el tamaño de fuente mínimo y máximo en función del tamaño de pantalla actual. Y esta pequeña herramienta te permite generar el código para eso de una manera más intuitiva usando una buena GUI.
secuencia de gradiente
Una biblioteca de Node.js que facilita la generación de un degradado en la terminal/consola. Puede usar algunos degradados predefinidos o componer los suyos propios con varios colores, así como ajustar la posición en el degradado. Es una biblioteca útil para hacer una aplicación CLI mucho más atractiva.
estilo de polen
Una biblioteca de variables CSS. Estas variables contienen valores base para tipografía, diseño y colores. Es una base perfecta para un sistema de diseño con estilos consistentes y fácil mantenimiento.
Estilo de accesorios abiertos
Otra biblioteca de variables CSS que contiene estilos básicos como animación, colores, tipografía, degradados, tema oscuro y claro y más por venir. Esta es otra gran biblioteca si está buscando una base para construir un sistema de diseño de interfaz de usuario.
interfaz de usuario flotante
Una biblioteca de JavaScript para crear elementos posicionales flotantes. Por lo general, lo necesita para información sobre herramientas, menús desplegables, ventanas emergentes, etc. Admite posicionamiento primitivo como «izquierda», «derecha», «arriba» y «abajo», así como posicionamiento dinámico como seguir la posición de desplazamiento del navegador. Esta biblioteca maneja todo el trabajo pesado para que pueda concentrarse en ser más productivo.
Acto
¿Qué sucede si puede ejecutar la configuración de Github Actions directamente en su computadora? Eso es lo que esta herramienta está tratando de lograr, le permite ejecutarlo localmente en su computadora, lo que puede ser útil para probar la configuración o simplemente cuando su Internet no funciona.
hoja de trucos
PHP ha evolucionado mucho en los últimos años. Especialmente ahora, hay muchas sintaxis nuevas. Esta hoja de trucos muestra algunos fragmentos de código y comparaciones entre diferentes versiones de PHP. Es una buena referencia para mantenerlo actualizado con PHP moderno.
desarrollador ipsum
El texto de Lorem Ipsum no tiene por qué ser aburrido. En lugar de texto aleatorio, puede usar esta pequeña herramienta para generar texto ficticio que los desarrolladores puedan entender y relacionar.
Dinero
Una biblioteca PHP que facilita el formateo de moneda. Proporciona una API fácil e intuitiva para convertir a diferentes monedas, realizar aritmética y comparación y mucho más.