En 2020, dejé mi trabajo y me quedé en casa, teniendo mucho tiempo cada día. Entonces, comencé a desarrollar algunas herramientas relacionadas con el desarrollo, con el objetivo de resolver problemas encontrados durante el desarrollo o ayudar a obtener una comprensión más profunda de ciertos conceptos técnicos.

Escribiendo pequeñas herramientas todos los días, el tiempo pasaba día a día. Mirando hacia atrás, esta experiencia fue bastante interesante.

Al principio, la interfaz de usuario de estas herramientas era bastante rudimentaria. Sin embargo, a medida que pasó el tiempo, mejoré continuamente su apariencia. Aunque es posible que todavía no se consideren exquisitos, han logrado avances significativos.

Para ser honesto, estas herramientas tienen muy poca guía y documentación para el usuario, más bien como mi propio pequeño mundo. A través de los datos de Google Analytics, descubrí que es posible que algunas herramientas solo me tengan a mí como usuario, como el alojamiento de microimágenes. Pero precisamente porque las uso yo mismo, aunque la frecuencia de agregar nuevas herramientas ha disminuido recientemente, las he mantenido constantemente.

Lo que me hace sentir gratificado es que envié algunas de estas herramientas al blog del Sr. Ruan Yifeng y muchas de las pequeñas herramientas recibieron su recomendación. Esto fue un gran estímulo para mí.

Algunas herramientas relacionadas con principios detallados

Estas herramientas están diseñadas para ayudar a los desarrolladores a obtener una comprensión más profunda de algunos conceptos básicos y principios subyacentes.

Conversión de punto flotante IEEE754

Esta herramienta puede ayudarle a comprender la representación interna de números de punto flotante de doble precisión en el estándar IEEE 754. Puede convertir números decimales a su representación binaria correspondiente, mostrando claramente el bit de signo, los bits de exponente y los bits de mantisa. Esto es muy útil para comprender cómo las computadoras manejan números de punto flotante.

Según el estándar IEEE754, la conversión de punto flotante para Infinity es: todos los bits de exponente son 1, todos los bits de mantisa son 0.

Aquí está la conversión de punto flotante para Infinity:

Según el estándar IEEE754, la conversión de punto flotante para 0 es: el bit de signo es 0, todos los bits de exponente son 0, todos los bits de mantisa son 0.

Aquí está la conversión de punto flotante para 0:

Conversión de codificación UTF-8

UTF-8 es una codificación de caracteres de longitud variable. Esta herramienta puede ayudarle a comprender cómo se codifican los caracteres Unicode en UTF-8. Puede ingresar cualquier carácter Unicode y la herramienta mostrará su representación binaria codificada en UTF-8, lo que le permitirá ver visualmente el proceso de codificación.

Conversión de codificación Base64

Base64 es un método de codificación comúnmente utilizado, especialmente cuando se trata de datos binarios. Esta herramienta no sólo le ayuda a comprender los principios de la codificación Base64, sino que también proporciona funciones prácticas de codificación y decodificación. Es particularmente útil para escenarios donde es necesario transmitir datos binarios en un entorno de texto.

Detección de tipo de archivo

Esta herramienta puede ayudarle a comprender cómo determinar los tipos de archivos mediante números mágicos de archivos. Puede cargar un archivo y la herramienta leerá los datos binarios del archivo y determinará el tipo de archivo según el número mágico. Esto es muy útil cuando se trata de archivos desconocidos o se verifican tipos de archivos.

Por ejemplo, JPEG se identifica porque su Número Mágico es FF D8 FF DB

Imagen relacionada

El procesamiento de imágenes es un aspecto importante del desarrollo web. A continuación se muestran algunas herramientas relacionadas con el procesamiento de imágenes.

Microimagen

Esta es una herramienta de compresión de imágenes rápida que puede ayudarlo a reducir el tamaño de los archivos de imagen sin reducir significativamente la calidad de la imagen.

Admite varios formatos de imagen y no tiene limitaciones en cuanto a tamaño o cantidad de archivos. Esta herramienta es particularmente útil para optimizar la velocidad de carga del sitio web.

Lo más importante es que se implementa utilizando tecnologías frontend, que no requieren costos de servidor, por lo que no necesita preocuparse por problemas de privacidad. Su implementación es similar a squoosh, ambos aprovechan WebAssembly.

Alojamiento de microimágenes

Esta es una herramienta de alojamiento de imágenes personales que le permite utilizar un repositorio de GitHub como su servidor de imágenes personal. Proporciona funciones sencillas de carga y administración, lo que le permite hacer referencia a imágenes en artículos o páginas web. Esta es una herramienta muy práctica para desarrolladores que frecuentemente necesitan compartir imágenes en línea.

Compartir imagen

Esta herramienta puede ayudarte a generar rápidamente imágenes con texto, adecuadas para compartir en redes sociales o crear carteles simples. Simplifica el proceso de combinación de texto e imágenes, lo que le permite crear imágenes atractivas sin utilizar software de edición de imágenes complejo.

Marcador de posición de imagen

Esta es una herramienta generadora de marcadores de posición de imágenes que puede crear rápidamente imágenes de marcadores de posición en colores y tamaños personalizados, muy adecuada para usar durante el proceso de desarrollo. Puede ayudarle a mantener la integridad del diseño de la página cuando las imágenes reales aún no están listas.

Codificación y cifrado

En el desarrollo web, a menudo necesitamos lidiar con varias codificaciones y cifrados. Aquí hay algunas herramientas relacionadas:

Codificación de URL

Esta herramienta puede ayudarle a realizar la codificación y decodificación de URL, lo cual es muy útil para manejar URL que contienen caracteres especiales. Puede garantizar que sus URL se transmitan y analicen correctamente en diversos entornos.

Codificación de entidades HTML

La herramienta de codificación de entidades HTML puede ayudarle a convertir caracteres especiales en entidades HTML, garantizando que se muestren correctamente en HTML. Esto es importante para prevenir ataques XSS y garantizar la representación correcta de documentos HTML.

Generador de hash

Esta herramienta puede generar varios valores hash de uso común, incluidos MD5, SHA1, SHA256, etc. Es muy útil en escenarios como la verificación de la integridad de los datos y el almacenamiento de contraseñas.

Herramientas de color

El color es un elemento importante en el diseño web. A continuación se muestran algunas herramientas relacionadas con el color:

Conversión de color

Esta herramienta puede convertir entre diferentes modelos de color como RGB, HSL, CMYK, etc. Puede ayudar a los diseñadores y desarrolladores a cambiar libremente entre diferentes métodos de representación de color.

Generador de paletas

Esta herramienta puede ayudarte a generar matices y matices de colores, muy adecuada para crear temas de colores consistentes. Le permite crear rápidamente combinaciones de colores armoniosas, mejorando la eficiencia del diseño.

Calculadora de relación de contraste

Esta herramienta puede calcular la relación de contraste entre dos colores, lo que le ayuda a garantizar la legibilidad del texto en los fondos. Es muy importante para crear diseños que cumplan con los estándares de accesibilidad.

Conclusión

Aunque es posible que algunas herramientas solo las utilice yo mismo, es este proceso continuo de aprendizaje y creación lo que me hace sentir realizado y feliz.

Continuaré manteniendo y mejorando estas herramientas, y daré la bienvenida a todos para que las utilicen y proporcionen comentarios.