Some Developer Tools I&#ve Created

2020年，我辭掉工作，待在家裡，每天都有充足的時間。於是，我開始開發一些開發相關的工具，旨在解決開發過程中遇到的問題或幫助更深入地理解某些技術概念。

每天寫小工具，時間一天天過去。現在回想起來，這段經歷其實還蠻有趣的。

一開始，這些工具的 UI 確實相當簡陋。然而，隨著時間的推移，我不斷地改善他們的外表。雖然現在可能還稱不上精緻，但已經有了很大的進步。

說實話，這些工具的使用者指導和文件很少，更像是我自己的小世界。透過Google Analytics數據，我發現有些工具可能只有我自己作為用戶，例如微圖託管。但正是因為我自己使用它們，儘管最近添加新工具的頻率有所減少，但我一直在維護它們。

讓我感到欣慰的是，我把其中的一些工具提交到了阮一峰老師的博客上，很多小工具都得到了他的推薦。這對我來說是很大的鼓勵。

一些與深入原理相關的工具

這些工具旨在幫助開發者更深入地了解一些基本概念和底層原理。

IEEE754 浮點轉換

該工具可以幫助您了解 IEEE 754 標準中雙精度浮點數的內部表示。它可以將十進制數轉換為相應的二進位表示形式，清楚地顯示符號位、指數位和尾數位。這對於理解電腦如何處理浮點數非常有幫助。

根據IEEE754標準，Infinity的浮點轉換為：所有指數位均為1，所有尾數位元均為0。

這是 Infinity 的浮點轉換：

依IEEE754標準，0的浮點轉換為：符號位為0，指數位全部為0，尾數位全部為0。

這是 0 的浮點轉換：

UTF-8編碼轉換

UTF-8 是一種可變長度字元編碼。該工具可以幫助您了解 Unicode 字元如何編碼為 UTF-8。您可以輸入任何 Unicode 字符，該工具將顯示其 UTF-8 編碼的二進位表示，讓您直觀地看到編碼過程。

Base64編碼轉換

Base64 是一種常用的編碼方法，尤其是在處理二進位資料時。此工具不僅可以幫助您了解Base64編碼原理，還提供方便的編碼和解碼功能。對於需要在文字環境下傳輸二進位資料的場景特別有用。

文件類型檢測

這個工具可以幫助您了解如何透過檔案幻數來確定檔案類型。您可以上傳文件，該工具將讀取文件的二進位資料並根據幻數確定文件類型。這在處理未知文件或驗證文件類型時非常有用。

例如JPEG被辨識是因為它的Magic Number是FF D8 FF DB

圖片相關

影像處理是Web開發的重要面向。這裡有一些與影像處理相關的工具。

微型影像

這是一個快速的影像壓縮工具，可以幫助您減少影像檔案的大小，而不會顯著降低影像品質。

它支援各種圖像格式，並且對檔案大小或數量沒有限制。這個工具對於優化網站載入速度特別有幫助。

最重要的是，它是使用前端技術實現的，不需要伺服器成本，因此您無需擔心隱私問題。它的實現與squoosh類似，都利用WebAssembly。

Micro Image Hosting

This is a personal image hosting tool that allows you to use a GitHub repository as your personal image host. It provides simple upload and management functions, making it convenient for you to reference images in articles or web pages. This is a very practical tool for developers who frequently need to share images online.

Image Share

This tool can help you quickly generate images with text, suitable for social media sharing or creating simple posters. It simplifies the process of combining text and images, allowing you to create attractive images without using complex image editing software.

Image Placeholder

This is an image placeholder generator tool that can quickly create custom-sized and colored placeholder images, very suitable for use during the development process. It can help you maintain the integrity of page layout when actual images are not yet ready.

Encoding and Encryption

In Web development, we often need to deal with various encodings and encryptions. Here are some related tools:

URL Encoding

This tool can help you perform URL encoding and decoding, which is very useful for handling URLs containing special characters. It can ensure that your URLs are correctly transmitted and parsed in various environments.

HTML Entity Encoding

The HTML entity encoding tool can help you convert special characters to HTML entities, ensuring they display correctly in HTML. This is important for preventing XSS attacks and ensuring correct rendering of HTML documents.

Hash Generator

This tool can generate various commonly used hash values, including MD5, SHA1, SHA256, etc. It is very useful in scenarios such as data integrity verification and password storage.

Color Tools

Color is an important element in Web design. Here are some color-related tools:

Color Conversion

This tool can convert between different color models such as RGB, HSL, CMYK, etc. It can help designers and developers switch freely between different color representation methods.

Palette Generator

This tool can help you generate tints and shades of colors, very suitable for creating consistent color themes. It allows you to quickly build harmonious color schemes, improving design efficiency.

Contrast Ratio Calculator

This tool can calculate the contrast ratio between two colors, helping you ensure the readability of text on backgrounds. It is very important for creating designs that meet accessibility standards.

Conclusion

Although some tools might only be used by myself, it is this continuous process of learning and creation that makes me feel fulfilled and happy.

I will continue to maintain and improve these tools, and welcome everyone to use them and provide feedback.

The above is the detailed content of Some Developer Tools I&#ve Created. For more information, please follow other related articles on the PHP Chinese website!