diff --git a/src/i18n/de.js b/src/i18n/de.js index 07307ad..46fba52 100644 --- a/src/i18n/de.js +++ b/src/i18n/de.js @@ -90,16 +90,6 @@ export default { text7: "✓ Kopiert", tpl8: "Max. Tiefe", }, - edu: { - heading1: "Was ist JSON?", - p1: "

JSON (JavaScript Object Notation) ist ein leichtgewichtiges Datenaustauschformat, das für Menschen leicht zu lesen und zu schreiben sowie für Maschinen leicht zu parsen und zu generieren ist. Es basiert auf einer Teilmenge des JavaScript-Programmierstandards. JSON ist ein textbasiertes Format, das vollständig sprachunabhängig ist, aber Konventionen verwendet, die Programmierern der C-Sprachfamilie vertraut sind.

Diese Eigenschaften machen JSON zu einer idealen Datenaustauschsprache für Webanwendungen, APIs und Konfigurationsdateien. Es hat sich zum De-facto-Standard für den Datenaustausch im Web entwickelt und XML weitgehend aufgrund seines kleineren Datenvolumens und besserer Performance verdrängt.

", - heading2: "So verwenden Sie dieses Tool", - p2: "
  1. Fügen Sie Ihre rohen oder unformatierten JSON-Daten in den linken Editor ein.
  2. Klicken Sie auf Format, um den Code mit korrekter Einrückung und Syntaxhervorhebung zu verschönern.
  3. Alternativ verwenden Sie Minify, um alle Leerzeichen für den Produktionseinsatz zu entfernen.
  4. Prüfen Sie die Statusanzeige, um sicherzustellen, dass Ihr JSON gültig ist; bei einem Fehler wird die genaue Zeile hervorgehoben.
  5. Klicken Sie auf Copy, um das formatierte Ergebnis in die Zwischenablage zu kopieren, oder auf Clear, um neu zu beginnen.
", - heading3: "Häufige Anwendungsfälle", - p3: "", - heading4: "Profi-Tipps", - p4: "", - }, }, "jwt-decoder": { name: "JWT-Inspektor", @@ -139,22 +129,6 @@ export default { status5: "Algorithmus: ", status6: "Decodierung fehlgeschlagen", }, - edu: { - heading1: "Was ist JWT?", - p1: "

JSON Web Token (JWT) ist ein offener Standard (RFC 7519), der eine kompakte und in sich geschlossene Methode zur sicheren Übertragung von Informationen zwischen Parteien als JSON-Objekt definiert. Diese Informationen können überprüft und als vertrauenswürdig eingestuft werden, da sie digital signiert sind. JWTs können mit einem geheimen Schlüssel (mit dem HMAC-Algorithmus) oder einem öffentlich-privaten Schlüsselpaar mittels RSA oder ECDSA signiert werden.

Aufgrund ihrer kompakten Größe werden JWTs häufig bei der Authentifizierung und beim Informationsaustausch verwendet, etwa als Bearer-Tokens in HTTP-Authorization-Headern.

", - heading2: "So verwenden Sie dieses Tool", - p2: "
  1. Token einfügen: Kopieren Sie Ihr codiertes JWT (header.payload.signature) und fügen Sie es in das Eingabefeld ein.
  2. Automatische Decodierung: Das Tool erkennt das Token automatisch und decodiert seine Bestandteile in Echtzeit.
  3. Header prüfen: Überprüfen Sie den Algorithmus (alg) und den Token-Typ (typ) im Header-Bereich.
  4. Payload analysieren: Untersuchen Sie die Claims wie Ablaufzeit (exp), Aussteller (iss) und Subjekt (sub) im Payload-Bereich.
  5. Claims überprüfen: Prüfen Sie das Claim-Analyse-Feld für lesbare Datumsangaben und den Validierungsstatus.
", - heading3: "Häufige Anwendungsfälle", - p3: "", - heading4: "Profi-Tipps", - p4: "", - heading5: "Token-Struktur (header.payload.signature)", - p5: "

Ein JWT besteht in der Regel aus drei durch Punkte getrennten Teilen:

", - heading6: "Sicherheitsaspekte", - p6: "

Obwohl JWTs signiert sind, um die Integrität sicherzustellen, sind sie in der Regel NICHT verschlüsselt. Das bedeutet, dass jeder, der das Token besitzt, den Header und den Payload decodieren kann, um die enthaltenen Informationen zu lesen. Speichern Sie niemals sensible Informationen wie Passwörter oder private Schlüssel in einem JWT-Payload.

Überprüfen Sie außerdem immer den exp-Claim (Ablaufzeit), um Replay-Angriffe zu verhindern, und stellen Sie sicher, dass Ihr Server die Signatur validiert, bevor er den Daten im Payload vertraut.

", - heading7: "Profi-Tipps", - p7: "", - }, cheatsheet: { title: "JWT-Kurzreferenz", h0: "Struktur", @@ -193,16 +167,6 @@ export default { text0: "✓ Kopiert!", tpl1: "GUID:", }, - edu: { - heading1: "Was ist eine UUID?", - p1: "Eine Universally Unique Identifier (UUID) ist eine 128-Bit-Zahl, die zur eindeutigen Identifizierung von Informationen in Computersystemen verwendet wird. Sie sind so konzipiert, dass sie unabhängig ohne zentrale Instanz generiert werden können, wobei die Kollisionswahrscheinlichkeit vernachlässigbar bleibt.", - heading2: "So verwenden Sie dieses Tool", - p2: "Wählen Sie die UUID-Version (v1 für zeitbasiert, v4 für zufällig) und die Anzahl der benötigten IDs. Klicken Sie auf Generate, um eine Liste eindeutiger Kennungen zu erstellen, die Sie in Ihrer Datenbank oder Anwendung verwenden können.", - heading3: "Häufige Anwendungsfälle", - p3: "Primärschlüssel in verteilten Datenbanken, Sitzungskennungen, Transaktionsverfolgung sowie die Benennung temporärer Dateien oder Ressourcen, bei denen Eindeutigkeit über mehrere Systeme hinweg entscheidend ist.", - heading4: "Profi-Tipps", - p4: "UUID v4 ist die gängigste Wahl für allgemeine eindeutige IDs, da sie auf hochwertiger Zufälligkeit beruht. Verwenden Sie v1, wenn Sie IDs nach dem Erstellungszeitpunkt sortieren möchten.", - }, }, "password-generator": { name: "Passwort-Generator", @@ -265,24 +229,6 @@ export default { status6: "Schwach", text1: "Bitte geben Sie eine gültige Basis-E-Mail-Adresse ein.", }, - edu: { - heading1: "Was macht ein Passwort sicher?", - p1: "

Ein sicheres Passwort ist Ihre erste Verteidigungslinie gegen unbefugten Zugriff. Im modernen Zeitalter der Hochgeschwindigkeitsrechner wird Sicherheit durch Entropie definiert – das Maß für Zufälligkeit und Unvorhersehbarkeit in einer Zeichenkette. Ein starkes Passwort sollte lang sein (mindestens 16 Zeichen), für jedes Konto einzigartig und aus einer vielfältigen Mischung von Zeichentypen bestehen, einschließlich Groß- und Kleinbuchstaben, Zahlen und Symbolen.

Vermeiden Sie die Verwendung persönlicher Informationen wie Geburtstage, Haustiernamen oder häufige Wörter aus dem Wörterbuch. Selbst komplex wirkende Ersetzungen wie P@ssw0rd123 werden von modernen Brute-Force-Tools leicht geknackt, die umfangreiche Wörterbücher mit gängigen Mustern verwenden.

", - heading2: "So verwenden Sie dieses Tool", - p2: "
  1. Modus wählen: Wählen Sie je nach Bedarf zwischen Passwort, Benutzername, Passphrase oder E-Mail-Alias.
  2. Länge anpassen: Verwenden Sie den Schieberegler, um die gewünschte Länge einzustellen. Für Passwörter werden 16+ Zeichen für hohe Sicherheit empfohlen.
  3. Optionen konfigurieren: Zeichensätze (Symbole, Zahlen usw.) oder Stile (lesbar vs. sicher) aktivieren oder deaktivieren.
  4. Generieren: Klicken Sie auf Generieren, um Ihr einzigartiges Anmeldedaten zu erstellen.
  5. Kopieren: Verwenden Sie das Kopiersymbol, um das Ergebnis sicher in die Zwischenablage oder Ihren Passwortmanager zu übertragen.
", - heading3: "Häufige Anwendungsfälle", - p3: "", - heading4: "Profi-Tipps", - p4: "", - heading5: "Was macht ein Passwort sicher?", - p5: "

Ein sicheres Passwort ist Ihre erste Verteidigungslinie gegen unbefugten Zugriff. Im modernen Zeitalter der Hochgeschwindigkeitsrechner wird Sicherheit durch Entropie definiert – das Maß für Zufälligkeit und Unvorhersehbarkeit in einer Zeichenkette. Ein starkes Passwort sollte lang sein (mindestens 16 Zeichen), für jedes Konto einzigartig und aus einer vielfältigen Mischung von Zeichentypen bestehen.

Vermeiden Sie die Verwendung persönlicher Informationen wie Geburtstage, Haustiernamen oder häufige Wörter aus dem Wörterbuch. Selbst komplex wirkende Ersetzungen wie P@ssw0rd123 werden von modernen Brute-Force-Tools leicht geknackt.

", - heading6: "Entropie erklärt", - p6: "

Entropie ist ein Maß für die Zufälligkeit und Unvorhersehbarkeit eines Passworts, typischerweise in Bits ausgedrückt. Je höher die Entropie, desto stärker das Passwort. Unser Generator berechnet die Entropie in Echtzeit, um Ihnen eine objektive Messung Ihrer Passwortstärke zu geben. Ein Passwort mit über 100 Bit Entropie gilt als außergewöhnlich stark.

", - heading7: "Bewährte Methoden", - p7: "", - heading8: "Profi-Tipps", - p8: "", - }, }, "hash-calculator": { name: "Hash-Rechner", @@ -350,16 +296,6 @@ export default { tpl4: "Warte auf Eingabe...", text2: "Berechnet: ", }, - edu: { - heading1: "Was ist Hashing?", - p1: "

Kryptografisches Hashing ist ein mathematischer Prozess, der beliebige Eingabedaten (Text oder Dateien) in eine Zeichenkette fester Länge umwandelt, typischerweise eine Hexadezimalzahl. Dieser Fingerabdruck ist für die Eingabe eindeutig; selbst eine einzige Bit-Änderung in den Quelldaten führt zu einem völlig anderen Hash — ein Phänomen, das als Lawineneffekt bekannt ist.

Im Gegensatz zur Verschlüsselung ist Hashing eine Einwegfunktion. Sie können einen Hash nicht umkehren, um die Originaldaten wiederherzustellen. Das macht es ideal, um die Datenintegrität zu überprüfen, Passwörter sicher zu speichern (in Kombination mit Salts) und Dateien zu identifizieren, ohne ihren Inhalt offenzulegen.

", - heading2: "So verwenden Sie dieses Tool", - p2: "
  1. Eingabetyp wählen: Wählen Sie den Tab Text für Zeichenketten oder den Tab File für lokale Dateien.
  2. Eingabe bereitstellen: Fügen Sie Ihren Text ein oder ziehen Sie Ihre Datei per Drag-and-Drop in den Arbeitsbereich.
  3. Optionales HMAC: Geben Sie einen geheimen Schlüssel im HMAC-Feld ein, wenn Sie einen geschlüsselten Hash zur Authentifizierung generieren müssen.
  4. Ergebnisse prüfen: Das Tool berechnet automatisch mehrere Hash-Varianten (SHA-256, SHA-512 usw.) in Echtzeit.
  5. Integrität verifizieren: Verwenden Sie den Tab Verify, um einen bekannten Hash mit Ihrer Eingabe zu vergleichen und Manipulationen zu erkennen.
", - heading3: "Häufige Anwendungsfälle", - p3: "", - heading4: "Profi-Tipps", - p4: "", - }, cheatsheet: { title: "Hash-Algorithmus-Referenz", h0: "Algorithmenvergleich", @@ -435,16 +371,6 @@ export default { text5: "Verwenden Sie mindestens /", text6: "IPv6 /", }, - edu: { - heading1: "Was ist CIDR?", - heading2: "So verwenden Sie dieses Tool", - heading3: "Häufige Anwendungsfälle", - heading4: "Profi-Tipps", - p1: "Classless Inter-Domain Routing (CIDR) ist eine Methode zur Zuweisung von IP-Adressen und IP-Routing. Es ersetzte das ältere klassenbasierte System (A, B und C), um mehr Flexibilität und Effizienz bei der Adressverteilung zu bieten.", - p2: "Geben Sie eine IP-Adresse mit einem Präfix ein (z.B. 192.168.1.0/24) oder verwenden Sie den Schieberegler, um die Präfixlänge anzupassen. Klicken Sie auf \"Run analysis\", um Netzwerkdetails, verwendbare Host-Bereiche und Binärdarstellungen zu sehen.", - p3: "Planung von Netzwerksubnetzen für Cloud-Infrastruktur (VPCs), Beheben von Routing-Problemen, Berechnung der Host-Kapazität für ein gegebenes Präfix und Konvertierung zwischen CIDR und Subnetzmasken.", - p4: "Beachten Sie, dass bei IPv4 die erste und letzte Adresse in einem Subnetz typischerweise für die Netzwerk-ID und die Broadcast-Adresse reserviert sind. Bei IPv6 sind Subnetze für Standard-Lokalnetze fast immer /64.", - }, cheatsheet: { title: "Subnetz-Kurzreferenz", h0: "Häufige Subnetze", @@ -619,16 +545,6 @@ export default { tpl3: "Standardwerte ändern:", tpl4: "Keine Ports gefunden, die Ihrer Suche entsprechen.", }, - edu: { - heading1: "Port-Kategorien & Sicherheitsleitfaden", - p1: "Well-Known-Ports (0-1023) werden von der IANA vergeben und erfordern auf Unix-Systemen Root-Rechte. Registrierte Ports (1024-49151) werden von Anwendungen verwendet. Dynamische/ephemere Ports (49152-65535) werden für clientseitige Verbindungen genutzt. Das Verständnis der Portbereiche ist essenziell für die Firewall-Konfiguration und Netzwerksicherheit.", - heading2: "So verwenden Sie dieses Tool", - p2: "Suchen Sie nach Portnummer oder Dienstname, um Protokolldetails und Risikostufen zu finden. Filtern Sie nach Kategorie (Well-Known, Registriert, Dynamisch) oder Protokoll (TCP/UDP), um die Ergebnisse einzugrenzen. Klicken Sie auf eine beliebige Zeile, um vollständige Details einschließlich häufiger Schwachstellen und Härtungsempfehlungen zu sehen.", - heading3: "Häufige Anwendungsfälle", - p3: "Konfiguration von Firewall-Regeln, Netzwerk-Fehlersuche, Identifizierung unerwarteter offener Ports bei Sicherheitsaudits sowie schnelle Referenz für Protokoll-Port-Zuweisungen.", - heading4: "Profi-Tipps", - p4: "Verwenden Sie den Risikofilter, um Hochrisiko-Ports in Ihrem Netzwerk schnell zu identifizieren. Der Abschnitt „Top 50 der häufigsten Ports” bietet Ihnen einen sofortigen Überblick über die am häufigsten verwendeten Dienste.", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
PortDienstRisiko
21FTPUnverschlüsselte Dateiübertragungen
23TelnetAuthentifizierung im Klartext
25SMTPRisiko als Spam-Relay
53DNSDDoS-Amplifikationsangriffe
445SMBVerbreitung von Ransomware
3389RDPBrute-Force-Angriffe
", @@ -872,16 +788,6 @@ export default { text4: "Warnungen", alert0: "Bitte generieren Sie zuerst eine Konfiguration", }, - edu: { - heading1: "Über WireGuard", - p1: "WireGuard ist ein modernes, hochleistungsfähiges VPN-Protokoll, das State-of-the-Art-Kryptografie verwendet. Es ist so konzipiert, dass es einfacher und schneller als ältere Protokolle wie OpenVPN und IPsec ist, mit einer wesentlich kleineren Angriffsfläche dank seiner minimalen Codebasis. WireGuard ist mittlerweile Teil des Linux-Kernels und wird nativ unter Windows, macOS, iOS und Android unterstützt.", - heading2: "So verwenden Sie dieses Tool", - p2: "Wählen Sie eine Topologie-Vorlage (Point-to-Point, Hub-and-Spoke, Site-to-Site oder Road Warrior), um eine Konfiguration vorauszufüllen. Klicken Sie auf Generate Keys, um lokal in Ihrem Browser ein neues Schlüsselpaar zu erstellen. Füllen Sie die erforderlichen Felder aus und klicken Sie auf Generate Config, um die WireGuard-Konfigurationsdatei zu erzeugen. Verwenden Sie Download .conf, um die Datei zu speichern, oder Generate QR, um einen QR-Code für den mobilen Import zu erstellen.", - heading3: "Häufige Anwendungsfälle", - p3: "Remote-Access-VPN für Mitarbeiter, die sich mit Unternehmensnetzwerken verbinden. Site-to-Site-VPN zur Verbindung von Niederlassungsnetzwerken. Persönlicher VPN-Server für sicheres Surfen in öffentlichen WLANs. IoT-Geräte-Tunneling für sichere Kommunikation zwischen eingebetteten Geräten.", - heading4: "Profi-Tipps", - p4: "Verwenden Sie PersistentKeepalive = 25 bei Clients hinter NAT, um den Tunnel aufrechtzuerhalten, wenn kein Datenverkehr fließt. PresharedKey fügt eine zusätzliche Schicht symmetrischer Verschlüsselung für Post-Quanten-Resistenz hinzu. AllowedIPs = 0.0.0.0/0 leitet den gesamten Datenverkehr durch den Tunnel (Full Tunnel), während spezifische CIDRs einen Split Tunnel erzeugen.", - }, cheatsheet: { title: "WireGuard-Kurzreferenz", h0: "Interface-Felder", @@ -1025,14 +931,6 @@ export default { tpl6: "Beispiel:", tpl7: "Klicken Sie auf ein beliebiges Feld im Diagramm, um Details zu sehen.", }, - edu: { - heading1: "Was sind Protokoll-Header?", - p1: "Protokoll-Header sind strukturierte Daten, die dem Payload in Netzwerkpaketen vorangestellt sind. Sie enthalten Steuerungsinformationen wie Quell- und Zieladressen, Protokolltypen, Sequenznummern und Prüfsummen. Das Verständnis der Header-Struktur ist essenziell für die Netzwerk-Fehlersuche, Paketanalyse und Protokollimplementierung.", - heading2: "So verwenden Sie dieses Tool", - p2: "Wählen Sie ein Protokoll aus den Tabs, um dessen Header-Struktur anzuzeigen. Jeder farbige Block stellt ein Feld mit angegebener Größe dar. Klicken Sie auf ein beliebiges Feld, um detaillierte Informationen zu sehen, einschließlich Feldname und Beschreibung, Bit-/Byte-Offset, gängige Werte und ihre Bedeutungen sowie RFC-Referenz. Verwenden Sie den Hex-Dump-Parser, um echte Paket-Mitschnitte zu analysieren, indem Sie Hex-Ausgaben von Tools wie tcpdump oder Wireshark einfügen.", - heading3: "Häufige Anwendungsfälle", - p3: "Paketanalyse, um die Struktur des erfassten Netzwerkverkehrs zu verstehen, Protokoll-Lernen als visuelle Hilfe beim Studium von Netzwerkprotokollen, Fehlersuche zur Identifizierung fehlerhafter Header oder falscher Feldwerte sowie Entwicklungsreferenz bei der Implementierung von Netzwerkprotokollen.", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
WertProtokoll
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
FeldGrößeBeschreibung
Source Port2 BytesPortnummer des Senders
Dest Port2 BytesPortnummer des Empfängers
Seq Number4 BytesSequenznummer
Ack Number4 BytesBestätigungsnummer
Data Offset4 BitHeader-Länge / 4
Flags9 BitNS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 BytesGröße des Empfangsfensters
", @@ -1108,16 +1006,6 @@ export default { tpl0: "Unterschiede", tpl1: "Keine Unterschiede gefunden (oder leere Eingabe)", }, - edu: { - heading1: "Was ist Text-Diffing?", - p1: "Text-Diffing ist der Prozess des Vergleichs zweier Datensequenzen, um die Unterschiede zwischen ihnen zu identifizieren. Es hebt hervor, was hinzugefügt, entfernt oder geändert wurde. Dies ist eine grundlegende Operation in der Softwareentwicklung, Datenanalyse und im Content-Management, die es Benutzern ermöglicht, Änderungen im Zeitverlauf zu verfolgen oder verschiedene Versionen eines Dokuments zu vergleichen.", - heading2: "Diff-Algorithmen", - p2: "Die meisten Text-Diffing-Tools verwenden Algorithmen, die auf dem Problem der längsten gemeinsamen Teilfolge (Longest Common Subsequence, LCS) basieren. Das Ziel ist es, die längste Sequenz von Elementen zu finden, die in beiden Texten in derselben relativen Reihenfolge vorkommen. Gängige Implementierungen umfassen den Myers-Diff-Algorithmus, der äußerst effizient ist und von Git verwendet wird, sowie den Hunt-McIlroy-Algorithmus. Diese Algorithmen berechnen die minimale Anzahl an Änderungen, die erforderlich sind, um einen Text in einen anderen umzuwandeln.", - heading3: "Anwendungsfälle", - p3: "Code-Reviews, damit Entwickler genau sehen können, was sich in einem Pull Request geändert hat. Versionskontrollsysteme wie Git speichern den Verlauf als eine Reihe von Diffs, um Speicherplatz zu sparen. Content-Audits für Autoren und Redakteure, die Entwürfe vergleichen, um sicherzustellen, dass alle angeforderten Änderungen vorgenommen wurden. Datenvalidierung zum Vergleichen von Konfigurationsdateien oder Datenbankexporten, um Abweichungen zu finden.", - heading4: "Profi-Tipps", - p4: "Viele Diff-Tools bieten Optionen, um Änderungen bei der Einrückung oder nachgestellten Leerzeichen zu ignorieren, was beim Vergleich von Code Rauschen reduzieren kann. Fügen Sie einige Zeilen unveränderten Textes um die Unterschiede herum ein (Kontextzeilen), um die Auswirkungen der Änderungen zu verstehen. Diffs auf Wortebene sind oft nützlicher für Prosa und natürlichsprachliche Dokumente, während Diffs auf Zeilenebene der Standard für Code sind.", - }, }, "regex-visualizer": { name: "Regex-Visualisierer", @@ -1168,16 +1056,6 @@ export default { tpl5: "Keine Gruppen", tpl6: "Ungültiger regulärer Ausdruck", }, - edu: { - heading1: "Was sind reguläre Ausdrücke?", - p1: "Reguläre Ausdrücke (Regex) sind leistungsstarke Muster, die zum Abgleich von Zeichenkombinationen in Zeichenketten verwendet werden. Sie sind essenzielle Werkzeuge für Textverarbeitung, Validierung und Datenextraktion in Programmiersprachen. Regex-Muster bestehen aus literalen Zeichen und speziellen Metazeichen, die Suchregeln definieren. Sie werden bei der Formularvalidierung, beim Log-Parsing, bei Suchen-und-Ersetzen-Vorgängen und bei der Datenbereinigung eingesetzt.", - heading2: "So verwenden Sie dieses Tool", - p2: "Geben Sie Ihr Regex-Muster in das Eingabefeld ein. Das Tool generiert automatisch ein Schienendiagramm, das die Musterstruktur visualisiert. Fügen Sie Testtext hinzu, um Treffer in Echtzeit hervorzuheben und Erklärungen zu sehen. Nutzen Sie das Cheatsheet als schnelle Referenz für gängige Muster und Syntax. Generieren Sie Code-Snippets für Ihre bevorzugte Programmiersprache.", - heading3: "Häufige Anwendungsfälle", - p3: "E-Mail-Validierung, um sicherzustellen, dass Benutzereingaben vor der Verarbeitung dem richtigen E-Mail-Format entsprechen, Log-Parsing zum Extrahieren von Zeitstempeln und IP-Adressen aus Server-Logs, Datenbereinigung zum Entfernen unerwünschter Zeichen oder zur einheitlichen Formatierung von Telefonnummern sowie Suchen-und-Ersetzen für Massen-Textumwandlungen mit Mustererkennung.", - heading4: "Profi-Tipps", - p4: "Beginnen Sie einfach und bauen Sie komplexe Muster schrittweise auf. Verwenden Sie nicht-erfassende Gruppen (?:), wenn Sie den Treffer nicht referenzieren müssen. Testen Sie Grenzfälle wie leere Zeichenketten und Sonderzeichen. Denken Sie an die Lesbarkeit von Regex — komplexe Muster können mit Kommentaren dokumentiert werden.", - }, cheatsheet: { title: "Regex-Kurzreferenz", h0: "Zeichenklassen", @@ -1323,16 +1201,6 @@ export default { text1: "Kopieren", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "Was ist ein Cron-Job?", - p1: "Ein Cron-Job ist ein zeitbasierter Aufgabenplaner in Unix-ähnlichen Betriebssystemen. Er wird verwendet, um Befehle oder Skripte automatisch zu geplanten Zeitpunkten oder Intervallen auszuführen. Der Name leitet sich von Chronos, dem griechischen Gott der Zeit, ab. Cron-Jobs sind unverzichtbar für die Systemautomatisierung, wie das Planen von Backups, das Senden von E-Mail-Berichten oder das Bereinigen temporärer Dateien.", - heading2: "So verwenden Sie dieses Tool", - p2: "Wählen Sie die entsprechende Registerkarte (Minute, Stunde, Tag, Monat, Woche), um jeden Teil des Ausdrucks zu konfigurieren. Wählen Sie entweder 'Jeder' für die Wildcard (*) oder geben Sie bestimmte Werte ein. Der Cron-Ausdruck wird in Echtzeit oben aktualisiert. Verwenden Sie die 'Nächste Ausführungen'-Vorschau, um zu überprüfen, ob Ihr Zeitplan wie erwartet ausgeführt wird. Kopieren Sie den fertigen Ausdruck per Klick in die Zwischenablage.", - heading3: "Häufige Anwendungsfälle", - p3: "Geplante Datenbankbackups täglich um Mitternacht. Berichte jeden Montag morgen generieren. Log-Dateien stündlich bereinigen. Healthcheck-Benachrichtigungen alle 5 Minuten senden. Caches täglich zu bestimmten Zeiten aktualisieren.", - heading4: "Profi-Tipps", - p4: "Testen Sie Ihren Cron-Ausdruck immer mit einem Tool wie diesem, bevor Sie ihn in die Produktion einsetzen. Bedenken Sie, dass Cron-Jobs in der lokalen Zeitzone des Servers ausgeführt werden, was bei verteilten Systemen zu Problemen führen kann. Dokumentieren Sie Ihre Cron-Jobs immer mit Kommentaren in der Crontab, um deren Zweck für spätere Referenz klar zu machen.", - }, cheatsheet: { title: "SSH-Schlüssel-Kurzreferenz", h0: "Schlüsseltypen", @@ -1372,16 +1240,6 @@ export default { tpl2: "Keine Subject Alternative Names vorhanden.", tpl3: "Keine Erweiterungen geparst.", }, - edu: { - heading1: "Was sind X.509-Zertifikate?", - heading2: "So verwenden Sie dieses Tool", - heading3: "Häufige Anwendungsfälle", - heading4: "Profi-Tipps", - p1: "

X.509 ist ein Standardformat für Public-Key-Zertifikate — digitale Dokumente, die einen öffentlichen Schlüssel sicher an eine Identität (etwa eine Website, Organisation oder Person) binden. Diese Zertifikate bilden die Grundlage der Public Key Infrastructure (PKI), die zur Absicherung des Internets über HTTPS sowie zum Signieren von E-Mails und Software verwendet wird.

Ein X.509-Zertifikat enthält den öffentlichen Schlüssel, die Identität des Zertifikatsinhabers und die digitale Signatur der Zertifizierungsstelle (Certificate Authority, CA), die das Zertifikat ausgestellt hat und damit seine Authentizität belegt.

", - p2: "
  1. Zertifikat einfügen: Kopieren Sie Ihr PEM-codiertes Zertifikat (einschließlich der BEGIN- und END-Header) und fügen Sie es in das Eingabefeld ein.
  2. Parsen: Klicken Sie auf \"Parse Certificate\", um die Daten zu extrahieren und zu analysieren.
  3. Zusammenfassung prüfen: Prüfen Sie die oberen Karten für Common Name (CN), Aussteller und Gültigkeitsdaten.
  4. Details untersuchen: Erweitern Sie die unteren Abschnitte, um das vollständige Subject, den Aussteller, die SANs und technische Erweiterungen zu sehen.
  5. Status prüfen: Sehen Sie sich das Status-Badge an, um zu prüfen, ob das Zertifikat derzeit gültig oder abgelaufen ist.
", - p3: "", - p4: "", - }, cheatsheet: { title: "X.509-Zertifikat-Referenz", h0: "Zertifikatsfelder", @@ -1424,16 +1282,6 @@ export default { text1: "JSON kopieren", text2: "XML kopieren", }, - edu: { - heading1: "Was ist SAML?", - p1: "Security Assertion Markup Language (SAML) ist ein XML-basierter offener Standard für den Austausch von Authentifizierungs- und Autorisierungsdaten zwischen Parteien, insbesondere zwischen einem Identity Provider (IdP) und einem Service Provider (SP). SAML ist das Rückgrat vieler Enterprise-Single-Sign-On-Lösungen (SSO) und ermöglicht Benutzern den Zugriff auf mehrere Anwendungen mit einem einzigen Satz von Anmeldedaten. Die gängigste Version ist SAML 2.0, das Sicherheitstoken mit Assertions verwendet, um Informationen über einen Principal zwischen IdP und SP zu übermitteln.", - heading2: "So verwenden Sie dieses Tool", - p2: "Fügen Sie die Base64-codierte SAMLResponse oder rohes XML in das Eingabefeld ein. Aktivieren Sie Attempt to inflate, wenn Sie einen Redirect-Binding-Payload decodieren. Klicken Sie auf Decode response, um die Nachricht zu parsen. Prüfen Sie die Kurzübersicht für Aussteller, Subject und Gültigkeitsstatus. Sehen Sie sich decodierte Benutzerattribute in der Attribute-Tabelle an. Verwenden Sie die Tabs, um Pretty XML, Assertion-Details oder eine JSON-Darstellung der Claims anzuzeigen.", - heading3: "Häufige Anwendungsfälle", - p3: "SSO-Fehlersuche durch Diagnose, warum sich ein Benutzer nicht anmelden kann, indem auf abgelaufene Assertions oder Audience-Abweichungen geprüft wird. Integrationstests zur Überprüfung, dass Ihr Identity Provider die korrekten Attribute sendet. Sicherheitsaudit zur Untersuchung des rohen XML und zur Sicherstellung, dass Assertions ordnungsgemäß signiert sind. Entwicklung zur schnellen Ansicht des Inhalts einer SAML-Nachricht während der Service-Provider-Integration.", - heading4: "Profi-Tipps", - p4: "SAML-Nachrichten, die über HTTP-Redirect gesendet werden, sind vor der Base64-Codierung normalerweise deflated (komprimiert) — wenn Ihre Decodierung fehlschlägt, versuchen Sie, das Kontrollkästchen Attempt to inflate zu aktivieren. Stellen Sie sicher, dass die AudienceRestriction mit Ihrer SP Entity ID übereinstimmt. Wenn eine Antwort als ungültig markiert ist, prüfen Sie die Zeiten NotBefore und NotOnOrAfter auf Zeitabweichungen (Clock Skew) zwischen den Uhren von IdP und SP.", - }, cheatsheet: { title: "SAML-Kurzreferenz", h0: "SAML-Ablauf", @@ -1476,16 +1324,6 @@ export default { alert1: "Bitte geben Sie einen User-Agent-String ein", tpl2: "Rohe Analyseausgabe", }, - edu: { - heading1: "Was ist ein User-Agent?", - p1: "Ein User-Agent ist ein String, den Ihr Browser an jede Website sendet, die Sie besuchen. Er identifiziert die Browserversion, das Betriebssystem und den Gerätetyp, sodass Server Inhalte für Ihre spezifische Umgebung optimieren können.", - heading2: "So verwenden Sie dieses Tool", - p2: "Fügen Sie einen User-Agent-String in das Eingabefeld ein oder klicken Sie auf Use This, um den String Ihres aktuellen Browsers zu analysieren. Das Tool schlüsselt die Browser-Engine, Betriebssystemversion und Geräteeigenschaften auf.", - heading3: "Häufige Anwendungsfälle", - p3: "Fehlersuche bei Website-Kompatibilitätsproblemen, Analyse von Webserver-Logs zur Identifizierung von Bot-Datenverkehr, Überprüfung von Browser-Spoofing und Verständnis der Geräteverteilung in Ihrer Zielgruppe.", - heading4: "Profi-Tipps", - p4: "Viele moderne Browser frieren ihre User-Agent-Strings ein oder vereinfachen sie, um Fingerprinting zu verhindern. Achten Sie immer auf die Version- oder Chrome-Token für die genauesten Versionsinformationen.", - }, }, "qr-code": { name: "QR-Code-Generator", @@ -1524,16 +1362,6 @@ export default { alert3: "Kopiert!", tpl4: "Laden Sie ein Bild zum Decodieren hoch", }, - edu: { - heading1: "Was sind QR-Codes?", - p1: "Quick-Response-Codes (QR-Codes) sind zweidimensionale Barcodes, die verschiedene Arten von Daten speichern können, am häufigsten URLs. Sie können von Smartphones und speziellen Lesegeräten gescannt werden, um schnell auf Informationen zuzugreifen oder Aktionen auszulösen.", - heading2: "So verwenden Sie dieses Tool", - p2: "Geben Sie den Text oder die URL ein, die Sie codieren möchten. Passen Sie bei Bedarf die Größe und die Fehlerkorrekturstufe an. Der QR-Code wird in Echtzeit aktualisiert und kann als Bild für Druck oder digitale Verwendung heruntergeladen werden.", - heading3: "Häufige Anwendungsfälle", - p3: "Teilen von Website-Links, Bereitstellen von WLAN-Zugangsdaten, digitale Visitenkarten (vCards), Ticketing für Veranstaltungen sowie mobile Zahlungen oder Authentifizierungsabläufe.", - heading4: "Profi-Tipps", - p4: "Höhere Fehlerkorrekturstufen (H oder Q) sorgen dafür, dass der QR-Code auch bei teilweiser Beschädigung oder Verdeckung scannbar bleibt, was ideal für physische Beschilderung oder Branding ist.", - }, }, "timestamp-converter": { name: "Zeitstempel-Konverter", @@ -1564,16 +1392,6 @@ export default { text0: "Ungültiger Zeitstempel", tpl1: "Unix (Millisekunden)", }, - edu: { - heading1: "Was ist Unix-Zeit?", - p1: "Unix-Zeit (auch bekannt als Epoch-Zeit, POSIX-Zeit oder Unix-Timestamp) ist ein System zur Beschreibung eines Zeitpunkts. Es ist die Anzahl der Sekunden, die seit dem Unix-Epoch vergangen sind (abzüglich Schaltsekunden); der Unix-Epoch ist 00:00:00 UTC am 1. Januar 1970. Es wird häufig in Betriebssystemen und Dateiformaten verwendet, da es eine einzelne Ganzzahl ist, die Computer leicht speichern und verarbeiten können. Dieser Standard ermöglicht es verschiedenen Systemen, Zeit unabhängig von ihren lokalen Zeitzoneneinstellungen präzise zu kommunizieren.", - heading2: "So verwenden Sie dieses Tool", - p2: "Zum Konvertieren von Unix in Menschen-lesbar: Geben Sie den Timestamp im Feld Unix-Timestamp ein und wählen Sie, ob er in Sekunden oder Millisekunden ist. Zum Konvertieren von Menschen-lesbar in Unix: Wählen Sie Datum und Uhrzeit mit den Auswahlfeldern und wählen Sie Ihre gewünschte Zeitzone. Verwenden Sie die Now-Schaltfläche, um schnell den aktuellen Timestamp zu erfassen. Ergebnisse in Echtzeit anzeigen, einschließlich ISO 8601, Lokalzeit, UTC und relativer Zeit. Klicken Sie auf Copy neben einem Ergebnis, um es in die Zwischenablage zu kopieren.", - heading3: "Häufige Anwendungsfälle", - p3: "Protokollanalyse zum Konvertieren kryptischer Timestamps in Server-Protokollen oder Datenbankeinträgen in lesbare Daten zur Fehlersuche. API-Entwicklung zur Überprüfung, ob Ihr Backend die korrekten Epoch-Werte sendet. Datenmigration zur Sicherstellung, dass zeitbasierte Daten beim Wechsel zwischen Systemen konsistent bleiben. Planung zur Berechnung zukünftiger oder vergangener Timestamps für Cron-Jobs, Ablaufdaten oder Event-Trigger.", - heading4: "Profi-Tipps", - p4: "Beachten Sie bei der Arbeit mit JavaScript, dass Date.now() Millisekunden zurückgibt, während Standard-Unix-Timestamps in Sekunden sind — dividieren Sie durch 1000 zur Konvertierung. Verwenden Sie immer das ISO 8601-Format für den Datenaustausch zwischen Systemen, um maximale Kompatibilität zu gewährleisten. Beachten Sie das Jahr-2038-Problem, bei dem 32-Bit-vorzeichenbehaftete Ganzzahlen überlaufen; moderne Systeme verwenden 64-Bit-Ganzzahlen, was dieses Problem für die absehbare Zukunft löst.", - }, }, "color-converter": { name: "Farbkonverter", @@ -1589,16 +1407,6 @@ export default { badge7: "Nur clientseitig", badge8: "Datenschutz zuerst", }, - edu: { - heading1: "Farbmodelle erklärt (HEX/RGB/HSL)", - heading2: "So verwenden Sie dieses Tool", - heading3: "Häufige Anwendungsfälle", - heading4: "Profi-Tipps", - p1: "

Farbmodelle sind mathematische Systeme zur Darstellung von Farben. HEX (Hexadezimal) ist ein 6-stelliger Code, der in HTML und CSS verwendet wird und Rot-, Grün- und Blaukomponenten darstellt. RGB (Rot, Grün, Blau) verwendet Dezimalwerte von 0 bis 255 für jeden Kanal, häufig in der digitalen Bildverarbeitung eingesetzt.

HSL (Farbton, Sättigung, Helligkeit) ist für Menschen intuitiver, da es Farbe in Bezug auf ihren Grundfarbton (Hue), Intensität (Saturation) und Helligkeit (Lightness) beschreibt. Das Verständnis dieser Modelle hilft bei der Auswahl des richtigen Formats für Design- und Entwicklungsanforderungen, um Konsistenz über verschiedene Plattformen und Geräte hinweg zu gewährleisten.

", - p2: "
  1. Verwenden Sie den visuellen Farbwähler, um eine Farbe durch Ziehen des Cursors im Sättigungs-/Helligkeitsquadrat und dem Farbtonregler auszuwählen.
  2. Alternativ geben Sie einen bestimmten Wert in das Feld «Manuelle Eingabe» ein (unterstützt #hex, rgb oder hsl-Formate).
  3. Beobachten Sie das Vorschaufeld, um die ausgewählte Farbe in Echtzeit zu sehen.
  4. Zeigen Sie die konvertierten Werte in den HEX-, RGB-, HSL- und HSV-Karten unten an.
  5. Klicken Sie auf das «Kopieren»-Symbol auf einer Karte, um dieses spezifische Format in die Zwischenablage zu kopieren.
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "Einheitenumrechner", @@ -1616,16 +1424,6 @@ export default { text0: "Wählen Sie Einheiten aus, um die Umrechnungsformel zu sehen", text1: "Geben Sie eine gültige Zahl ein", }, - edu: { - heading1: "Überblick über Maßsysteme", - p1: "Maßsysteme sind Sammlungen von Maßeinheiten und Regeln, die diese miteinander in Beziehung setzen. Die zwei gebräuchlichsten Systeme sind das Metrische System (Internationales Einheitensystem oder SI) und das Imperiale System. Das metrische System basiert auf Zehnerpotenzen, was es äußerst logisch und leicht skalierbar macht. Das Imperiale System, das hauptsächlich in den USA verwendet wird, nutzt Einheiten wie Zoll, Fuß und Pfund, die historische Ursprünge haben. Das Verständnis der Unterschiede zwischen diesen Systemen ist für Wissenschaft, Technik, internationalen Handel und alltägliche Aufgaben wie Kochen oder Reisen unerlässlich.", - heading2: "So verwenden Sie dieses Tool", - p2: "Wählen Sie die Messkategorie (z.B. Länge, Gewicht, Temperatur) aus dem Raster oben. Wählen Sie die Einheit, von der Sie konvertieren möchten, im Von-Dropdown-Menü. Geben Sie den zu konvertierenden Wert in das Eingabefeld ein. Wählen Sie die Zieleinheit im Nach-Dropdown-Menü. Der konvertierte Wert erscheint sofort zusammen mit der verwendeten mathematischen Formel.", - heading3: "Häufige Anwendungsfälle", - p3: "Reisen zum Konvertieren von Entfernungen von Kilometern in Meilen oder Temperaturen von Celsius in Fahrenheit. Kochen zum Übersetzen von Rezepten zwischen metrischen (Gramm/Milliliter) und imperialen (Unzen/Tassen) Maßen. Ingenieurwesen und Wissenschaft für präzise Konvertierungen zwischen verschiedenen Einheiten von Druck, Energie oder Geschwindigkeit. Digitaler Speicher zum Verstehen des Unterschieds zwischen Megabyte, Gigabyte und Terabyte.", - heading4: "Profi-Tipps", - p4: "Verwenden Sie die Tauschen-Schaltfläche, um die Konvertierungsrichtung zwischen Ihren ausgewählten Einheiten schnell umzukehren. Überprüfen Sie immer den spezifischen Einheitentyp, insbesondere für Volumen und Gewicht, da Namen in verschiedenen Systemen wie US vs. UK-Gallonen ähnlich sein können. Behalten Sie bei der Durchführung mehrerer Konvertierungen in einer Sequenz so viele Dezimalstellen wie möglich bis zum Endergebnis, um kumulative Rundungsfehler zu vermeiden.", - }, }, "yaml-toml-converter": { name: "YAML/TOML-Konverter", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ TOML-Konvertierung fehlgeschlagen:", tpl7: "Warte auf Konvertierung.", }, - edu: { - heading1: "YAML vs. TOML vs. JSON im Vergleich", - p1: "JSON ist aufgrund seiner Einfachheit und nativen Unterstützung in JavaScript das am weitesten verbreitete Format für den Datenaustausch. YAML (YAML Ain't Markup Language) ist ein menschenfreundlicher Standard zur Datenserialisierung, der Einrückung zur Darstellung von Struktur verwendet, was es für komplexe Konfigurationsdateien beliebt macht. TOML (Tom's Obvious, Minimal Language) wurde entwickelt, um dank seiner offensichtlichen Semantik leicht lesbar und schreibbar zu sein, und wird häufig für die Projektkonfiguration verwendet. Während JSON streng und kompakt ist, priorisieren YAML und TOML die menschliche Lesbarkeit und die einfache manuelle Bearbeitung.", - heading2: "So verwenden Sie dieses Tool", - p2: "Fügen Sie Ihre Konfigurationsdaten (JSON, YAML oder TOML) in das Quelltextfeld links ein. Das Tool erkennt automatisch das Quellformat, oder Sie können es manuell aus dem Dropdown-Menü auswählen. Klicken Sie auf Validate only, um auf Syntaxfehler zu prüfen, ohne eine Konvertierung durchzuführen. Klicken Sie auf eine der Konvertierungsschaltflächen (to JSON, to YAML, to TOML), um Ihre Daten in dieses Format zu übersetzen. Sehen Sie sich die Ergebnisse in den Ausgabefeldern rechts an und klicken Sie auf Copy, um sie in Ihrer Zwischenablage zu speichern.", - heading3: "Häufige Anwendungsfälle", - p3: "Infrastructure as Code, um zwischen JSON und YAML zu konvertieren, wenn mit Kubernetes-Manifesten, Docker-Compose-Dateien oder AWS-CloudFormation-Vorlagen gearbeitet wird. Projektkonfiguration zur Migration von Einstellungen zwischen package.json (JSON) und pyproject.toml oder Cargo.toml (TOML). API-Prototyping, um schnell zu visualisieren, wie eine komplexe Datenstruktur in verschiedenen Formaten aussieht. Legacy-Migration zur Übersetzung alter Konfigurationsdateien in moderne Formate unter Wahrung der Datenintegrität.", - heading4: "Profi-Tipps", - p4: "Verwenden Sie YAML für CI/CD-Pipelines, bei denen die Lesbarkeit komplexer verschachtelter Strukturen für die Wartbarkeit essenziell ist. Bevorzugen Sie TOML für Konfigurationsdateien auf Anwendungsebene, um Endbenutzern, die sie möglicherweise manuell bearbeiten müssen, eine übersichtliche Schnittstelle zu bieten. Achten Sie bei der Konvertierung von YAML nach JSON auf Probleme mit der YAML-Typumwandlung (bei denen NO als false interpretiert werden kann) und stellen Sie sicher, dass Ihre Datentypen korrekt erhalten bleiben.", - }, cheatsheet: { title: "Formatvergleich", h0: "Syntaxunterschiede", @@ -1719,16 +1507,6 @@ export default { text1: "Kopieren", text2: "Kopiert!", }, - edu: { - heading1: "Was ist htpasswd?", - p1: "

Die htpasswd-Datei ist eine Flatfile-Datenbank, die zum Speichern von Benutzernamen und gehashten Passwörtern für die Basisauthentifizierung auf Apache- und Nginx-Webservern verwendet wird. Sie ist eine einfache, aber effektive Möglichkeit, bestimmte Verzeichnisse oder Administrationsbereiche einer Website zu schützen, ohne ein vollständiges datenbankgestütztes Authentifizierungssystem zu benötigen.

Jede Zeile in einer htpasswd-Datei repräsentiert einen einzelnen Benutzer und folgt dem Format username:hashed_password.

", - heading2: "So verwenden Sie dieses Tool", - p2: "
  1. Benutzername eingeben: Geben Sie den Benutzernamen ein, den Sie zur Authentifizierung verwenden möchten.
  2. Passwort angeben: Geben Sie ein Passwort ein oder klicken Sie auf Generate strong, um ein sicheres zu erstellen.
  3. Algorithmus wählen: Wählen Sie Bcrypt (-B) für moderne Sicherheit oder Apache MD5 (-m) für Legacy-Kompatibilität.
  4. Generieren: Klicken Sie auf Generate entry, um den gehashten String zu erstellen.
  5. Kopieren oder herunterladen: Kopieren Sie die resultierende Zeile in Ihre Zwischenablage oder laden Sie sie als Datei herunter, um sie auf Ihren Server hochzuladen.
", - heading3: "Häufige Anwendungsfälle", - p3: "", - heading4: "Profi-Tipps", - p4: "", - }, }, "mock-data-generator": { name: "Testdaten-Generator", @@ -1762,16 +1540,6 @@ export default { text1: "Kopieren", text2: "Keine Zeilen zur Vorschau.", }, - edu: { - heading1: "Was sind Mock-Daten?", - p1: "

Mock-Daten sind synthetische Informationen, die reale Daten imitieren, ohne sensible oder personenbezogene Daten (PII) zu enthalten. Sie sind für Entwickler und Tester unverzichtbar, die realistische Datensätze benötigen, um Anwendungen zu erstellen und zu validieren, ohne das Risiko von Datenlecks oder die Verletzung von Datenschutzvorschriften wie DSGVO oder CCPA einzugehen. Durch die Verwendung von Mock-Daten können Sie verschiedene Szenarien simulieren und sicherstellen, dass Ihre Software alle Arten von Eingaben ordnungsgemäß verarbeitet.

", - heading2: "Teststrategien", - p2: "

Effektives Testen erfordert vielfältige Datensätze. Verwenden Sie Mock-Daten, um Ihre Entwicklungsdatenbanken zu befüllen, Lasttests mit Tausenden von Datensätzen durchzuführen oder UI-Layouts mit variierenden Zeichenkettenlängen zu überprüfen. Es ist besonders nützlich für Integrationstests, bei denen Sie vorhersehbare Antworten von externen APIs benötigen. Durch die lokale Generierung von Daten können Sie konsistente Testumgebungen erstellen, die leicht zurückgesetzt und reproduziert werden können.

", - heading3: "Datenschutz bei Mock-Daten", - p3: "

Datenschutz hat in der modernen Softwareentwicklung höchste Priorität. Die Verwendung echter Produktionsdaten in Entwicklungs- oder Staging-Umgebungen ist ein erhebliches Sicherheitsrisiko. Mock-Datengeneratoren lösen dieses Problem, indem sie gefälschte, aber strukturell korrekte Daten erzeugen. Unser Tool läuft vollständig in Ihrem Browser, was bedeutet, dass Ihre Konfiguration und die generierten Daten Ihr Gerät nie verlassen.

", - heading4: "Profi-Tipps", - p4: "", - }, cheatsheet: { title: "Mock-Daten-Feldtypen", h0: "Verfügbare Typen", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "Namenskonventionen erklärt (camelCase/snake_case/etc.)", - heading2: "So verwenden Sie dieses Tool", - heading3: "Häufige Anwendungsfälle", - heading4: "Profi-Tipps", - p1: "

Namenskonventionen sind Regelwerke zur Wahl der Zeichenfolge für Bezeichner, die Variablen, Typen, Funktionen und andere Entitäten in Quellcode und Dokumentation benennen. camelCase (z. B. myVariable) beginnt mit einem Kleinbuchstaben und schreibt den ersten Buchstaben jedes folgenden Wortes groß. snake_case (z. B. my_variable) verwendet Unterstriche zur Worttrennung.

PascalCase (z. B. MyVariable) schreibt den ersten Buchstaben jedes Wortes groß, während kebab-case (z. B. my-variable) Bindestriche zur Worttrennung verwendet. Diese Konventionen sind nicht nur eine Frage der Ästhetik; sie sind entscheidend für die Lesbarkeit und Wartbarkeit von Code sowie für die Einhaltung der idiomatischen Standards verschiedener Programmiersprachen und Frameworks.

", - p2: "
  1. Geben Sie Ihren Text in das Feld \"Input Text\" oben auf der Seite ein oder fügen Sie ihn ein.
  2. Das Tool wandelt Ihre Eingabe automatisch in Echtzeit in über ein Dutzend verschiedene Schreibweisen um.
  3. Scrollen Sie durch das Raster \"Conversion Results\", um die gewünschte Schreibweise zu finden.
  4. Klicken Sie auf das \"Copy\"-Symbol neben einem Ergebnis, um es in Ihrer Zwischenablage zu speichern.
  5. Verwenden Sie die Schaltfläche \"Clear\", um alle Eingaben zu entfernen und eine neue Umwandlung zu starten.
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "Code-Komprimierer", @@ -1913,16 +1671,6 @@ export default { text2: "📋 Kopieren", tpl3: "Die gesamte Verarbeitung erfolgt in Ihrem Browser. Ihr Code wird lokal verarbeitet und nicht an unsere Server gesendet.", }, - edu: { - heading1: "Was ist Minifizierung?", - heading2: "So verwenden Sie dieses Tool", - heading3: "Häufige Anwendungsfälle", - heading4: "Profi-Tipps", - p1: "

Minifizierung ist der Prozess, bei dem alle unnötigen Zeichen aus Quellcode entfernt werden, ohne dessen Funktionalität zu verändern. Dazu gehört das Entfernen von Leerzeichen, Zeilenumbrüchen, Kommentaren und manchmal das Verkürzen von Variablennamen. Ziel ist es, die Dateigröße des Codes zu reduzieren, was wiederum die über das Netzwerk zu übertragende Datenmenge verringert.

Dies führt zu schnelleren Seitenladezeiten und verbesserter Leistung für Webanwendungen. Während Minifizierung für Produktionsumgebungen essenziell ist, macht sie den Code für Menschen nahezu unlesbar und schwer zu debuggen. Daher wird sie typischerweise als letzter Schritt im Build-Prozess vor der Bereitstellung auf einem Live-Server durchgeführt.

", - p2: "
  1. Wählen Sie die Programmiersprache (JavaScript, CSS, HTML oder JSON) aus den Tabs oben.
  2. Fügen Sie Ihren Quellcode in das Textfeld \"Input Code\" links ein.
  3. Klicken Sie auf die Schaltfläche \"Minify Code\", um die Dateigröße für den Produktionseinsatz zu reduzieren.
  4. Alternativ klicken Sie auf \"Beautify Code\", um Einrückung und Formatierung für bessere Lesbarkeit hinzuzufügen.
  5. Sehen Sie sich die Ergebnisse im Bereich \"Output Code\" an und klicken Sie auf \"Copy\" oder \"Download\", um Ihren optimierten Code zu speichern.
", - p3: "", - p4: "", - }, }, "image-converter": { name: "Bildkonverter", @@ -1969,16 +1717,6 @@ export default { alert2: "Fehler beim Lesen der Datei.", tpl3: "Clientseitige Verarbeitung mit der Canvas API - keine Uploads, sofortige Ergebnisse", }, - edu: { - heading1: "Bildformate im Vergleich (PNG/JPEG/WebP)", - p1: "

Die Wahl des richtigen Bildformats ist entscheidend für Web-Performance und visuelle Qualität. JPEG eignet sich am besten für Fotografien und komplexe Bilder mit vielen Farben, da es verlustbehaftete Komprimierung für kleine Dateigrößen verwendet. PNG ist ideal für Bilder, die Transparenz benötigen oder scharfe Kanten und einfarbige Flächen aufweisen (wie Logos und Icons), da es verlustfreie Komprimierung verwendet.

WebP ist ein modernes Format, das überlegene verlustbehaftete und verlustfreie Komprimierung bietet und oft zu deutlich kleineren Dateigrößen als JPEG oder PNG führt, bei gleichzeitig hoher Qualität.

", - heading2: "So verwenden Sie dieses Tool", - p2: "
  1. Laden Sie Ihr Bild hoch, indem Sie es in die Zone Upload Image ziehen oder klicken, um Ihre Dateien zu durchsuchen.
  2. Wählen Sie das gewünschte Ausgabeformat (PNG, JPG oder WebP) aus den Optionen Convert Format.
  3. Wenn Sie ein verlustbehaftetes Format wie JPG oder WebP gewählt haben, verwenden Sie den Qualitätsregler, um Dateigröße und visuelle Treue auszubalancieren.
  4. Optional können Sie die Einstellungen Resize Image verwenden, um Ihr Bild nach Prozentsatz oder bestimmten Abmessungen zu skalieren.
  5. Klicken Sie auf Convert & Resize Image und dann auf Download, um Ihr optimiertes Asset zu speichern.
", - heading3: "Häufige Anwendungsfälle", - p3: "", - heading4: "Profi-Tipps", - p4: "", - }, }, "css-gradient": { name: "CSS-Verlaufsgenerator", @@ -2018,16 +1756,6 @@ export default { alert2: "CSS konnte nicht in die Zwischenablage kopiert werden", tpl3: "Ladebildschirme und Overlays", }, - edu: { - heading1: "Was sind CSS-Verläufe?", - heading2: "Linearer vs. radialer vs. konischer Verlauf", - heading3: "Browser-Unterstützung und Performance", - heading4: "Profi-Tipps für bessere Verläufe", - p1: "

CSS-Verläufe sind eine leistungsstarke Funktion, mit der Sie sanfte Übergänge zwischen zwei oder mehr festgelegten Farben darstellen können. Anders als herkömmliche Hintergrundbilder werden Verläufe vom Browser erzeugt, was bedeutet, dass sie unendlich skalierbar sind, weniger Bandbreite verbrauchen und sich leicht per Code steuern lassen. Sie werden häufig für Hintergründe, Schaltflächen und dekorative Elemente verwendet, um Webdesigns Tiefe und visuellen Reiz zu verleihen.

", - p2: "

Es gibt drei Haupttypen von CSS-Verläufen:

", - p3: "

Moderne CSS-Verläufe werden von allen großen Browsern breit unterstützt, einschließlich Chrome, Firefox, Safari und Edge. Da sie von der Browser-Engine mathematisch gerendert werden, sind sie im Vergleich zu hochauflösenden Bildern äußerst performant. Bei sehr komplexen Verläufen mit Dutzenden von Farbstopps ist es jedoch immer eine gute Praxis, die Performance auf leistungsschwächeren Geräten zu testen. Für ältere Browser (wie IE9 und niedriger) wird empfohlen, einen einfarbigen Fallback bereitzustellen.

", - p4: "", - }, }, "curl-studio": { name: "cURL-Studio", @@ -2096,16 +1824,6 @@ export default { text2: "Kopiert!", tpl3: "Logs werden hier nach der Maskierung angezeigt...", }, - edu: { - heading1: "Was ist PII?", - p1: "

Personenbezogene Daten (Personally Identifiable Information, PII) sind alle Daten, mit denen eine bestimmte Person identifiziert werden kann. Dazu gehören direkte Identifikatoren wie Namen, E-Mail-Adressen und Telefonnummern sowie indirekte Identifikatoren wie IP-Adressen, physische Standorte und Kreditkartennummern. Im Kontext von Serverlogs erscheinen PII häufig in Request-Parametern, Headern oder Fehlermeldungen.

Der Schutz personenbezogener Daten ist ein wesentlicher Bestandteil moderner Datensicherheit und wird von verschiedenen Rechtsrahmen weltweit gefordert.

", - heading2: "Compliance-Anforderungen (DSGVO/CCPA)", - p2: "

Vorschriften wie die Datenschutz-Grundverordnung (DSGVO) in Europa und der California Consumer Privacy Act (CCPA) in den Vereinigten Staaten legen strenge Regeln für den Umgang mit personenbezogenen Daten fest. Diese Gesetze verpflichten Organisationen, Privacy by Design umzusetzen und die Erhebung und Speicherung personenbezogener Daten zu minimieren.

Das Teilen roher Logs, die PII enthalten, mit externen Support-Teams oder Entwicklern kann zu Compliance-Verstößen führen. Das Maskieren oder Schwärzen dieser Daten, bevor sie Ihre sichere Umgebung verlassen, ist ein wichtiger Schritt zur Einhaltung regulatorischer Vorgaben.

", - heading3: "Maskierungsstrategien", - p3: "

Es gibt mehrere Möglichkeiten, sensible Daten in Logs zu behandeln:

Unser Tool konzentriert sich auf die Schwärzung und nutzt Musterabgleich, um gängige PII-Formate sofort zu finden und zu ersetzen.

", - heading4: "Profi-Tipps", - p4: "", - }, }, "mermaid-studio": { name: "Mermaid-Studio", @@ -2306,16 +2024,6 @@ export default { text51: "Noch keine URLs extrahiert.", text52: "Noch keine Routing-Daten.", }, - edu: { - heading1: "E-Mail-Authentifizierung erklärt", - heading2: "SPF/DKIM/DMARC", - heading3: "Phishing-Erkennung", - heading4: "Profi-Tipps", - p1: "

E-Mail-Authentifizierung ist eine Sammlung von Techniken, die überprüfbare Informationen über den Ursprung einer E-Mail-Nachricht liefern. Durch die Validierung der Absenderidentität helfen diese Protokolle Mailservern, zwischen legitimen und gefälschten oder betrügerischen Nachrichten (wie Phishing) zu unterscheiden. Die drei Säulen der modernen E-Mail-Authentifizierung sind SPF, DKIM und DMARC.

Beim Empfang einer E-Mail führt der empfangende Server diese Prüfungen durch und zeichnet die Ergebnisse in den Headern der E-Mail auf, die dieses Tool für Sie parst.

", - p2: "", - p3: "

Phishing-E-Mails nutzen häufig \"Spoofing\", um so zu erscheinen, als kämen sie von einer vertrauenswürdigen Quelle. Unser Analyzer sucht nach gängigen Warnsignalen, etwa einer Abweichung zwischen der \"From\"-Adresse (was der Benutzer sieht) und dem \"Return-Path\" (woher die Mail tatsächlich kam). Wir extrahieren und analysieren außerdem URLs im E-Mail-Body, um verdächtige Links zu identifizieren, etwa solche, die Punycode (Lookalike-Domains) oder IP-Adressen statt Hostnamen verwenden.

Durch die Überprüfung des Abschnitts \"Findings\" können Sie diese Signale schnell erkennen und feststellen, ob eine E-Mail sicher ist.

", - p4: "", - }, cheatsheet: { title: "E-Mail-Auth-Kurzreferenz", h0: "Was diese Prüfungen bedeuten", @@ -2491,16 +2199,6 @@ export default { text9: "Fügen Sie zuerst SQL ein.", text10: "✓ Kopiert", }, - edu: { - heading1: "Warum SQL formatieren?", - p1: "SQL kann schnell komplex und schwer lesbar werden, besonders bei mehreren Joins, Unterabfragen und verschachtelten Bedingungen. Das Formatieren von SQL umfasst das Hinzufügen konsistenter Einrückung, Zeilenumbrüche und Großschreibung von Schlüsselwörtern. Dadurch lässt sich die Logik der Abfrage viel leichter nachvollziehen, was für Debugging, Code-Reviews und die langfristige Wartung großer Datenbankschemata essenziell ist. Eine gut formatierte Abfrage ist auch weniger anfällig für logische Fehler bei manuellen Bearbeitungen.", - heading2: "So verwenden Sie dieses Tool", - p2: "Fügen Sie Ihre rohe SQL-Abfrage in den Input-SQL-Editor links ein. Wählen Sie Ihren Datenbankdialekt (Postgres oder MySQL) und die bevorzugte Groß-/Kleinschreibung der Schlüsselwörter (UPPER oder lower). Klicken Sie auf die Schaltfläche Format, um Ihre Abfrage mit korrekter Einrückung und Abständen zu verschönern. Verwenden Sie die Schaltfläche Validate, um auf gängige strukturelle Probleme wie nicht geschlossene Anführungszeichen oder unausgeglichene Klammern zu prüfen. Klicken Sie auf Copy, um das formatierte SQL in Ihre Zwischenablage zu speichern, oder auf Clear, um neu zu beginnen.", - heading3: "Häufige Anwendungsfälle", - p3: "Code-Reviews, um unübersichtliches SQL vor dem Einreichen eines Pull Requests zu formatieren. Debugging, um von ORMs generierte Abfragen zu bereinigen und genau zu verstehen, was gegen Ihre Datenbank ausgeführt wird. Dokumentation, um klare und lesbare Beispiele für technische Leitfäden, Wikis oder README-Dateien zu erstellen. Legacy-Bereinigung, um alte, unformatierte Skripte schnell in einen modernen, lesbaren Stil umzuwandeln.", - heading4: "Profi-Tipps", - p4: "Verwenden Sie Common Table Expressions (CTEs) mit der WITH-Klausel, um komplexe Abfragen in kleinere, besser handhabbare Teile zu zerlegen. Verwenden Sie immer aussagekräftige Aliase für Tabellen und Spalten, um die Absicht Ihrer Abfrage klar zu machen. Verwenden Sie die Schaltfläche Minify, wenn Sie Ihr SQL für die Verwendung in Konfigurationsdateien oder Kommandozeilen-Tools auf eine einzige Zeile komprimieren müssen.", - }, cheatsheet: { title: "SQL-Formatierungstipps", h0: "Schnelle Erfolge", @@ -2569,16 +2267,6 @@ export default { text15: "Hinweis: Werte werden aus Sicherheitsgründen maskiert. Der Diff ist heuristisch und berücksichtigt weder Kommentare noch Reihenfolge.", text16: "✓ Kopiert", }, - edu: { - heading1: "Best Practices für Umgebungsvariablen", - heading2: "Geheimnisverwaltung", - heading3: ".env-Sicherheit", - heading4: "Profi-Tipps", - p1: "

Umgebungsvariablen sind ein grundlegender Bestandteil der \"Twelve-Factor App\"-Methodik, die eine strikte Trennung von Konfiguration und Code befürwortet. Durch die Verwendung von Umgebungsvariablen können Sie denselben Code in verschiedenen Umgebungen (Entwicklung, Staging, Produktion) ausführen, indem Sie einfach die Konfigurationswerte ändern.

Zu den bewährten Praktiken gehören die Verwendung aussagekräftiger, großgeschriebener Namen (z. B. DATABASE_URL), das Bereitstellen von Standardwerten für unkritische Einstellungen und das niemalige direkte Hardcodieren sensibler Informationen in Ihre Versionskontrolle.

", - p2: "

Secrets sind eine besondere Kategorie von Umgebungsvariablen, die sensible Informationen wie API-Schlüssel, Datenbankpasswörter und private Zertifikate enthalten. Deren sichere Verwaltung ist entscheidend, um Datenschutzverletzungen zu verhindern. Für Produktionsumgebungen sollten Sie einen dedizierten Secret-Management-Dienst (wie AWS Secrets Manager, HashiCorp Vault oder Cloudflare Secrets) verwenden.

Für die lokale Entwicklung werden häufig .env-Dateien verwendet, diese sollten jedoch niemals in Ihr Git-Repository committet werden. Fügen Sie immer *.env zu Ihrer .gitignore-Datei hinzu.

", - p3: "

Beim Teilen von .env-Dateien mit Teammitgliedern zum Debuggen besteht ein hohes Risiko, versehentlich Produktions-Secrets offenzulegen. Unser Manager hilft, dieses Risiko durch die Funktion \"Mask sensitive values\" zu mindern. Er verwendet Heuristiken, um Schlüssel wie SECRET, TOKEN oder PASSWORD zu identifizieren und ersetzt deren Werte durch eine maskierte Version (z. B. ab...yz (32)).

So können Sie die Struktur und nicht sensiblen Werte Ihrer Umgebungsdateien vergleichen, ohne die tatsächlichen Secrets offenzulegen.

", - p4: "", - }, cheatsheet: { title: "Dotenv-Hinweise", h0: "Maskierungsstrategie", @@ -2638,16 +2326,6 @@ export default { text7: "Noch keine Vorschau.", text8: "✓ Kopiert", }, - edu: { - heading1: "Was ist SVG?", - p1: "SVG (Scalable Vector Graphics) ist ein XML-basiertes Vektorgrafikformat für zweidimensionale Grafiken mit Unterstützung für Interaktivität und Animation. Anders als Rasterformate wie JPEG oder PNG werden SVGs durch mathematische Pfade definiert, wodurch sie ohne Qualitätsverlust auf jede Größe skaliert werden können. Das macht sie perfekt für Logos, Icons und Illustrationen im Web, wo sie auf allem von mobilen Bildschirmen bis zu hochauflösenden Desktop-Monitoren scharf bleiben.", - heading2: "So verwenden Sie dieses Tool", - p2: "Fügen Sie Ihren SVG-Code in das Textfeld SVG Input links ein. Klicken Sie auf Preview, um die Grafik zu sehen und ihre Farbpalette zu extrahieren. Verwenden Sie die Schaltflächen Optimize oder Minify, um das Markup zu bereinigen und die Dateigröße zu reduzieren. Optional können Sie bestimmte Farben ersetzen, indem Sie neue Werte im Colors-Panel eingeben und auf Apply klicken. Klicken Sie auf Copy oder Download, um Ihr bereinigtes und optimiertes SVG zu speichern.", - heading3: "Häufige Anwendungsfälle", - p3: "Icon-Verwaltung, um aus Design-Tools wie Figma oder Illustrator exportierte SVGs zu bereinigen. Theming, um die Farben eines Icon-Sets schnell an Ihre Markenpalette anzupassen. Sicherheit, um SVGs aus nicht vertrauenswürdigen Quellen zu bereinigen und potenzielle Skripte oder externe Referenzen zu entfernen. Performance, um SVG-Markup zu minimieren, die Größe von Inline-Grafiken zu reduzieren und die Seitenladezeiten zu verbessern.", - heading4: "Profi-Tipps", - p4: "Verwenden Sie die Schaltfläche currentColor, um alle expliziten Füllungen und Konturen in currentColor umzuwandeln, sodass Ihr SVG leicht über CSS gestylt werden kann. Optimieren Sie Ihre SVGs immer, bevor Sie sie in der Produktion verwenden, um sicherzustellen, dass sie so klein wie möglich sind. Verwenden Sie beim Erstellen von SVGs in Design-Tools die Funktionen Outline Stroke und Simplify Path, um die Komplexität des generierten Codes vor der Optimierung zu reduzieren.", - }, cheatsheet: { title: "SVG-Sicherheitshinweise", h0: "Bereinigung", @@ -2801,16 +2479,6 @@ export default { text28: "Klicken Sie auf Scan, um Secrets zu finden.", text29: "✓ Kopiert", }, - edu: { - heading1: "Was sind Secret-Leaks?", - p1: "Secret-Leaks entstehen, wenn sensible Informationen wie API-Schlüssel, Passwörter oder private Tokens versehentlich in die Versionskontrolle committet oder in öffentlichen Foren geteilt werden. Diese Leaks können zu unbefugtem Zugriff, Datenschutzverletzungen und finanziellen Verlusten führen. Dieses Tool hilft, gängige Secret-Muster lokal in Ihrem Browser zu identifizieren, bevor Sie Ihren Code teilen oder committen.", - heading2: "So verwenden Sie dieses Tool", - p2: "Fügen Sie Ihren Code, Ihre Konfiguration oder Log-Dateien in das Eingabefeld ein. Klicken Sie auf die Schaltfläche Scan, um den Text auf mögliche Secrets zu analysieren. Sehen Sie sich die Befunde und Hinweise für jeden erkannten Eintrag an. Verwenden Sie die Schaltfläche Copy Redacted, um eine freigabesichere Version Ihres Textes mit maskierten Secrets zu erhalten.", - heading3: "Häufige Anwendungsfälle", - p3: "Pre-Commit-Prüfungen, um Ihren Code vor dem Commit zu scannen und sicherzustellen, dass keine Secrets enthalten sind. Log-Schwärzung, um sensible Tokens in Logs zu maskieren, bevor Sie sie mit Support oder Teammitgliedern teilen. Sicherheitsaudit, um Konfigurationsdateien schnell auf hartcodierte Anmeldedaten zu prüfen.", - heading4: "Profi-Tipps", - p4: "Rotieren Sie Ihre Anmeldedaten immer sofort, wenn Sie feststellen, dass sie geleakt wurden. Verwenden Sie Umgebungsvariablen oder Secret-Manager, anstatt Secrets in Ihrem Quellcode hartzucodieren. Aktivieren Sie Include low severity patterns für einen gründlicheren Scan, seien Sie aber auf mehr Fehlalarme gefasst.", - }, cheatsheet: { title: "Was tun, wenn Sie ein Secret finden", h0: "Sofortmaßnahmen", @@ -2907,16 +2575,6 @@ export default { text15: "✓ Gültige JWKS-Struktur (", text16: "Bitte fügen Sie einen JWK ein.", }, - edu: { - heading1: "Was ist ein JWT?", - p1: "Ein JSON Web Token (JWT) ist eine kompakte, URL-sichere Methode zur Darstellung von Claims, die zwischen zwei Parteien übertragen werden. Ein JWT besteht aus drei Base64URL-codierten, durch Punkte getrennten Teilen: dem Header (Algorithmus und Typ), dem Payload (Claims) und der Signatur. Die Signatur stellt sicher, dass das Token nicht manipuliert wurde. JWTs werden häufig zur Authentifizierung und zum Informationsaustausch in Web-APIs verwendet. Zu den Standard-Claims gehören sub (Subjekt), iss (Aussteller), aud (Zielgruppe), exp (Ablaufzeit), nbf (Not Before), iat (Ausgestellt am) und jti (JWT-ID).", - heading2: "JWT-Algorithmen", - p2: "HS256/384/512 verwendet HMAC mit SHA-2 und einem Shared Secret — einfach, aber beide Parteien müssen denselben Schlüssel besitzen. RS256/384/512 verwendet asymmetrische RSA-PKCS#1-v1.5-Signaturen — ideal für Microservice-Architekturen, bei denen Dienste nur den öffentlichen Schlüssel benötigen. ES256/384/512 verwendet ECDSA mit NIST-Kurven für kleinere Signaturen als RSA bei gleichwertiger Sicherheit. PS256/384/512 verwendet RSA-PSS, eine probabilistische Variante, die in modernen Systemen gegenüber RS* bevorzugt wird.", - heading3: "JWK und JWKS", - p3: "Ein JSON Web Key (JWK) ist eine JSON-Struktur, die einen kryptografischen Schlüssel darstellt. Ein JWK-Set (JWKS) ist eine JSON-Struktur, die ein Array von JWKs unter der Eigenschaft keys enthält. Dienste veröffentlichen ihr JWKS unter einer bekannten URL (z. B. /.well-known/jwks.json), sodass Clients öffentliche Schlüssel zur JWT-Verifizierung abrufen können, ohne einen Out-of-Band-Schlüsselaustausch. Schlüssel in einem JWKS werden durch ihre kid (Key ID) identifiziert, auf die JWT-Header verweisen.", - heading4: "Sicherheits-Best-Practices", - p4: "Validieren Sie die Claims exp, nbf, iss und aud immer serverseitig. Verwenden Sie niemals den Algorithmus alg: none in der Produktion — er entfernt jeglichen Signaturschutz. Bevorzugen Sie asymmetrische Algorithmen (RS*, ES*, PS*) gegenüber HMAC, wenn mehrere Dienste Tokens verifizieren müssen. Rotieren Sie Schlüssel regelmäßig und verwenden Sie kid, um zu identifizieren, welcher Schlüssel zum Signieren jedes Tokens verwendet wurde. Bewahren Sie private Schlüssel sicher auf — committen Sie sie niemals in die Versionskontrolle. Verwenden Sie kurze Ablaufzeiten und Refresh-Tokens statt langlebiger JWTs.", - }, }, "encoding-workbench": { name: "Codierungs-Werkbank", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "Keine erkennbaren Codierungsebenen gefunden.", }, - edu: { - heading1: "Was ist der Unterschied zwischen Codierung und Hashing?", - heading2: "So verwenden Sie dieses Tool", - heading3: "Geschichtete Codierung erklärt", - heading4: "Leitfaden zu Hash-Algorithmen", - p1: "

Codierung wandelt Daten in eine andere Darstellung um, die umgekehrt (decodiert) werden kann. Gängige Formate sind Base64 — verwendet zur Übertragung binärer Daten über Textkanäle —, URL-Codierung, HTML-Entity-Codierung und Hexadezimal. Codierung ist keine Verschlüsselung; sie bietet keine Vertraulichkeit.

Hashing ist eine mathematische Einwegtransformation. Eine kryptografische Hashfunktion nimmt eine beliebige Eingabe und erzeugt einen Fingerabdruck fester Länge. Sie können einen Hash nicht umkehren, um die ursprüngliche Eingabe wiederherzustellen. Hashes werden verwendet, um die Dateiintegrität zu überprüfen, Passwörter sicher zu speichern und digitale Signaturen zu erzeugen.

", - p2: "
  1. Tab Encode / Decode: Fügen Sie Text ein und wählen Sie eine Operation (Base64, URL, HTML, Hex), oder klicken Sie auf Auto-Detect Layers, um mehrere verschachtelte Codierungen automatisch aufzulösen.
  2. Tab Hash: Geben Sie Text ein oder wählen Sie eine Datei, wählen Sie Algorithmen aus und klicken Sie auf Hash All. Aktivieren Sie den HMAC-Modus, um geschlüsselte Hashes mit einem Shared Secret zu berechnen.
  3. Tab Identify: Fügen Sie einen unbekannten Hash oder eine codierte Zeichenkette ein und klicken Sie auf Identify, um wahrscheinliche Algorithmen mit Zuverlässigkeitsbewertungen zu sehen.
", - p3: "

Reale Daten werden oft mehrfach codiert. Zum Beispiel könnte ein Payload URL-codiert, dann Base64-codiert und dann in einen Hex-String eingebettet werden. Die Funktion Auto-Detect Layers untersucht das Eingabemuster, versucht jede Decodierung nacheinander und visualisiert jeden Schritt als Karte, sodass Sie genau sehen können, wie die Daten verpackt wurden.

", - p4: "", - }, }, "oauth-debugger": { name: "OAuth-Debugger", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "Was ist PKCE, und warum ist es wichtig?", - p1: "

Proof Key for Code Exchange (PKCE, RFC 7636) wurde ursprünglich für mobile und native Apps entwickelt, die kein Client-Secret sicher speichern können. Dabei generiert der Client einen zufälligen code_verifier, leitet daraus eine code_challenge ab (SHA-256 + base64url) und sendet die Challenge mit der Autorisierungsanfrage. Beim Austausch des Autorisierungscodes gegen Tokens sendet der Client den ursprünglichen code_verifier. Der Autorisierungsserver überprüft, ob er mit der früheren Challenge übereinstimmt — und beweist so, dass die Token-Anfrage vom selben Client stammt, der den Flow gestartet hat.

Selbst für vertrauliche Clients (serverseitige Apps mit einem Client-Secret) wird PKCE inzwischen von OAuth 2.1 als Schutz gegen Interception-Angriffe auf Autorisierungscodes empfohlen.

", - heading2: "Warum ist der Implicit Flow veraltet?", - p2: "

Der Implicit Flow (response_type=token) wurde als Abkürzung für Single-Page-Apps konzipiert und gibt das Access Token direkt im URL-Fragment zurück. Das verursacht ernste Probleme: Tokens in URLs erscheinen im Browserverlauf, in Server-Logs und in Referrer-Headern, und der Flow ist anfällig für Token-Injection-Angriffe. OAuth 2.0 Security Best Current Practice (RFC 9700) und OAuth 2.1 entfernen den Implicit Flow explizit zugunsten von Authorization Code + PKCE, das SPAs sicher ohne Client-Secret verwenden können.

", - heading3: "Wichtige Änderungen in OAuth 2.1", - p3: "", - heading4: "Authorization Code Flow Schritt für Schritt", - p4: "
  1. PKCE-Paar generieren: Erstellen Sie einen zufälligen code_verifier und berechnen Sie code_challenge = BASE64URL(SHA256(code_verifier)).
  2. Weiterleitung zum Authorization-Endpunkt: Fügen Sie response_type=code, client_id, redirect_uri, scope, state, code_challenge und code_challenge_method=S256 hinzu.
  3. Der Benutzer authentifiziert sich beim Autorisierungsserver und erteilt seine Zustimmung.
  4. Empfang des Autorisierungscodes an Ihrer redirect_uri zusammen mit dem zurückgegebenen state — überprüfen Sie, ob state mit dem gesendeten Wert übereinstimmt.
  5. Code gegen Tokens tauschen: POST an den Token-Endpunkt mit grant_type=authorization_code, code, redirect_uri, client_id und code_verifier.
  6. Empfang des Access Tokens (und optional id_token und refresh_token) und Verwendung zum Aufrufen von APIs.
", - }, }, "ladder-game": { name: "Leiterspiel", diff --git a/src/i18n/en.js b/src/i18n/en.js index d0bcfd5..b52c941 100644 --- a/src/i18n/en.js +++ b/src/i18n/en.js @@ -50,35 +50,6 @@ export default { searchResultsLabel: "Search Results", noResults: "No tools found matching your search.", noResultsHint: "Try a different search term.", - editorialTitle: "What runs in the tab", - editorialP1: - "JSON.parse, Web Crypto, and the other browser APIs do the work. The Worker that serves the HTML does not receive the payload you paste into a tool.", - editorialP2: - "Several formatter sites store pastes and expose them through predictable share URLs. In November 2025, researchers showed years of saved JSON and code from those services included cloud keys, JWTs, and internal configs. A formatter that never uploads the document has no Recent Links page to scrape.", - editorialP3: - "Ads, when they appear, are labeled and non-personalized. They stay off password, SSH, Token Studio, WireGuard, certificate, secret-scanner, encoding, and pipe pages.", - flagshipsTitle: "Eight tools people bookmark", - flagshipJson: - "Pretty-print, minify, and validate RFC 8259 JSON with line-level errors. No stored document, no share URL.", - flagshipJwt: - "Inspect JWT header and payload locally, generate keys, and simulate JWKS. The browser, extensions, and clipboard still see what you paste.", - flagshipRegex: - "Railroad diagrams and live matches so you can explain a pattern before you ship it.", - flagshipCron: - "Edit a five-field crontab and see the next run times in plain language.", - flagshipPassword: - "Draws from crypto.getRandomValues. Prefer a password manager for storage.", - flagshipSsh: - "Defaults to Ed25519, with ECDSA P-256 and RSA for older appliances. Private keys stay in the tab.", - flagshipCurl: - "Parse a curl command into method, URL, headers, and body, or build one from the form.", - flagshipCidr: - "Expand IPv4 and IPv6 CIDR into network, broadcast, host range, and reverse DNS labels.", - howToTitle: "How to use it", - howToP1: - "Open a tool, paste or type, copy the result. Language and theme stay in localStorage on this device. Homepage search filters the catalog; ?q= deep-links that filter.", - howToP2: - "About, Privacy, and Terms cover the ads allow-list and edge logs. Security reports go to security@simpletool.app.", meta: { title: "SimpleTool — Developer tools in the browser", description: "Client-side developer tools: JSON formatter, JWT inspector, regex tester, cron builder, password generator, SSH/certs, curl studio, and CIDR calculator.", @@ -125,16 +96,6 @@ export default { text7: "✓ Copied", tpl8: "Max Depth", }, - edu: { - heading1: "What is JSON?", - p1: "

JSON (JavaScript Object Notation) is the text format most HTTP APIs and many config files speak. RFC 8259 is the grammar: objects, arrays, strings, numbers, booleans, and null. It is language-independent. A Python service and a browser tab can exchange the same bytes.

This formatter exists because production JSON is usually minified, and minified JSON is where people miss a missing comma or an extra trailing one. Parse it here, in the tab, instead of posting it to a site that keeps a copy.

", - heading2: "How to Use This Tool", - p2: "
  1. Paste your raw or messy JSON data into the Input JSON editor on the left.
  2. Click the Format button to beautify the code with proper indentation and syntax highlighting.
  3. Alternatively, use the Minify button to remove all whitespace for production use.
  4. Check the Status indicator to ensure your JSON is valid; if there is an error, the tool will highlight the exact line.
  5. Click Copy to save the formatted result to your clipboard or Clear to start over.
", - heading3: "Common Use Cases", - p3: "", - heading4: "Pro Tips", - p4: "", - }, }, "jwt-decoder": { name: "JWT Inspector", @@ -174,22 +135,6 @@ export default { status5: "Algorithm: ", status6: "Decoding Failed", }, - edu: { - heading1: "What is JWT?", - p1: "

JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object. This information can be verified and trusted because it is digitally signed. JWTs can be signed using a secret (with the HMAC algorithm) or a public/private key pair using RSA or ECDSA.

Because of their compact size, JWTs are commonly used in authentication and information exchange scenarios, such as Bearer tokens in HTTP Authorization headers.

", - heading2: "How to Use This Tool", - p2: "
  1. Paste your token: Copy your encoded JWT (header.payload.signature) and paste it into the input field.
  2. Automatic Decode: The tool will automatically detect the token and decode its components in real-time.
  3. Inspect Header: Review the algorithm (alg) and token type (typ) in the Header section.
  4. Analyze Payload: Examine the claims, such as expiration (exp), issuer (iss), and subject (sub) in the Payload section.
  5. Verify Claims: Check the Claim Analysis box for human-readable dates and validation status.
", - heading3: "Common Use Cases", - p3: "", - heading4: "Pro Tips", - p4: "", - heading5: "Token Structure (header.payload.signature)", - p5: "

A JWT typically consists of three parts separated by dots:

", - heading6: "Security Considerations", - p6: "

While JWTs are signed to ensure integrity, they are typically NOT encrypted. This means that anyone who has the token can decode the header and payload to read the information inside. Never store sensitive information like passwords or private keys in a JWT payload.

Additionally, always verify the exp (expiration) claim to prevent replay attacks, and ensure your server validates the signature before trusting the data in the payload.

", - heading7: "Pro Tips", - p7: "", - }, cheatsheet: { title: "JWT Quick Reference", h0: "Structure", @@ -229,16 +174,6 @@ export default { text0: "✓ Copied!", tpl1: "GUID:", }, - edu: { - heading1: "What is a UUID?", - p1: "A Universally Unique Identifier (UUID) is a 128-bit number used to uniquely identify information in computer systems. They are designed to be generated independently without a central authority while maintaining a negligible probability of collision.", - heading2: "How to Use This Tool", - p2: "Select the UUID version (v1 for time-based, v4 for random) and the number of IDs you need. Click Generate to create a list of unique identifiers ready for use in your database or application.", - heading3: "Common Use Cases", - p3: "Primary keys in distributed databases, session identifiers, transaction tracking, and naming temporary files or resources where uniqueness is critical across multiple systems.", - heading4: "Pro Tips", - p4: "UUID v4 is the most common choice for general-purpose unique IDs because it relies on high-quality randomness. Use v1 if you need to sort IDs by creation time.", - }, }, "password-generator": { name: "Password Generator", @@ -301,24 +236,6 @@ export default { status6: "Weak", text1: "Please enter a valid base email address.", }, - edu: { - heading1: "What Makes a Password Secure?", - p1: "

A secure password is your first line of defense against unauthorized access. In the modern era of high-speed computing, secure is defined by entropy — the measure of randomness and unpredictability in a string. A strong password should be long (at least 16 characters), unique to every account, and composed of a diverse set of character types including uppercase, lowercase, numbers, and symbols.

Avoid using personal information like birthdays, pet names, or common dictionary words. Even complex-looking substitutions like P@ssw0rd123 are easily cracked by modern brute-force tools that use massive dictionaries of common patterns.

", - heading2: "How to Use This Tool", - p2: "
  1. Select your mode: Choose between Password, Username, Passphrase, or Email Alias depending on your needs.
  2. Adjust length: Use the slider to set the desired length. For passwords, 16+ characters is recommended for high security.
  3. Configure options: Toggle character sets (symbols, numbers, etc.) or styles (readable vs. secure).
  4. Generate: Click the Generate button to create your unique credential.
  5. Copy: Use the copy icon to safely move the result to your clipboard or password manager.
", - heading3: "Common Use Cases", - p3: "", - heading4: "Pro Tips", - p4: "", - heading5: "What Makes a Password Secure?", - p5: "

A secure password is your first line of defense against unauthorized access. In the modern era of high-speed computing, secure is defined by entropy — the measure of randomness and unpredictability in a string. A strong password should be long (at least 16 characters), unique to every account, and composed of a diverse set of character types including uppercase, lowercase, numbers, and symbols.

Avoid using personal information like birthdays, pet names, or common dictionary words. Even complex-looking substitutions like P@ssw0rd123 are easily cracked by modern brute-force tools that use massive dictionaries of common patterns.

", - heading6: "Entropy Explained", - p6: "

Entropy is a measure of the randomness and unpredictability of a password, typically expressed in bits. The higher the entropy, the stronger the password. For example, a 10-character password using only lowercase letters has much lower entropy than a 10-character password using a full set of alphanumeric and special characters.

Our generator calculates entropy in real-time to give you an objective measure of your password strength. A password with over 100 bits of entropy is considered exceptionally strong and resistant to modern cracking techniques.

", - heading7: "Best Practices", - p7: "", - heading8: "Pro Tips", - p8: "", - }, }, "hash-calculator": { name: "Hash Calculator", @@ -386,16 +303,6 @@ export default { tpl4: "Awaiting input...", text2: "Computed: ", }, - edu: { - heading1: "What is Hashing?", - p1: "

Cryptographic hashing is a mathematical process that transforms any input data (text or files) into a fixed-size string of characters, typically a hexadecimal number. This fingerprint is unique to the input; even a single bit change in the source data will result in a completely different hash, a phenomenon known as the avalanche effect.

Unlike encryption, hashing is a one-way function. You cannot reverse a hash to retrieve the original data. This makes it ideal for verifying data integrity, storing passwords securely (when combined with salts), and identifying files without exposing their contents.

", - heading2: "How to Use This Tool", - p2: "
  1. Select Input Type: Choose the Text tab for strings or the File tab for local files.
  2. Provide Input: Paste your text or drag and drop your file into the workspace.
  3. Optional HMAC: Enter a secret key in the HMAC field if you need to generate a keyed hash for authentication.
  4. Review Results: The tool automatically computes multiple hash variants (SHA-256, SHA-512, etc.) in real-time.
  5. Verify Integrity: Use the Verify tab to compare a known hash against your input to check for tampering.
", - heading3: "Common Use Cases", - p3: "", - heading4: "Pro Tips", - p4: "", - }, cheatsheet: { title: "Hash Algorithm Reference", h0: "Algorithm Comparison", @@ -471,16 +378,6 @@ export default { text5: "Use at least /", text6: "IPv6 /", }, - edu: { - heading1: "What is CIDR?", - heading2: "How to Use This Tool", - heading3: "Common Use Cases", - heading4: "Pro Tips", - p1: "Classless Inter-Domain Routing (CIDR) is a method for allocating IP addresses and IP routing. It replaced the older system based on classes (A, B, and C) to provide more flexibility and efficiency in address distribution.", - p2: "Enter an IP address with a prefix (e.g., 192.168.1.0/24) or use the slider to adjust the prefix length. Click \"Run analysis\" to see network details, usable host ranges, and binary representations.", - p3: "Planning network subnets for cloud infrastructure (VPCs), troubleshooting routing issues, calculating host capacity for a given prefix, and converting between CIDR and subnet masks.", - p4: "Remember that in IPv4, the first and last addresses in a subnet are typically reserved for the network ID and broadcast address. In IPv6, subnets are almost always /64 for standard local networks.", - }, cheatsheet: { title: "Subnet Quick Reference", h0: "Common Subnets", @@ -655,16 +552,6 @@ export default { tpl3: "Change defaults:", tpl4: "No ports found matching your search.", }, - edu: { - heading1: "Port Categories & Security Guide", - p1: "Well-known ports (0-1023) are assigned by IANA and require root privileges on Unix systems. Registered ports (1024-49151) are used by applications. Dynamic/ephemeral ports (49152-65535) are used for client-side connections. Understanding port ranges is essential for firewall configuration and network security.", - heading2: "How to Use This Tool", - p2: "Search by port number or service name to find protocol details and security risk levels. Filter by category (Well-Known, Registered, Dynamic) or protocol (TCP/UDP) to narrow results. Click any row to see full details including common vulnerabilities and hardening recommendations.", - heading3: "Common Use Cases", - p3: "Firewall rule configuration, network troubleshooting, identifying unexpected open ports during security audits, and quick reference for protocol port assignments.", - heading4: "Pro Tips", - p4: "Use the risk filter to quickly identify high-risk ports in your network. The Top 50 Most Common Ports section gives you an instant overview of the most frequently used services.", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
PortServiceRisk
21FTPUnencrypted file transfers
23TelnetPlain text authentication
25SMTPEmail spam relay risk
53DNSDDoS amplification attacks
445SMBRansomware propagation
3389RDPBrute force attacks
", @@ -908,16 +795,6 @@ export default { text4: "Warnings", alert0: "Please generate a configuration first", }, - edu: { - heading1: "About WireGuard", - p1: "WireGuard is a modern, high-performance VPN protocol that uses state-of-the-art cryptography. It is designed to be simpler and faster than older protocols like OpenVPN and IPsec, with a much smaller attack surface due to its minimal codebase. WireGuard is now part of the Linux kernel and is supported natively on Windows, macOS, iOS, and Android.", - heading2: "How to Use This Tool", - p2: "Select a topology template (Point-to-Point, Hub-and-Spoke, Site-to-Site, or Road Warrior) to pre-fill a configuration. Click Generate Keys to create a new key pair locally in your browser. Fill in the required fields and click Generate Config to produce the WireGuard configuration file. Use Download .conf to save the file or Generate QR to create a QR code for mobile import.", - heading3: "Common Use Cases", - p3: "Remote access VPN for employees connecting to company networks. Site-to-site VPN for connecting branch office networks. Personal VPN server for secure browsing on public Wi-Fi. IoT device tunneling for secure communication between embedded devices.", - heading4: "Pro Tips", - p4: "Use PersistentKeepalive = 25 on clients behind NAT to maintain the tunnel when no traffic is flowing. PresharedKey adds an additional layer of symmetric encryption for post-quantum resistance. AllowedIPs = 0.0.0.0/0 routes all traffic through the tunnel (full tunnel), while specific CIDRs create a split tunnel.", - }, cheatsheet: { title: "WireGuard Quick Reference", h0: "Interface Fields", @@ -1061,14 +938,6 @@ export default { tpl6: "Example:", tpl7: "Click on any field in the diagram to see details.", }, - edu: { - heading1: "What are Protocol Headers?", - p1: "Protocol headers are structured data that precede the payload in network packets. They contain control information such as source and destination addresses, protocol types, sequence numbers, and checksums. Understanding header structure is essential for network debugging, packet analysis, and protocol implementation.", - heading2: "How to Use This Tool", - p2: "Select a protocol from the tabs to view its header structure. Each colored block represents a field with its size indicated. Click on any field to see detailed information including field name and description, bit/byte offset, common values and their meanings, and RFC reference. Use the hex dump parser to analyze real packet captures by pasting hex output from tools like tcpdump or Wireshark.", - heading3: "Common Use Cases", - p3: "Packet analysis to understand the structure of captured network traffic, protocol learning as a visual aid for studying network protocols, debugging to identify malformed headers or incorrect field values, and development reference when implementing network protocols.", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
ValueProtocol
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
FieldSizeDescription
Source Port2 bytesSender port number
Dest Port2 bytesReceiver port number
Seq Number4 bytesSequence number
Ack Number4 bytesAcknowledgment number
Data Offset4 bitsHeader length / 4
Flags9 bitsNS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 bytesReceive window size
", @@ -1144,16 +1013,6 @@ export default { tpl0: "Differences", tpl1: "No differences found (or empty input)", }, - edu: { - heading1: "What is Text Diffing?", - p1: "Text diffing is the process of comparing two sequences of data to identify the differences between them. It highlights what has been added, removed, or modified. This is a fundamental operation in software development, data analysis, and content management, allowing users to track changes over time or compare different versions of a document.", - heading2: "Diff Algorithms", - p2: "Most text diffing tools use algorithms based on the Longest Common Subsequence (LCS) problem. The goal is to find the longest sequence of elements that appear in both texts in the same relative order. Common implementations include the Myers diff algorithm, which is highly efficient and used by Git, and the Hunt-McIlroy algorithm. These algorithms calculate the minimum number of edits required to transform one text into another.", - heading3: "Use Cases", - p3: "Code reviews so developers can see exactly what changed in a pull request. Version control systems like Git store history as a series of diffs to save space. Content auditing for writers and editors comparing drafts to ensure all requested changes were made. Data validation for comparing configuration files or database exports to find discrepancies.", - heading4: "Pro Tips", - p4: "Many diff tools have options to ignore changes in indentation or trailing spaces, which can reduce noise when comparing code. Include a few lines of unchanged text around differences (context lines) to understand the impact of changes. Word-level diffs are often more useful for prose and natural language documents while line-level diffs are standard for code.", - }, }, "regex-visualizer": { name: "Regex Studio", @@ -1204,16 +1063,6 @@ export default { tpl5: "No groups", tpl6: "Invalid Regular Expression", }, - edu: { - heading1: "What are Regular Expressions?", - p1: "Regular expressions (regex) are powerful patterns used to match character combinations in strings. They are essential tools for text processing, validation, and data extraction across programming languages. Regex patterns consist of literal characters and special metacharacters that define search rules. They are used in form validation, log parsing, search and replace operations, and data cleaning tasks.", - heading2: "How to Use This Tool", - p2: "Enter your regex pattern in the input field. The tool will automatically generate a railroad diagram visualizing the pattern structure. Add test text to see real-time match highlighting and explanations. Use the cheatsheet for quick reference on common patterns and syntax. Generate code snippets for your preferred programming language.", - heading3: "Common Use Cases", - p3: "Email validation to ensure user input matches proper email format before processing, log parsing to extract timestamps and IP addresses from server logs, data cleaning to remove unwanted characters or format phone numbers consistently, and search and replace for bulk text transformations with pattern matching.", - heading4: "Pro Tips", - p4: "Start simple and build complex patterns incrementally. Use non-capturing groups (?:) when you do not need to reference the match. Test edge cases like empty strings and special characters. Consider regex readability — complex patterns can be documented with comments.", - }, cheatsheet: { title: "Regex Quick Reference", h0: "Character Classes", @@ -1359,16 +1208,6 @@ export default { text1: "Copy", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "About SSH Keys", - p1: "SSH keys are a pair of cryptographic keys used for secure authentication to remote systems. The private key remains on your machine while the public key is placed on the server. This asymmetric approach is far more secure than password authentication and is the industry standard for server access, Git hosting, and automated deployments.", - heading2: "How to Use This Tool", - p2: "Select your preferred key type (RSA or ECDSA) and, for RSA, choose the key size. Add an optional comment to identify the key (commonly user@host). Click Generate to create your key pair. Copy the public key to add to your server and keep the private key secure on your local machine.", - heading3: "Common Use Cases", - p3: "Server authentication for passwordless SSH login to remote servers. Git hosting to authenticate with GitHub, GitLab, or Bitbucket without passwords. CI/CD pipelines for automated deployment scripts that need to connect to servers. Bastion host access for secure jump-host configurations.", - heading4: "Pro Tips", - p4: "Ed25519 keys are recommended for new deployments — they are faster and more secure than RSA. Always protect your private key with a strong passphrase. Use the ssh-agent to avoid entering your passphrase repeatedly during a session. Store keys in ~/.ssh/ with permissions set to 600.", - }, cheatsheet: { title: "SSH Key Quick Reference", h0: "Key Types", @@ -1408,16 +1247,6 @@ export default { tpl2: "No Subject Alternative Names present.", tpl3: "No extensions parsed.", }, - edu: { - heading1: "What are X.509 Certificates?", - heading2: "How to Use This Tool", - heading3: "Common Use Cases", - heading4: "Pro Tips", - p1: "

X.509 is a standard format for public key certificates, which are digital documents that securely bind a public key to an identity (such as a website, organization, or individual). These certificates are the foundation of the Public Key Infrastructure (PKI) used to secure the internet via HTTPS, as well as for signing emails and software.

An X.509 certificate contains the public key, the identity of the certificate holder, and the digital signature of the Certificate Authority (CA) that issued the certificate, proving its authenticity.

", - p2: "
  1. Paste your certificate: Copy your PEM-encoded certificate (including the BEGIN and END headers) and paste it into the input field.
  2. Parse: Click \"Parse Certificate\" to extract and analyze the data.
  3. Review Summary: Check the top cards for the Common Name (CN), Issuer, and validity dates.
  4. Inspect Details: Expand the sections below to see the full Subject, Issuer, SANs, and technical extensions.
  5. Check Status: Look at the status badge to see if the certificate is currently valid or expired.
", - p3: "", - p4: "", - }, cheatsheet: { title: "X.509 Certificate Reference", h0: "Certificate Fields", @@ -1460,16 +1289,6 @@ export default { text1: "Copy JSON", text2: "Copy XML", }, - edu: { - heading1: "What is SAML?", - p1: "Security Assertion Markup Language (SAML) is an XML-based open standard for exchanging authentication and authorization data between parties, in particular, between an Identity Provider (IdP) and a Service Provider (SP). SAML is the backbone of many Enterprise Single Sign-On (SSO) solutions, allowing users to access multiple applications with a single set of credentials. The most common version is SAML 2.0, which uses security tokens containing assertions to pass information about a principal between the IdP and the SP.", - heading2: "How to Use This Tool", - p2: "Paste the Base64-encoded SAMLResponse or raw XML into the input field. Toggle Attempt to inflate if decoding a Redirect binding payload. Click Decode response to parse the message. Check the Quick summary for the Issuer, Subject, and validity status. View decoded user attributes in the Attributes table. Use the tabs to see Pretty XML, Assertion details, or a JSON representation of the claims.", - heading3: "Common Use Cases", - p3: "SSO troubleshooting by diagnosing why a user cannot log in by checking for expired assertions or audience mismatches. Integration testing to verify that your Identity Provider is sending the correct attributes. Security auditing to inspect the raw XML and ensure assertions are properly signed. Development to quickly view the contents of a SAML message during Service Provider integration.", - heading4: "Pro Tips", - p4: "SAML messages sent via HTTP-Redirect are usually deflated (compressed) before being Base64 encoded — if your decode fails, try toggling the Attempt to inflate checkbox. Ensure the AudienceRestriction matches your SP Entity ID. If a response is marked invalid, check the NotBefore and NotOnOrAfter times for clock skew between the IdP and SP clocks.", - }, cheatsheet: { title: "SAML Quick Reference", h0: "SAML Flow", @@ -1512,16 +1331,6 @@ export default { alert1: "Please enter a User-Agent string", tpl2: "Raw Analysis Output", }, - edu: { - heading1: "What is a User-Agent?", - p1: "A User-Agent is a string sent by your browser to every website you visit. It identifies the browser version, operating system, and device type, allowing servers to optimize content for your specific environment.", - heading2: "How to Use This Tool", - p2: "Paste a User-Agent string into the input box or click Use This to analyze your current browser string. The tool will break down the browser engine, OS version, and device characteristics.", - heading3: "Common Use Cases", - p3: "Debugging website compatibility issues, analyzing web server logs to identify bot traffic, verifying browser spoofing, and understanding device distribution in your audience.", - heading4: "Pro Tips", - p4: "Many modern browsers freeze or simplify their User-Agent strings to prevent fingerprinting. Always look for the Version or Chrome tokens for the most accurate version info.", - }, }, "qr-code": { name: "QR Code Studio", @@ -1560,16 +1369,6 @@ export default { alert3: "Copied!", tpl4: "Upload an image to decode", }, - edu: { - heading1: "What are QR Codes?", - p1: "Quick Response (QR) codes are two-dimensional barcodes that can store various types of data, most commonly URLs. They can be scanned by smartphones and specialized readers to quickly access information or trigger actions.", - heading2: "How to Use This Tool", - p2: "Enter the text or URL you want to encode. Adjust the size and error correction level if needed. The QR code updates in real-time and can be downloaded as an image for print or digital use.", - heading3: "Common Use Cases", - p3: "Sharing website links, providing Wi-Fi credentials, digital business cards (vCards), event ticketing, and mobile payments or authentication flows.", - heading4: "Pro Tips", - p4: "Higher error correction levels (H or Q) allow the QR code to remain scannable even if partially damaged or obscured, which is ideal for physical signage or branding.", - }, }, "timestamp-converter": { name: "Timestamp Converter", @@ -1600,16 +1399,6 @@ export default { text0: "Invalid timestamp", tpl1: "Unix (milliseconds)", }, - edu: { - heading1: "What is Unix Time?", - p1: "Unix time (also known as Epoch time, POSIX time, or Unix timestamp) is a system for describing a point in time. It is the number of seconds that have elapsed since the Unix Epoch, minus leap seconds; the Unix Epoch is 00:00:00 UTC on 1 January 1970. It is widely used in operating systems and file formats because it is a single integer, making it easy for computers to store and manipulate. This standard allows different systems to communicate time accurately regardless of their local timezone settings.", - heading2: "How to Use This Tool", - p2: "To convert Unix to Human: Enter the timestamp in the Unix Timestamp field and select whether it is in seconds or milliseconds. To convert Human to Unix: Select the date and time using the pickers, then choose your desired timezone. Use the Now button to quickly grab the current timestamp. View results in real-time, including ISO 8601, Local Time, UTC, and relative time. Click the Copy button next to any result to save it to your clipboard.", - heading3: "Common Use Cases", - p3: "Log analysis to convert cryptic timestamps found in server logs or database entries into readable dates for debugging. API development to verify that your backend is sending the correct epoch values. Data migration to ensure time-based data remains consistent when moving between systems. Scheduling to calculate future or past timestamps for cron jobs, expiration dates, or event triggers.", - heading4: "Pro Tips", - p4: "When working with JavaScript, remember that Date.now() returns milliseconds, while standard Unix timestamps are in seconds — divide by 1000 to convert. Always use the ISO 8601 format for data exchange between systems to ensure maximum compatibility. Be aware of the Year 2038 problem where 32-bit signed integers will overflow; modern systems use 64-bit integers which solves this for the foreseeable future.", - }, }, "color-converter": { name: "Color Converter", @@ -1625,16 +1414,6 @@ export default { badge7: "Client-Side Only", badge8: "Privacy First", }, - edu: { - heading1: "Color Models Explained (HEX/RGB/HSL)", - heading2: "How to Use This Tool", - heading3: "Common Use Cases", - heading4: "Pro Tips", - p1: "

Color models are mathematical systems for representing colors. HEX (Hexadecimal) is a 6-digit code used in HTML and CSS, representing Red, Green, and Blue components. RGB (Red, Green, Blue) uses decimal values from 0 to 255 for each channel, often used in digital imaging.

HSL (Hue, Saturation, Lightness) is more intuitive for humans, as it describes color in terms of its base pigment (Hue), intensity (Saturation), and brightness (Lightness). Understanding these models helps in choosing the right format for your design and development needs, ensuring consistency across different platforms and devices.

", - p2: "
  1. Use the visual color picker to select a color by dragging the cursor in the saturation/brightness square and the hue slider.
  2. Alternatively, enter a specific value in the \"Manual Input\" field (supports #hex, rgb, or hsl formats).
  3. Observe the \"Preview\" box to see the selected color in real-time.
  4. View the converted values in the HEX, RGB, HSL, and HSV cards below.
  5. Click the \"Copy\" icon on any card to save that specific format to your clipboard.
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "Unit Converter", @@ -1652,16 +1431,6 @@ export default { text0: "Select units to see the conversion formula", text1: "Enter a valid number", }, - edu: { - heading1: "Measurement Systems Overview", - p1: "Measurement systems are collections of units of measurement and rules relating them to each other. The two most common systems are the Metric System (International System of Units or SI) and the Imperial System. The Metric system is based on powers of ten, making it highly logical and easy to scale. The Imperial system, primarily used in the United States, uses units like inches, feet, and pounds which have historical origins and less uniform conversion factors. Understanding the differences between these systems is essential for science, engineering, international trade, and daily tasks like cooking or traveling.", - heading2: "How to Use This Tool", - p2: "Select the measurement category (e.g., Length, Weight, Temperature) from the grid at the top. Choose the unit you want to convert from in the From dropdown menu. Enter the value you wish to convert in the input field. Select the target unit in the To dropdown menu. The converted value will appear instantly along with the mathematical formula used for the conversion.", - heading3: "Common Use Cases", - p3: "Travel to convert distances from kilometers to miles or temperatures from Celsius to Fahrenheit. Cooking to translate recipes between metric (grams/milliliters) and imperial (ounces/cups) measurements. Engineering and science for precise conversions between different units of pressure, energy, or speed. Digital storage to understand the difference between Megabytes, Gigabytes, and Terabytes.", - heading4: "Pro Tips", - p4: "Use the Swap button to quickly reverse the conversion direction between your selected units. Always double-check the specific unit type, especially for volume and weight, as names can be similar across different systems such as US vs. UK gallons. When performing multiple conversions in a sequence, keep as many decimal places as possible until the final result to avoid cumulative rounding errors.", - }, }, "yaml-toml-converter": { name: "Config Converter", @@ -1695,16 +1464,6 @@ export default { text6: "⚠️ TOML conversion failed:", tpl7: "Await conversion.", }, - edu: { - heading1: "YAML vs TOML vs JSON Compared", - p1: "JSON is the most widely used format for data exchange due to its simplicity and native support in JavaScript. YAML (YAML Ain't Markup Language) is a human-friendly data serialization standard that uses indentation to represent structure, making it popular for complex configuration files. TOML (Tom's Obvious, Minimal Language) is designed to be easy to read and write due to its obvious semantics and is often used for project configuration. While JSON is strict and compact, YAML and TOML prioritize human readability and ease of manual editing.", - heading2: "How to Use This Tool", - p2: "Paste your configuration data (JSON, YAML, or TOML) into the source text area on the left. The tool will automatically detect the source format, or you can select it manually from the dropdown. Click Validate only to check for syntax errors without performing a conversion. Click one of the conversion buttons (to JSON, to YAML, to TOML) to translate your data into that format. View the results in the output panels on the right and click Copy to save them to your clipboard.", - heading3: "Common Use Cases", - p3: "Infrastructure as Code to convert between JSON and YAML when working with Kubernetes manifests, Docker Compose files, or AWS CloudFormation templates. Project configuration to migrate settings between package.json (JSON) and pyproject.toml or Cargo.toml (TOML). API prototyping to quickly visualize how a complex data structure looks in different formats. Legacy migration to translate old configuration files into modern formats while ensuring data integrity.", - heading4: "Pro Tips", - p4: "Use YAML for CI/CD pipelines where readability of complex nested structures is essential for maintainability. Prefer TOML for application-level configuration files to provide a clean interface for end-users who might need to edit them manually. When converting from YAML to JSON, be aware of YAML type coercion issues (where NO can be interpreted as false) and ensure your data types are preserved correctly.", - }, cheatsheet: { title: "Format Comparison", h0: "Syntax Differences", @@ -1755,16 +1514,6 @@ export default { text1: "Copy", text2: "Copied!", }, - edu: { - heading1: "What is htpasswd?", - p1: "

The htpasswd file is a flat-file database used to store usernames and hashed passwords for basic authentication on Apache and Nginx web servers. It is a simple but effective way to protect specific directories or administrative panels on a website without needing a full database-backed authentication system.

Each line in an htpasswd file represents a single user and follows the format username:hashed_password.

", - heading2: "How to Use This Tool", - p2: "
  1. Enter Username: Type the username you want to use for authentication.
  2. Provide Password: Enter a password or click Generate strong to create a secure one.
  3. Select Algorithm: Choose Bcrypt (-B) for modern security or Apache MD5 (-m) for legacy compatibility.
  4. Generate: Click Generate entry to create the hashed string.
  5. Copy or Download: Copy the resulting line to your clipboard or download it as a file to upload to your server.
", - heading3: "Common Use Cases", - p3: "", - heading4: "Pro Tips", - p4: "", - }, }, "mock-data-generator": { name: "Mock Data Generator", @@ -1798,16 +1547,6 @@ export default { text1: "Copy", text2: "No rows to preview.", }, - edu: { - heading1: "What is Mock Data?", - p1: "

Mock data is synthetic information that mimics real-world data without containing any sensitive or personally identifiable information (PII). It is essential for developers and testers who need realistic datasets to build and validate applications without risking data breaches or violating privacy regulations like GDPR or CCPA. By using mock data, you can simulate various scenarios, from standard user profiles to edge cases, ensuring your software handles all types of input gracefully.

", - heading2: "Testing Strategies", - p2: "

Effective testing requires diverse datasets. Use mock data to seed your development databases, perform load testing with thousands of records, or verify UI layouts with varying string lengths. It is particularly useful for integration testing where you need predictable responses from external APIs. By generating data locally, you can create consistent test environments that are easy to reset and reproduce, leading to more reliable and faster development cycles.

", - heading3: "Data Privacy in Mocks", - p3: "

Privacy is a top priority in modern software development. Using real production data in development or staging environments is a major security risk. Mock data generators solve this by producing fake but structurally correct data. Our tool runs entirely in your browser, meaning your configuration and the generated data stay in your browser and are not sent to our servers. This Privacy-First approach ensures that even the process of creating mock data is secure and compliant with the strictest security standards.

", - heading4: "Pro Tips", - p4: "", - }, cheatsheet: { title: "Mock Data Field Types", h0: "Available Types", @@ -1906,16 +1645,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "Naming Conventions Explained (camelCase/snake_case/etc)", - heading2: "How to Use This Tool", - heading3: "Common Use Cases", - heading4: "Pro Tips", - p1: "

Naming conventions are sets of rules for choosing the character sequence to be used for identifiers which denote variables, types, functions, and other entities in source code and documentation. camelCase (e.g., myVariable) starts with a lowercase letter and capitalizes the first letter of each subsequent word. snake_case (e.g., my_variable) uses underscores to separate words.

PascalCase (e.g., MyVariable) capitalizes the first letter of every word, while kebab-case (e.g., my-variable) uses hyphens to separate words. These conventions are not just about aesthetics; they are critical for code readability, maintainability, and adhering to the idiomatic standards of different programming languages and frameworks.

", - p2: "
  1. Type or paste your text into the \"Input Text\" area at the top of the page.
  2. The tool will automatically convert your input into over a dozen different case styles in real-time.
  3. Scroll through the \"Conversion Results\" grid to find the specific case style you need.
  4. Click the \"Copy\" icon next to any result to save it to your clipboard.
  5. Use the \"Clear\" button to remove all input and start a new conversion.
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "Code Minifier", @@ -1949,16 +1678,6 @@ export default { text2: "📋 Copy", tpl3: "All processing happens in your browser. Your code is processed locally and not sent to our servers.", }, - edu: { - heading1: "What is Minification?", - heading2: "How to Use This Tool", - heading3: "Common Use Cases", - heading4: "Pro Tips", - p1: "

Minification is the process of removing all unnecessary characters from source code without changing its functionality. This includes removing whitespace, newlines, comments, and sometimes shortening variable names. The goal is to reduce the file size of the code, which in turn reduces the amount of data that needs to be transferred over the network.

This leads to faster page load times and improved performance for web applications. While minification is essential for production environments, it makes the code nearly impossible for humans to read and debug. Therefore, it is typically performed as a final step in the build process before deploying to a live server.

", - p2: "
  1. Select the programming language (JavaScript, CSS, HTML, or JSON) from the tabs at the top.
  2. Paste your source code into the \"Input Code\" text area on the left.
  3. Click the \"Minify Code\" button to reduce the file size for production use.
  4. Alternatively, click \"Beautify Code\" to add indentation and formatting for better readability.
  5. View the results in the \"Output Code\" area and click \"Copy\" or \"Download\" to save your optimized code.
", - p3: "", - p4: "", - }, }, "image-converter": { name: "Image Converter", @@ -2005,16 +1724,6 @@ export default { alert2: "Error reading file.", tpl3: "Client-side processing using Canvas API - no uploads, instant results", }, - edu: { - heading1: "Image Formats Compared (PNG/JPEG/WebP)", - p1: "

Choosing the right image format is crucial for web performance and visual quality. JPEG is best for photographs and complex images with many colors, as it uses lossy compression to achieve small file sizes. PNG is ideal for images that require transparency or have sharp edges and solid colors (like logos and icons), as it uses lossless compression.

WebP is a modern format that provides superior lossy and lossless compression, often resulting in significantly smaller file sizes than JPEG or PNG while maintaining high quality.

", - heading2: "How to Use This Tool", - p2: "
  1. Upload your image by dropping it into the Upload Image zone or clicking to browse your files.
  2. Select your desired output format (PNG, JPG, or WebP) from the Convert Format options.
  3. If you have selected a lossy format like JPG or WebP, use the quality slider to balance file size and visual fidelity.
  4. Optionally, use the Resize Image settings to scale your image by percentage or specific dimensions.
  5. Click Convert & Resize Image and then Download to save your optimized asset.
", - heading3: "Common Use Cases", - p3: "", - heading4: "Pro Tips", - p4: "", - }, }, "css-gradient": { name: "Gradient Generator", @@ -2054,16 +1763,6 @@ export default { alert2: "Failed to copy CSS to clipboard", tpl3: "Loading screens and overlays", }, - edu: { - heading1: "What are CSS Gradients?", - heading2: "Linear vs Radial vs Conic Gradients", - heading3: "Browser Support and Performance", - heading4: "Pro Tips for Better Gradients", - p1: "

CSS gradients are a powerful feature that allows you to display smooth transitions between two or more specified colors. Unlike traditional background images, gradients are generated by the browser, which means they are infinitely scalable, consume less bandwidth, and can be easily manipulated with code. They are commonly used for backgrounds, buttons, and decorative elements to add depth and visual interest to web designs.

", - p2: "

There are three main types of CSS gradients:

", - p3: "

Modern CSS gradients are widely supported across all major browsers, including Chrome, Firefox, Safari, and Edge. Because they are rendered mathematically by the browser's engine, they are extremely performant compared to high-resolution images. However, for very complex gradients with dozens of color stops, it's always good practice to test performance on lower-end devices. For older browsers (like IE9 and below), it's recommended to provide a solid color fallback.

", - p4: "", - }, }, "curl-studio": { name: "Curl Studio", @@ -2132,16 +1831,6 @@ export default { text2: "Copied!", tpl3: "Logs will appear here after masking...", }, - edu: { - heading1: "What is PII?", - p1: "

Personally Identifiable Information (PII) is any data that can be used to identify a specific individual. This includes direct identifiers like names, email addresses, and phone numbers, as well as indirect identifiers like IP addresses, physical locations, and credit card numbers. In the context of server logs, PII often appears in request parameters, headers, or error messages.

Protecting PII is a critical part of modern data security and is required by various legal frameworks around the world.

", - heading2: "Compliance Requirements (GDPR/CCPA)", - p2: "

Regulations like the General Data Protection Regulation (GDPR) in Europe and the California Consumer Privacy Act (CCPA) in the United States impose strict rules on how personal data is handled. These laws require organizations to implement privacy by design and to minimize the collection and storage of personal data.

Sharing raw logs containing PII with third-party support teams or developers can lead to compliance violations. Masking or redacting this data before it leaves your secure environment is a key step in maintaining regulatory compliance.

", - heading3: "Masking Strategies", - p3: "

There are several ways to handle sensitive data in logs:

Our tool focuses on redaction, using pattern matching to find and replace common PII formats instantly.

", - heading4: "Pro Tips", - p4: "", - }, }, "mermaid-studio": { name: "Mermaid Studio", @@ -2342,16 +2031,6 @@ export default { text51: "No URLs extracted yet.", text52: "No routing data yet.", }, - edu: { - heading1: "Email Authentication Explained", - heading2: "SPF/DKIM/DMARC", - heading3: "Phishing Detection", - heading4: "Pro Tips", - p1: "

Email authentication is a collection of techniques used to provide verifiable information about the origin of an email message. By validating the sender's identity, these protocols help mail servers distinguish between legitimate messages and spoofed or fraudulent ones (like phishing). The three pillars of modern email authentication are SPF, DKIM, and DMARC.

When an email is received, the receiving server performs these checks and records the results in the email's headers, which this tool parses for you.

", - p2: "", - p3: "

Phishing emails often use \"spoofing\" to appear as if they come from a trusted source. Our analyzer looks for common red flags, such as a mismatch between the \"From\" address (what the user sees) and the \"Return-Path\" (where the mail actually came from). We also extract and analyze URLs in the email body to identify suspicious links, such as those using Punycode (lookalike domains) or IP addresses instead of hostnames.

By reviewing the \"Findings\" section, you can quickly identify these signals and determine if an email is safe to interact with.

", - p4: "", - }, cheatsheet: { title: "Email Auth Quick Reference", h0: "What these checks mean", @@ -2527,16 +2206,6 @@ export default { text9: "Paste SQL first.", text10: "✓ Copied", }, - edu: { - heading1: "Why Format SQL?", - p1: "SQL can quickly become complex and difficult to read, especially when dealing with multiple joins, subqueries, and nested conditions. Formatting SQL involves adding consistent indentation, line breaks, and capitalization of keywords. This makes the logic of the query much easier to follow, which is essential for debugging, code reviews, and maintaining large database schemas over time. A well-formatted query is also less prone to logical errors during manual edits.", - heading2: "How to Use This Tool", - p2: "Paste your raw SQL query into the Input SQL editor on the left. Select your database dialect (Postgres or MySQL) and preferred keyword case (UPPER or lower). Click the Format button to beautify your query with proper indentation and spacing. Use the Validate button to check for common structural issues like unclosed quotes or unbalanced parentheses. Click Copy to save the formatted SQL to your clipboard or Clear to start over.", - heading3: "Common Use Cases", - p3: "Code reviews to format messy SQL before submitting a pull request. Debugging to clean up queries generated by ORMs to understand exactly what is being executed against your database. Documentation to create clear and readable examples for technical guides, wikis, or README files. Legacy cleanup to quickly refactor old, unformatted scripts into a modern, readable style.", - heading4: "Pro Tips", - p4: "Use Common Table Expressions (CTEs) with the WITH clause to break down complex queries into smaller, more manageable parts. Always use descriptive aliases for tables and columns to make the intent of your query clear. Use the Minify button if you need to compress your SQL into a single line for use in configuration files or command-line tools.", - }, cheatsheet: { title: "SQL Formatting Tips", h0: "Quick wins", @@ -2605,16 +2274,6 @@ export default { text15: "Note: Values are masked for safety. Diff is heuristic and does not include comments/order.", text16: "✓ Copied", }, - edu: { - heading1: "Environment Variables Best Practices", - heading2: "Secret Management", - heading3: ".env Security", - heading4: "Pro Tips", - p1: "

Environment variables are a fundamental part of the \"Twelve-Factor App\" methodology, which advocates for a strict separation of configuration from code. By using environment variables, you can run the same code in different environments (development, staging, production) simply by changing the configuration values.

Best practices include using descriptive, uppercase names (e.g., DATABASE_URL), providing default values for non-critical settings, and never hardcoding sensitive information directly into your source control.

", - p2: "

Secrets are a special category of environment variables that contain sensitive information like API keys, database passwords, and private certificates. Managing these securely is critical to preventing data breaches. You should use a dedicated secret management service (like AWS Secrets Manager, HashiCorp Vault, or Cloudflare Secrets) for production environments.

For local development, .env files are commonly used, but they should never be committed to your git repository. Always add *.env to your .gitignore file.

", - p3: "

When sharing .env files with teammates for debugging, there is a high risk of accidentally exposing production secrets. Our manager helps mitigate this risk by providing a \"Mask sensitive values\" feature. It uses heuristics to identify keys like SECRET, TOKEN, or PASSWORD and replaces their values with a masked version (e.g., ab...yz (32)).

This allows you to compare the structure and non-sensitive values of your environment files without leaking the actual secrets.

", - p4: "", - }, cheatsheet: { title: "Dotenv Notes", h0: "Masking strategy", @@ -2674,16 +2333,6 @@ export default { text7: "No preview yet.", text8: "✓ Copied", }, - edu: { - heading1: "What is SVG?", - p1: "SVG (Scalable Vector Graphics) is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation. Unlike raster formats like JPEG or PNG, SVGs are defined by mathematical paths, which means they can be scaled to any size without losing quality. This makes them perfect for logos, icons, and illustrations on the web, where they remain crisp on everything from mobile screens to high-resolution desktop monitors.", - heading2: "How to Use This Tool", - p2: "Paste your SVG code into the SVG Input text area on the left. Click Preview to see the graphic and extract its color palette. Use the Optimize or Minify buttons to clean up the markup and reduce file size. Optionally, replace specific colors by entering new values in the Colors panel and clicking Apply. Click Copy or Download to save your sanitized and optimized SVG.", - heading3: "Common Use Cases", - p3: "Icon management to clean up SVGs exported from design tools like Figma or Illustrator. Theming to quickly change the colors of an icon set to match your brand palette. Security to sanitize SVGs from untrusted sources to remove potential scripts or external references. Performance to minify SVG markup to reduce the size of inline graphics and improve page load times.", - heading4: "Pro Tips", - p4: "Use the currentColor button to convert all explicit fills and strokes to currentColor, making your SVG easily styleable via CSS. Always optimize your SVGs before using them in production to ensure they are as small as possible. When creating SVGs in design tools, use Outline Stroke and Simplify Path features to reduce the complexity of the generated code before optimization.", - }, cheatsheet: { title: "SVG Safety Notes", h0: "Sanitization", @@ -2837,16 +2486,6 @@ export default { text28: "Click Scan to find secrets.", text29: "✓ Copied", }, - edu: { - heading1: "What are Secret Leaks?", - p1: "Secret leaks occur when sensitive information like API keys, passwords, or private tokens are accidentally committed to version control or shared in public forums. These leaks can lead to unauthorized access, data breaches, and financial loss. This tool helps identify common secret patterns locally in your browser before you share or commit your code.", - heading2: "How to Use This Tool", - p2: "Paste your code, configuration, or log files into the input area. Click the Scan button to analyze the text for potential secrets. Review the findings and advice for each detected item. Use the Copy Redacted button to get a share-safe version of your text with secrets masked.", - heading3: "Common Use Cases", - p3: "Pre-commit checks to scan your code before committing to ensure no secrets are included. Log redaction to mask sensitive tokens in logs before sharing them with support or teammates. Security auditing to quickly audit configuration files for hardcoded credentials.", - heading4: "Pro Tips", - p4: "Always rotate your credentials immediately if you discover they have been leaked. Use environment variables or secret managers instead of hardcoding secrets in your source code. Enable Include low severity patterns for a more thorough scan, but be prepared for more false positives.", - }, cheatsheet: { title: "What to do if you find a secret", h0: "Immediate steps", @@ -2943,16 +2582,6 @@ export default { text15: "✓ Valid JWKS structure (", text16: "Please paste a JWK.", }, - edu: { - heading1: "What is a JWT?", - p1: "A JSON Web Token (JWT) is a compact, URL-safe means of representing claims to be transferred between two parties. A JWT consists of three Base64URL-encoded parts separated by dots: the Header (algorithm and type), the Payload (claims), and the Signature. The signature ensures the token has not been tampered with. JWTs are commonly used for authentication and information exchange in web APIs. Standard claims include sub (subject), iss (issuer), aud (audience), exp (expiration), nbf (not before), iat (issued at), and jti (JWT ID).", - heading2: "JWT Algorithms", - p2: "HS256/384/512 uses HMAC with SHA-2 and a shared secret — simple but both parties must hold the same key. RS256/384/512 uses RSA PKCS#1 v1.5 asymmetric signatures — ideal for microservice architectures where services only need the public key. ES256/384/512 uses ECDSA with NIST curves for smaller signatures than RSA with equivalent security. PS256/384/512 uses RSA-PSS, a probabilistic variant preferred over RS* in modern systems.", - heading3: "JWK and JWKS", - p3: "A JSON Web Key (JWK) is a JSON structure representing a cryptographic key. A JWK Set (JWKS) is a JSON structure containing an array of JWKs under the keys property. Services publish their JWKS at a well-known URL (e.g., /.well-known/jwks.json), allowing clients to fetch public keys for JWT verification without out-of-band key exchange. Keys in a JWKS are identified by their kid (Key ID), which JWT headers reference.", - heading4: "Security Best Practices", - p4: "Always validate exp, nbf, iss, and aud claims server-side. Never use the alg: none algorithm in production — it removes all signature protection. Prefer asymmetric algorithms (RS*, ES*, PS*) over HMAC when multiple services need to verify tokens. Rotate keys regularly and use kid to identify which key was used to sign each token. Store private keys securely — never commit them to version control. Use short expiration times and refresh tokens rather than long-lived JWTs.", - }, }, "encoding-workbench": { name: "Encoding & Decoding Workbench", @@ -3016,16 +2645,6 @@ export default { js: { noLayers: "No recognisable encoding layers detected.", }, - edu: { - heading1: "What is Encoding vs Hashing?", - heading2: "How to Use This Tool", - heading3: "Layered Encoding Explained", - heading4: "Hash Algorithm Guide", - p1: "

Encoding transforms data into a different representation that can be reversed (decoded). Common formats include Base64 — used to transmit binary data over text channels — URL encoding, HTML entity encoding, and hexadecimal. Encoding is not encryption; it offers no confidentiality.

Hashing is a one-way mathematical transformation. A cryptographic hash function takes any input and produces a fixed-length fingerprint. You cannot reverse a hash to retrieve the original input. Hashes are used to verify file integrity, store passwords securely, and generate digital signatures.

", - p2: "
  1. Encode / Decode tab: Paste text and choose an operation (Base64, URL, HTML, Hex), or click Auto-Detect Layers to automatically unwrap multiple nested encodings.
  2. Hash tab: Enter text or select a file, choose algorithms, and click Hash All. Enable HMAC mode to compute keyed hashes with a shared secret.
  3. Identify tab: Paste an unknown hash or encoded string and click Identify to see likely algorithms with confidence ratings.
", - p3: "

Real-world data is often encoded multiple times. For example, a payload could be URL-encoded, then Base64-encoded, then placed inside a hex string. The Auto-Detect Layers feature inspects the input pattern, attempts each decoding in sequence, and visualises every step as a card so you can see exactly how the data was wrapped.

", - p4: "", - }, }, "oauth-debugger": { name: "OAuth 2.0 / PKCE Debugger", @@ -3081,16 +2700,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "What is PKCE and Why Does It Matter?", - p1: "

Proof Key for Code Exchange (PKCE, RFC 7636) was originally designed for mobile and native apps that cannot securely store a client secret. It works by having the client generate a random code_verifier, derive a code_challenge from it (SHA-256 + base64url), and send the challenge with the authorization request. When exchanging the authorization code for tokens, the client sends the original code_verifier. The authorization server verifies it matches the earlier challenge — proving the token request came from the same client that started the flow.

Even for confidential clients (server-side apps with a client secret), PKCE is now recommended by OAuth 2.1 as a defense against authorization code interception attacks.

", - heading2: "Why Is the Implicit Flow Deprecated?", - p2: "

The implicit flow (response_type=token) was designed as a shortcut for single-page apps, returning the access token directly in the URL fragment. This creates serious problems: tokens in URLs appear in browser history, server logs, and referrer headers, and the flow is vulnerable to token injection attacks. OAuth 2.0 Security Best Current Practice (RFC 9700) and OAuth 2.1 explicitly remove the implicit flow in favor of Authorization Code + PKCE, which SPAs can use safely without a client secret.

", - heading3: "Key OAuth 2.1 Changes", - p3: "", - heading4: "Authorization Code Flow Step by Step", - p4: "
  1. Generate PKCE pair: Create a random code_verifier and compute code_challenge = BASE64URL(SHA256(code_verifier)).
  2. Redirect to authorization endpoint: Include response_type=code, client_id, redirect_uri, scope, state, code_challenge, and code_challenge_method=S256.
  3. User authenticates at the authorization server and grants consent.
  4. Receive authorization code at your redirect_uri alongside the echoed state — verify state matches what you sent.
  5. Exchange code for tokens: POST to the token endpoint with grant_type=authorization_code, code, redirect_uri, client_id, and code_verifier.
  6. Receive access token (and optionally id_token and refresh_token) and use them to call APIs.
", - }, }, "ladder-game": { name: "Ladder Game", diff --git a/src/i18n/es.js b/src/i18n/es.js index 7bf6397..34ad2a6 100644 --- a/src/i18n/es.js +++ b/src/i18n/es.js @@ -90,16 +90,6 @@ export default { text7: "✓ Copiado", tpl8: "Prof. máxima", }, - edu: { - heading1: "¿Qué es JSON?", - p1: "

JSON (JavaScript Object Notation) es un formato ligero de intercambio de datos que es fácil de leer y escribir para los humanos y fácil de analizar y generar para las máquinas. Está basado en un subconjunto del Estándar del Lenguaje de Programación JavaScript. JSON es un formato de texto completamente independiente del lenguaje, pero utiliza convenciones que son familiares para los programadores de la familia de lenguajes C.

Estas propiedades hacen de JSON un lenguaje ideal de intercambio de datos para aplicaciones web, APIs y archivos de configuración. Se ha convertido en el estándar de facto para el intercambio de datos en la web, reemplazando en gran medida a XML debido a su menor tamaño y mejor rendimiento.

", - heading2: "Cómo usar esta herramienta", - p2: "
  1. Pega tus datos JSON sin procesar o desordenados en el editor de JSON de entrada a la izquierda.
  2. Haz clic en el botón Formatear para embellecer el código con sangría adecuada y resaltado de sintaxis.
  3. Alternativamente, usa el botón Minificar para eliminar todos los espacios en blanco para uso en producción.
  4. Verifica el indicador de Estado para asegurarte de que tu JSON es válido; si hay un error, la herramienta resaltará la línea exacta.
  5. Haz clic en Copiar para guardar el resultado formateado en tu portapapeles o en Limpiar para empezar de nuevo.
", - heading3: "Casos de uso comunes", - p3: "", - heading4: "Consejos profesionales", - p4: "", - }, }, "jwt-decoder": { name: "Inspector JWT", @@ -139,22 +129,6 @@ export default { status5: "Algoritmo: ", status6: "Error al decodificar", }, - edu: { - heading1: "¿Qué es JWT?", - p1: "

JSON Web Token (JWT) es un estándar abierto (RFC 7519) que define una forma compacta y autocontenida de transmitir información de forma segura entre partes como un objeto JSON. Esta información se puede verificar y es confiable porque está firmada digitalmente. Los JWT pueden firmarse usando un secreto (con el algoritmo HMAC) o un par de claves pública/privada usando RSA o ECDSA.

Debido a su tamaño compacto, los JWT se usan comúnmente en escenarios de autenticación e intercambio de información, como los tokens Bearer en los encabezados HTTP Authorization.

", - heading2: "Cómo usar esta herramienta", - p2: "
  1. Pega tu token: Copia tu JWT codificado (header.payload.signature) y pégalo en el campo de entrada.
  2. Decodificación automática: La herramienta detectará automáticamente el token y decodificará sus componentes en tiempo real.
  3. Inspecciona el Header: Revisa el algoritmo (alg) y el tipo de token (typ) en la sección Header.
  4. Analiza el Payload: Examina los claims, como la expiración (exp), el emisor (iss) y el sujeto (sub) en la sección Payload.
  5. Verifica los claims: Consulta el cuadro de Análisis de claims para ver fechas legibles y el estado de validación.
", - heading3: "Casos de uso comunes", - p3: "", - heading4: "Consejos profesionales", - p4: "", - heading5: "Estructura del token (header.payload.signature)", - p5: "

Un JWT normalmente consta de tres partes separadas por puntos:

", - heading6: "Consideraciones de seguridad", - p6: "

Aunque los JWT se firman para garantizar su integridad, normalmente NO están cifrados. Esto significa que cualquiera que tenga el token puede decodificar el header y el payload para leer la información que contienen. Nunca almacenes información sensible, como contraseñas o claves privadas, en el payload de un JWT.

Además, verifica siempre el claim exp (expiración) para prevenir ataques de repetición, y asegúrate de que tu servidor valide la firma antes de confiar en los datos del payload.

", - heading7: "Consejos profesionales", - p7: "", - }, cheatsheet: { title: "Referencia rápida de JWT", h0: "Estructura", @@ -193,16 +167,6 @@ export default { text0: "✓ ¡Copiado!", tpl1: "GUID:", }, - edu: { - heading1: "¿Qué es un UUID?", - p1: "Un Identificador Único Universal (UUID) es un número de 128 bits utilizado para identificar de forma única información en sistemas informáticos. Están diseñados para generarse de forma independiente sin necesidad de una autoridad central, manteniendo una probabilidad de colisión insignificante.", - heading2: "Cómo usar esta herramienta", - p2: "Selecciona la versión de UUID (v1 basada en el tiempo, v4 aleatoria) y la cantidad de identificadores que necesitas. Haz clic en Generar para crear una lista de identificadores únicos listos para usar en tu base de datos o aplicación.", - heading3: "Casos de uso comunes", - p3: "Claves primarias en bases de datos distribuidas, identificadores de sesión, seguimiento de transacciones y nombrado de archivos o recursos temporales donde la unicidad es fundamental entre múltiples sistemas.", - heading4: "Consejos profesionales", - p4: "UUID v4 es la opción más común para identificadores únicos de propósito general porque se basa en aleatoriedad de alta calidad. Usa v1 si necesitas ordenar los identificadores por fecha de creación.", - }, }, "password-generator": { name: "Generador de Contraseñas", @@ -265,24 +229,6 @@ export default { status6: "Débil", text1: "Introduce una dirección de correo base válida.", }, - edu: { - heading1: "¿Qué hace segura a una contraseña?", - p1: "

Una contraseña segura es tu primera línea de defensa contra el acceso no autorizado. En la era moderna de la computación de alta velocidad, \"segura\" se define por la entropía — la medida de aleatoriedad e impredecibilidad en una cadena. Una contraseña fuerte debe ser larga (al menos 16 caracteres), única para cada cuenta, y compuesta de un conjunto diverso de tipos de caracteres incluyendo mayúsculas, minúsculas, números y símbolos.

Evita usar información personal como fechas de nacimiento, nombres de mascotas o palabras comunes del diccionario. Incluso sustituciones de aspecto complejo como P@ssw0rd123 son fácilmente descifradas por herramientas modernas de fuerza bruta que usan diccionarios masivos de patrones comunes.

", - heading2: "Cómo usar esta herramienta", - p2: "
  1. Selecciona tu modo: Elige entre Contraseña, Nombre de usuario, Frase de contraseña o Alias de correo según tus necesidades.
  2. Ajusta la longitud: Usa el deslizador para establecer la longitud deseada. Para contraseñas, se recomiendan 16+ caracteres para alta seguridad.
  3. Configura las opciones: Activa o desactiva conjuntos de caracteres (símbolos, números, etc.) o estilos (legible vs. seguro).
  4. Generar: Haz clic en el botón Generar para crear tu credencial única.
  5. Copiar: Usa el ícono de copiar para mover el resultado de forma segura a tu portapapeles o gestor de contraseñas.
", - heading3: "Casos de uso comunes", - p3: "", - heading4: "Consejos profesionales", - p4: "", - heading5: "¿Qué hace segura a una contraseña?", - p5: "

Una contraseña segura es tu primera línea de defensa contra el acceso no autorizado. En la era moderna de la computación de alta velocidad, \"segura\" se define por la entropía — la medida de aleatoriedad e impredecibilidad en una cadena. Una contraseña fuerte debe ser larga (al menos 16 caracteres), única para cada cuenta, y compuesta de un conjunto diverso de tipos de caracteres incluyendo mayúsculas, minúsculas, números y símbolos.

Evita usar información personal como fechas de nacimiento, nombres de mascotas o palabras comunes del diccionario. Incluso sustituciones de aspecto complejo como P@ssw0rd123 son fácilmente descifradas por herramientas modernas de fuerza bruta que usan diccionarios masivos de patrones comunes.

", - heading6: "Entropía explicada", - p6: "

La entropía es una medida de la aleatoriedad e impredecibilidad de una contraseña, expresada típicamente en bits. Cuanto mayor sea la entropía, más fuerte será la contraseña. Por ejemplo, una contraseña de 10 caracteres usando solo letras minúsculas tiene mucha menor entropía que una de 10 caracteres usando un conjunto completo de caracteres alfanuméricos y especiales.

Nuestro generador calcula la entropía en tiempo real para darte una medida objetiva de la fortaleza de tu contraseña. Una contraseña con más de 100 bits de entropía se considera excepcionalmente fuerte y resistente a las técnicas modernas de descifrado.

", - heading7: "Mejores prácticas", - p7: "", - heading8: "Consejos profesionales", - p8: "", - }, }, "hash-calculator": { name: "Calculadora de Hash", @@ -350,16 +296,6 @@ export default { tpl4: "Esperando entrada...", text2: "Calculado: ", }, - edu: { - heading1: "¿Qué es el hashing?", - p1: "

El hashing criptográfico es un proceso matemático que transforma cualquier dato de entrada (texto o archivos) en una cadena de caracteres de tamaño fijo, generalmente un número hexadecimal. Esta huella digital es única para la entrada; incluso un solo bit de cambio en los datos de origen produce un hash completamente diferente, un fenómeno conocido como efecto avalancha.

A diferencia del cifrado, el hashing es una función unidireccional. No es posible invertir un hash para recuperar los datos originales. Esto lo hace ideal para verificar la integridad de los datos, almacenar contraseñas de forma segura (combinado con salts) e identificar archivos sin exponer su contenido.

", - heading2: "Cómo usar esta herramienta", - p2: "
  1. Selecciona el tipo de entrada: Elige la pestaña Texto para cadenas o la pestaña Archivo para archivos locales.
  2. Proporciona la entrada: Pega tu texto o arrastra y suelta tu archivo en el área de trabajo.
  3. HMAC opcional: Introduce una clave secreta en el campo HMAC si necesitas generar un hash con clave para autenticación.
  4. Revisa los resultados: La herramienta calcula automáticamente varias variantes de hash (SHA-256, SHA-512, etc.) en tiempo real.
  5. Verifica la integridad: Usa la pestaña Verificar para comparar un hash conocido con tu entrada y detectar manipulaciones.
", - heading3: "Casos de uso comunes", - p3: "", - heading4: "Consejos profesionales", - p4: "", - }, cheatsheet: { title: "Referencia de algoritmos de hash", h0: "Comparación de algoritmos", @@ -435,16 +371,6 @@ export default { text5: "Usa al menos /", text6: "IPv6 /", }, - edu: { - heading1: "¿Qué es CIDR?", - heading2: "Cómo usar esta herramienta", - heading3: "Casos de uso comunes", - heading4: "Consejos profesionales", - p1: "El Enrutamiento entre Dominios sin Clases (CIDR) es un método para asignar direcciones IP y enrutamiento IP. Reemplazó al sistema más antiguo basado en clases (A, B y C) para proporcionar más flexibilidad y eficiencia en la distribución de direcciones.", - p2: "Ingresa una dirección IP con un prefijo (ej., 192.168.1.0/24) o usa el deslizador para ajustar la longitud del prefijo. Haz clic en \"Ejecutar análisis\" para ver detalles de la red, rangos de hosts utilizables y representaciones binarias.", - p3: "Planificación de subredes de red para infraestructura en la nube (VPCs), solución de problemas de enrutamiento, cálculo de capacidad de hosts para un prefijo dado y conversión entre CIDR y máscaras de subred.", - p4: "Recuerda que en IPv4, las primeras y últimas direcciones en una subred están típicamente reservadas para el ID de red y la dirección de difusión. En IPv6, las subredes son casi siempre /64 para redes locales estándar.", - }, cheatsheet: { title: "Referencia rápida de subred", h0: "Subredes comunes", @@ -619,16 +545,6 @@ export default { tpl3: "Cambia los valores predeterminados:", tpl4: "No se encontraron puertos que coincidan con tu búsqueda.", }, - edu: { - heading1: "Categorías de puertos y guía de seguridad", - p1: "Los puertos bien conocidos (0-1023) son asignados por IANA y requieren privilegios de root en sistemas Unix. Los puertos registrados (1024-49151) los usan las aplicaciones. Los puertos dinámicos/efímeros (49152-65535) se usan para conexiones del lado del cliente. Comprender los rangos de puertos es esencial para la configuración de firewalls y la seguridad de red.", - heading2: "Cómo usar esta herramienta", - p2: "Busca por número de puerto o nombre de servicio para encontrar detalles del protocolo y niveles de riesgo de seguridad. Filtra por categoría (Bien conocidos, Registrados, Dinámicos) o protocolo (TCP/UDP) para acotar los resultados. Haz clic en cualquier fila para ver los detalles completos, incluidas las vulnerabilidades comunes y las recomendaciones de protección.", - heading3: "Casos de uso comunes", - p3: "Configuración de reglas de firewall, resolución de problemas de red, identificación de puertos abiertos inesperados durante auditorías de seguridad y referencia rápida de asignaciones de puertos de protocolos.", - heading4: "Consejos profesionales", - p4: "Usa el filtro de riesgo para identificar rápidamente los puertos de alto riesgo en tu red. La sección Los 50 puertos más comunes te ofrece una visión instantánea de los servicios más utilizados.", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
PuertoServicioRiesgo
21FTPTransferencias de archivos sin cifrar
23TelnetAutenticación en texto plano
25SMTPRiesgo de reenvío de spam
53DNSAtaques de amplificación DDoS
445SMBPropagación de ransomware
3389RDPAtaques de fuerza bruta
", @@ -872,16 +788,6 @@ export default { text4: "Advertencias", alert0: "Genera primero una configuración", }, - edu: { - heading1: "Acerca de WireGuard", - p1: "WireGuard es un protocolo VPN moderno y de alto rendimiento que utiliza criptografía de última generación. Está diseñado para ser más simple y rápido que protocolos más antiguos como OpenVPN e IPsec, con una superficie de ataque mucho menor gracias a su base de código mínima. WireGuard ahora forma parte del kernel de Linux y cuenta con soporte nativo en Windows, macOS, iOS y Android.", - heading2: "Cómo usar esta herramienta", - p2: "Selecciona una plantilla de topología (Punto a punto, Concentrador y radios, Sitio a sitio o Road Warrior) para prellenar una configuración. Haz clic en Generar claves para crear un nuevo par de claves localmente en tu navegador. Completa los campos obligatorios y haz clic en Generar configuración para producir el archivo de configuración de WireGuard. Usa Descargar .conf para guardar el archivo o Generar QR para crear un código QR para la importación móvil.", - heading3: "Casos de uso comunes", - p3: "VPN de acceso remoto para empleados que se conectan a redes corporativas. VPN de sitio a sitio para conectar redes de sucursales. Servidor VPN personal para navegación segura en redes Wi-Fi públicas. Tunelización de dispositivos IoT para comunicación segura entre dispositivos embebidos.", - heading4: "Consejos profesionales", - p4: "Usa PersistentKeepalive = 25 en clientes detrás de NAT para mantener el túnel activo cuando no hay tráfico. PresharedKey añade una capa adicional de cifrado simétrico para resistencia post-cuántica. AllowedIPs = 0.0.0.0/0 enruta todo el tráfico a través del túnel (túnel completo), mientras que CIDR específicos crean un túnel dividido.", - }, cheatsheet: { title: "Referencia rápida de WireGuard", h0: "Campos de la interfaz", @@ -1025,14 +931,6 @@ export default { tpl6: "Ejemplo:", tpl7: "Haz clic en cualquier campo del diagrama para ver los detalles.", }, - edu: { - heading1: "¿Qué son los encabezados de protocolo?", - p1: "Los encabezados de protocolo son datos estructurados que preceden a la carga útil en los paquetes de red. Contienen información de control, como direcciones de origen y destino, tipos de protocolo, números de secuencia y sumas de comprobación. Comprender la estructura de los encabezados es fundamental para la depuración de redes, el análisis de paquetes y la implementación de protocolos.", - heading2: "Cómo usar esta herramienta", - p2: "Selecciona un protocolo en las pestañas para ver la estructura de su encabezado. Cada bloque de color representa un campo con su tamaño indicado. Haz clic en cualquier campo para ver información detallada, incluidos el nombre y la descripción del campo, el desplazamiento en bits/bytes, los valores comunes y su significado, y la referencia RFC. Usa el analizador de volcado hex para analizar capturas de paquetes reales pegando la salida hexadecimal de herramientas como tcpdump o Wireshark.", - heading3: "Casos de uso comunes", - p3: "Análisis de paquetes para comprender la estructura del tráfico de red capturado, aprendizaje de protocolos como ayuda visual para estudiar protocolos de red, depuración para identificar encabezados mal formados o valores de campo incorrectos, y referencia de desarrollo al implementar protocolos de red.", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
ValorProtocolo
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
CampoTamañoDescripción
Source Port2 bytesNúmero de puerto del emisor
Dest Port2 bytesNúmero de puerto del receptor
Seq Number4 bytesNúmero de secuencia
Ack Number4 bytesNúmero de acuse de recibo
Data Offset4 bitsLongitud del encabezado / 4
Flags9 bitsNS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 bytesTamaño de la ventana de recepción
", @@ -1108,16 +1006,6 @@ export default { tpl0: "Diferencias", tpl1: "Sin diferencias (o entrada vacía)", }, - edu: { - heading1: "¿Qué es la comparación de texto (diff)?", - p1: "La comparación de texto (diffing) es el proceso de comparar dos secuencias de datos para identificar las diferencias entre ellas. Resalta lo que se ha añadido, eliminado o modificado. Esta es una operación fundamental en el desarrollo de software, el análisis de datos y la gestión de contenido, que permite a los usuarios rastrear cambios a lo largo del tiempo o comparar diferentes versiones de un documento.", - heading2: "Algoritmos de diff", - p2: "La mayoría de las herramientas de comparación de texto usan algoritmos basados en el problema de la subsecuencia común más larga (LCS). El objetivo es encontrar la secuencia más larga de elementos que aparecen en ambos textos en el mismo orden relativo. Las implementaciones comunes incluyen el algoritmo de diff de Myers, que es muy eficiente y lo usa Git, y el algoritmo de Hunt-McIlroy. Estos algoritmos calculan el número mínimo de ediciones necesarias para transformar un texto en otro.", - heading3: "Casos de uso", - p3: "Revisiones de código para que los desarrolladores vean exactamente qué cambió en un pull request. Los sistemas de control de versiones como Git almacenan el historial como una serie de diffs para ahorrar espacio. Auditoría de contenido para que escritores y editores comparen borradores y verifiquen que se hicieron todos los cambios solicitados. Validación de datos para comparar archivos de configuración o exportaciones de bases de datos y encontrar discrepancias.", - heading4: "Consejos profesionales", - p4: "Muchas herramientas de diff tienen opciones para ignorar cambios en la sangría o los espacios finales, lo que puede reducir el ruido al comparar código. Incluye algunas líneas de texto sin cambios alrededor de las diferencias (líneas de contexto) para entender el impacto de los cambios. Los diffs a nivel de palabra suelen ser más útiles para prosa y documentos en lenguaje natural, mientras que los diffs a nivel de línea son el estándar para el código.", - }, }, "regex-visualizer": { name: "Visualizador de Regex", @@ -1168,16 +1056,6 @@ export default { tpl5: "Sin grupos", tpl6: "Expresión regular inválida", }, - edu: { - heading1: "¿Qué son las expresiones regulares?", - p1: "Las expresiones regulares (regex) son patrones potentes que se usan para buscar combinaciones de caracteres en cadenas de texto. Son herramientas esenciales para el procesamiento de texto, la validación y la extracción de datos en distintos lenguajes de programación. Los patrones regex constan de caracteres literales y metacaracteres especiales que definen las reglas de búsqueda. Se usan en la validación de formularios, el análisis de logs, las operaciones de buscar y reemplazar, y las tareas de limpieza de datos.", - heading2: "Cómo usar esta herramienta", - p2: "Introduce tu patrón regex en el campo de entrada. La herramienta generará automáticamente un diagrama de ferrocarril que visualiza la estructura del patrón. Añade texto de prueba para ver el resaltado de coincidencias y las explicaciones en tiempo real. Usa la chuleta para una referencia rápida de patrones y sintaxis comunes. Genera fragmentos de código para tu lenguaje de programación preferido.", - heading3: "Casos de uso comunes", - p3: "Validación de correo electrónico para asegurarte de que la entrada del usuario coincide con el formato de correo correcto antes de procesarla, análisis de logs para extraer marcas de tiempo y direcciones IP de los registros del servidor, limpieza de datos para eliminar caracteres no deseados o dar formato uniforme a números de teléfono, y búsqueda y reemplazo para transformaciones masivas de texto mediante coincidencia de patrones.", - heading4: "Consejos profesionales", - p4: "Empieza con algo simple y construye patrones complejos de forma incremental. Usa grupos que no capturan (?:) cuando no necesites hacer referencia a la coincidencia. Prueba casos límite como cadenas vacías y caracteres especiales. Ten en cuenta la legibilidad del regex: los patrones complejos se pueden documentar con comentarios.", - }, cheatsheet: { title: "Referencia rápida de regex", h0: "Clases de caracteres", @@ -1323,16 +1201,6 @@ export default { text1: "Copiar", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "Acerca de las claves SSH", - p1: "Las claves SSH son un par de claves criptográficas utilizadas para la autenticación segura en sistemas remotos. La clave privada permanece en tu máquina, mientras que la clave pública se coloca en el servidor. Este enfoque asimétrico es mucho más seguro que la autenticación por contraseña y es el estándar de la industria para el acceso a servidores, el alojamiento de Git y los despliegues automatizados.", - heading2: "Cómo usar esta herramienta", - p2: "Selecciona el tipo de clave que prefieras (RSA o ECDSA) y, para RSA, elige el tamaño de clave. Añade un comentario opcional para identificar la clave (habitualmente usuario@host). Haz clic en Generar para crear tu par de claves. Copia la clave pública para añadirla a tu servidor y mantén la clave privada segura en tu máquina local.", - heading3: "Casos de uso comunes", - p3: "Autenticación de servidor para inicio de sesión SSH sin contraseña en servidores remotos. Alojamiento de Git para autenticarte en GitHub, GitLab o Bitbucket sin contraseñas. Pipelines de CI/CD para scripts de despliegue automatizado que necesitan conectarse a servidores. Acceso a hosts bastión para configuraciones seguras de servidor de salto (jump host).", - heading4: "Consejos profesionales", - p4: "Se recomiendan las claves Ed25519 para nuevos despliegues: son más rápidas y seguras que RSA. Protege siempre tu clave privada con una passphrase segura. Usa ssh-agent para evitar introducir tu passphrase repetidamente durante una sesión. Guarda las claves en ~/.ssh/ con permisos establecidos en 600.", - }, cheatsheet: { title: "Referencia rápida de claves SSH", h0: "Tipos de clave", @@ -1372,16 +1240,6 @@ export default { tpl2: "Sin nombres alternativos.", tpl3: "Sin extensiones analizadas.", }, - edu: { - heading1: "¿Qué son los certificados X.509?", - heading2: "Cómo usar esta herramienta", - heading3: "Casos de uso comunes", - heading4: "Consejos profesionales", - p1: "

X.509 es un formato estándar para certificados de clave pública, que son documentos digitales que vinculan de forma segura una clave pública a una identidad (como un sitio web, una organización o una persona). Estos certificados son la base de la infraestructura de clave pública (PKI) utilizada para asegurar internet mediante HTTPS, así como para firmar correos electrónicos y software.

Un certificado X.509 contiene la clave pública, la identidad del titular del certificado y la firma digital de la autoridad de certificación (CA) que emitió el certificado, lo que demuestra su autenticidad.

", - p2: "
  1. Pega tu certificado: Copia tu certificado codificado en PEM (incluidos los encabezados BEGIN y END) y pégalo en el campo de entrada.
  2. Analiza: Haz clic en \"Analizar certificado\" para extraer y analizar los datos.
  3. Revisa el resumen: Consulta las tarjetas superiores para ver el nombre común (CN), el emisor y las fechas de validez.
  4. Inspecciona los detalles: Expande las secciones de abajo para ver el Subject, el Issuer, los SAN y las extensiones técnicas completas.
  5. Comprueba el estado: Consulta la insignia de estado para ver si el certificado está actualmente vigente o ha expirado.
", - p3: "", - p4: "", - }, cheatsheet: { title: "Referencia de certificados X.509", h0: "Campos del certificado", @@ -1424,16 +1282,6 @@ export default { text1: "Copiar JSON", text2: "Copiar XML", }, - edu: { - heading1: "¿Qué es SAML?", - p1: "Security Assertion Markup Language (SAML) es un estándar abierto basado en XML para intercambiar datos de autenticación y autorización entre partes, en particular entre un proveedor de identidad (IdP) y un proveedor de servicios (SP). SAML es la columna vertebral de muchas soluciones empresariales de inicio de sesión único (SSO), que permiten a los usuarios acceder a múltiples aplicaciones con un único conjunto de credenciales. La versión más común es SAML 2.0, que usa tokens de seguridad que contienen aserciones para transmitir información sobre un principal entre el IdP y el SP.", - heading2: "Cómo usar esta herramienta", - p2: "Pega el SAMLResponse codificado en Base64 o el XML sin procesar en el campo de entrada. Activa Attempt to inflate si estás decodificando un payload de un binding Redirect. Haz clic en Decodificar respuesta para analizar el mensaje. Consulta el resumen rápido para ver el emisor, el sujeto y el estado de validez. Ve los atributos de usuario decodificados en la tabla de atributos. Usa las pestañas para ver el XML formateado, los detalles de la aserción o una representación JSON de los claims.", - heading3: "Casos de uso comunes", - p3: "Resolución de problemas de SSO diagnosticando por qué un usuario no puede iniciar sesión, comprobando aserciones expiradas o discrepancias de audiencia. Pruebas de integración para verificar que tu proveedor de identidad está enviando los atributos correctos. Auditoría de seguridad para inspeccionar el XML sin procesar y asegurarte de que las aserciones estén firmadas correctamente. Desarrollo para ver rápidamente el contenido de un mensaje SAML durante la integración del proveedor de servicios.", - heading4: "Consejos profesionales", - p4: "Los mensajes SAML enviados mediante HTTP-Redirect suelen estar deflacionados (comprimidos) antes de codificarse en Base64; si tu decodificación falla, prueba a activar la casilla Attempt to inflate. Asegúrate de que AudienceRestriction coincida con el Entity ID de tu SP. Si una respuesta se marca como no válida, comprueba los tiempos NotBefore y NotOnOrAfter en busca de desfase de reloj entre el IdP y el SP.", - }, cheatsheet: { title: "Referencia rápida de SAML", h0: "Flujo SAML", @@ -1476,16 +1324,6 @@ export default { alert1: "Ingrese una cadena User-Agent", tpl2: "Salida de análisis sin procesar", }, - edu: { - heading1: "¿Qué es un User-Agent?", - p1: "Un User-Agent es una cadena de texto que tu navegador envía a cada sitio web que visitas. Identifica la versión del navegador, el sistema operativo y el tipo de dispositivo, lo que permite a los servidores optimizar el contenido para tu entorno específico.", - heading2: "Cómo usar esta herramienta", - p2: "Pega una cadena de User-Agent en el cuadro de entrada o haz clic en Usar esta para analizar la cadena de tu navegador actual. La herramienta desglosará el motor del navegador, la versión del sistema operativo y las características del dispositivo.", - heading3: "Casos de uso comunes", - p3: "Depurar problemas de compatibilidad de sitios web, analizar los logs del servidor web para identificar tráfico de bots, verificar la suplantación de navegador y comprender la distribución de dispositivos en tu audiencia.", - heading4: "Consejos profesionales", - p4: "Muchos navegadores modernos congelan o simplifican sus cadenas de User-Agent para evitar el fingerprinting. Busca siempre los tokens Version o Chrome para obtener la información de versión más precisa.", - }, }, "qr-code": { name: "Generador de Códigos QR", @@ -1524,16 +1362,6 @@ export default { alert3: "¡Copiado!", tpl4: "Suba una imagen para decodificar", }, - edu: { - heading1: "¿Qué son los códigos QR?", - p1: "Los códigos QR (Quick Response) son códigos de barras bidimensionales que pueden almacenar varios tipos de datos, siendo las URL las más comunes. Se pueden escanear con smartphones y lectores especializados para acceder rápidamente a información o activar acciones.", - heading2: "Cómo usar esta herramienta", - p2: "Introduce el texto o la URL que quieres codificar. Ajusta el tamaño y el nivel de corrección de errores si es necesario. El código QR se actualiza en tiempo real y se puede descargar como imagen para uso impreso o digital.", - heading3: "Casos de uso comunes", - p3: "Compartir enlaces de sitios web, proporcionar credenciales de Wi-Fi, tarjetas de presentación digitales (vCards), entradas para eventos, y flujos de pagos móviles o autenticación.", - heading4: "Consejos profesionales", - p4: "Los niveles de corrección de errores más altos (H o Q) permiten que el código QR siga siendo escaneable incluso si está parcialmente dañado u oculto, lo cual es ideal para señalización física o branding.", - }, }, "timestamp-converter": { name: "Conversor de Marcas de Tiempo", @@ -1564,16 +1392,6 @@ export default { text0: "Marca de tiempo inválida", tpl1: "Unix (milisegundos)", }, - edu: { - heading1: "¿Qué es el tiempo Unix?", - p1: "El tiempo Unix (también conocido como tiempo Epoch, tiempo POSIX o marca de tiempo Unix) es un sistema para describir un punto en el tiempo. Es el número de segundos transcurridos desde el Epoch Unix, menos los segundos intercalares; el Epoch Unix es el 00:00:00 UTC del 1 de enero de 1970. Se usa ampliamente en sistemas operativos y formatos de archivo porque es un único entero, lo que facilita su almacenamiento y manipulación por los ordenadores. Este estándar permite que diferentes sistemas comuniquen el tiempo con precisión independientemente de su configuración de zona horaria local.", - heading2: "Cómo usar esta herramienta", - p2: "Para convertir Unix a Humano: Ingresa la marca de tiempo en el campo Marca de tiempo Unix y selecciona si está en segundos o milisegundos. Para convertir Humano a Unix: Selecciona la fecha y hora usando los selectores, luego elige tu zona horaria deseada. Usa el botón Ahora para obtener rápidamente la marca de tiempo actual. Ve los resultados en tiempo real, incluyendo ISO 8601, Hora local, UTC y tiempo relativo. Haz clic en el botón Copiar junto a cualquier resultado para guardarlo en tu portapapeles.", - heading3: "Casos de uso comunes", - p3: "Análisis de registros para convertir marcas de tiempo crípticas encontradas en registros de servidor o entradas de bases de datos en fechas legibles para depuración. Desarrollo de API para verificar que tu backend envía los valores de época correctos. Migración de datos para garantizar que los datos basados en tiempo permanezcan consistentes al moverse entre sistemas. Programación para calcular marcas de tiempo futuras o pasadas para trabajos cron, fechas de vencimiento o desencadenadores de eventos.", - heading4: "Consejos profesionales", - p4: "Al trabajar con JavaScript, recuerda que Date.now() devuelve milisegundos, mientras que las marcas de tiempo Unix estándar están en segundos — divide por 1000 para convertir. Siempre usa el formato ISO 8601 para el intercambio de datos entre sistemas para garantizar la máxima compatibilidad. Ten en cuenta el problema del año 2038 donde los enteros de 32 bits con signo se desbordará; los sistemas modernos usan enteros de 64 bits que resuelven esto para el futuro previsible.", - }, }, "color-converter": { name: "Conversor de Colores", @@ -1589,16 +1407,6 @@ export default { badge7: "Solo cliente", badge8: "Privacidad primero", }, - edu: { - heading1: "Modelos de color explicados (HEX/RGB/HSL)", - heading2: "Cómo usar esta herramienta", - heading3: "Casos de uso comunes", - heading4: "Consejos profesionales", - p1: "

Los modelos de color son sistemas matemáticos para representar colores. HEX (Hexadecimal) es un código de 6 dígitos usado en HTML y CSS, que representa los componentes Rojo, Verde y Azul. RGB (Rojo, Verde, Azul) usa valores decimales de 0 a 255 para cada canal, a menudo usado en imagen digital.

HSL (Tono, Saturación, Luminosidad) es más intuitivo para los humanos, ya que describe el color en términos de su pigmento base (Tono), intensidad (Saturación) y brillo (Luminosidad). Entender estos modelos ayuda a elegir el formato correcto para tus necesidades de diseño y desarrollo, asegurando consistencia en diferentes plataformas y dispositivos.

", - p2: "
  1. Usa el selector de color visual para seleccionar un color arrastrando el cursor en el cuadrado de saturación/brillo y el deslizador de tono.
  2. Alternativamente, ingresa un valor específico en el campo \"Entrada manual\" (soporta formatos #hex, rgb o hsl).
  3. Observa el cuadro \"Vista previa\" para ver el color seleccionado en tiempo real.
  4. Ve los valores convertidos en las tarjetas HEX, RGB, HSL y HSV a continuación.
  5. Haz clic en el icono \"Copiar\" en cualquier tarjeta para guardar ese formato específico en tu portapapeles.
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "Conversor de Unidades", @@ -1616,16 +1424,6 @@ export default { text0: "Seleccione unidades para ver la fórmula de conversión", text1: "Ingrese un número válido", }, - edu: { - heading1: "Visión general de los sistemas de medida", - p1: "Los sistemas de medida son colecciones de unidades de medida y reglas que las relacionan entre sí. Los dos sistemas más comunes son el Sistema Métrico (Sistema Internacional de Unidades o SI) y el Sistema Imperial. El sistema métrico está basado en potencias de diez, lo que lo hace muy lógico y fácil de escalar. El sistema imperial, utilizado principalmente en los Estados Unidos, usa unidades como pulgadas, pies y libras que tienen orígenes históricos y factores de conversión menos uniformes. Entender las diferencias entre estos sistemas es esencial para la ciencia, la ingeniería, el comercio internacional y tareas cotidianas como cocinar o viajar.", - heading2: "Cómo usar esta herramienta", - p2: "Selecciona la categoría de medida (ej., Longitud, Peso, Temperatura) de la cuadrícula en la parte superior. Elige la unidad desde la que deseas convertir en el menú desplegable Desde. Ingresa el valor que deseas convertir en el campo de entrada. Selecciona la unidad destino en el menú desplegable Hacia. El valor convertido aparecerá instantáneamente junto con la fórmula matemática utilizada para la conversión.", - heading3: "Casos de uso comunes", - p3: "Viajes para convertir distancias de kilómetros a millas o temperaturas de Celsius a Fahrenheit. Cocina para traducir recetas entre medidas métricas (gramos/mililitros) e imperiales (onzas/tazas). Ingeniería y ciencia para conversiones precisas entre diferentes unidades de presión, energía o velocidad. Almacenamiento digital para entender la diferencia entre Megabytes, Gigabytes y Terabytes.", - heading4: "Consejos profesionales", - p4: "Usa el botón Intercambiar para invertir rápidamente la dirección de conversión entre tus unidades seleccionadas. Siempre verifica el tipo de unidad específico, especialmente para volumen y peso, ya que los nombres pueden ser similares en diferentes sistemas como galones de EE.UU. vs. del Reino Unido. Al realizar múltiples conversiones en secuencia, conserva la mayor cantidad posible de decimales hasta el resultado final para evitar errores de redondeo acumulados.", - }, }, "yaml-toml-converter": { name: "Conversor YAML/TOML", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ Conversión TOML fallida:", tpl7: "Esperando conversión.", }, - edu: { - heading1: "YAML frente a TOML frente a JSON", - p1: "JSON es el formato más utilizado para el intercambio de datos gracias a su simplicidad y su soporte nativo en JavaScript. YAML (YAML Ain't Markup Language) es un estándar de serialización de datos legible para humanos que usa la sangría para representar la estructura, lo que lo hace popular para archivos de configuración complejos. TOML (Tom's Obvious, Minimal Language) está diseñado para ser fácil de leer y escribir gracias a su semántica obvia, y suele usarse para la configuración de proyectos. Mientras que JSON es estricto y compacto, YAML y TOML priorizan la legibilidad humana y la facilidad de edición manual.", - heading2: "Cómo usar esta herramienta", - p2: "Pega tus datos de configuración (JSON, YAML o TOML) en el área de texto de origen de la izquierda. La herramienta detectará automáticamente el formato de origen, o puedes seleccionarlo manualmente en el menú desplegable. Haz clic en Solo validar para comprobar errores de sintaxis sin realizar una conversión. Haz clic en uno de los botones de conversión (a JSON, a YAML, a TOML) para traducir tus datos a ese formato. Consulta los resultados en los paneles de salida de la derecha y haz clic en Copiar para guardarlos en tu portapapeles.", - heading3: "Casos de uso comunes", - p3: "Infraestructura como código para convertir entre JSON y YAML al trabajar con manifiestos de Kubernetes, archivos Docker Compose o plantillas de AWS CloudFormation. Configuración de proyectos para migrar ajustes entre package.json (JSON) y pyproject.toml o Cargo.toml (TOML). Prototipado de API para visualizar rápidamente cómo se ve una estructura de datos compleja en distintos formatos. Migración heredada para traducir archivos de configuración antiguos a formatos modernos garantizando la integridad de los datos.", - heading4: "Consejos profesionales", - p4: "Usa YAML para pipelines de CI/CD donde la legibilidad de estructuras anidadas complejas es esencial para el mantenimiento. Prefiere TOML para archivos de configuración a nivel de aplicación, para ofrecer una interfaz clara a los usuarios finales que puedan necesitar editarlos manualmente. Al convertir de YAML a JSON, ten en cuenta los problemas de coerción de tipos de YAML (donde NO puede interpretarse como false) y asegúrate de que tus tipos de datos se conserven correctamente.", - }, cheatsheet: { title: "Comparación de formatos", h0: "Diferencias de sintaxis", @@ -1719,16 +1507,6 @@ export default { text1: "Copiar", text2: "¡Copiado!", }, - edu: { - heading1: "¿Qué es htpasswd?", - p1: "

El archivo htpasswd es una base de datos de archivo plano que se usa para almacenar nombres de usuario y contraseñas con hash para la autenticación básica en servidores web Apache y Nginx. Es una forma simple pero eficaz de proteger directorios específicos o paneles de administración de un sitio web sin necesitar un sistema de autenticación completo respaldado por una base de datos.

Cada línea de un archivo htpasswd representa un único usuario y sigue el formato username:hashed_password.

", - heading2: "Cómo usar esta herramienta", - p2: "
  1. Introduce el nombre de usuario: Escribe el nombre de usuario que quieres usar para la autenticación.
  2. Proporciona la contraseña: Introduce una contraseña o haz clic en Generar segura para crear una.
  3. Selecciona el algoritmo: Elige Bcrypt (-B) para seguridad moderna o Apache MD5 (-m) para compatibilidad heredada.
  4. Genera: Haz clic en Generar entrada para crear la cadena con hash.
  5. Copia o descarga: Copia la línea resultante a tu portapapeles o descárgala como archivo para subirla a tu servidor.
", - heading3: "Casos de uso comunes", - p3: "", - heading4: "Consejos profesionales", - p4: "", - }, }, "mock-data-generator": { name: "Generador de Datos de Prueba", @@ -1762,16 +1540,6 @@ export default { text1: "Copiar", text2: "No hay filas para previsualizar.", }, - edu: { - heading1: "¿Qué son los datos simulados?", - p1: "

Los datos simulados son información sintética que imita los datos del mundo real sin contener información sensible o de identificación personal (PII). Son esenciales para desarrolladores y evaluadores que necesitan conjuntos de datos realistas para construir y validar aplicaciones sin arriesgar violaciones de datos o infringir regulaciones de privacidad como GDPR o CCPA. Al usar datos simulados, puedes simular varios escenarios, desde perfiles de usuario estándar hasta casos extremos, asegurando que tu software maneje todos los tipos de entrada correctamente.

", - heading2: "Estrategias de prueba", - p2: "

Las pruebas efectivas requieren conjuntos de datos diversos. Usa datos simulados para poblar tus bases de datos de desarrollo, realizar pruebas de carga con miles de registros o verificar diseños de UI con longitudes de cadenas variables. Es particularmente útil para pruebas de integración donde necesitas respuestas predecibles de APIs externas. Al generar datos localmente, puedes crear entornos de prueba consistentes que son fáciles de restablecer y reproducir, lo que lleva a ciclos de desarrollo más confiables y rápidos.

", - heading3: "Privacidad de datos en simulaciones", - p3: "

La privacidad es una prioridad máxima en el desarrollo de software moderno. Usar datos de producción reales en entornos de desarrollo o staging es un riesgo de seguridad importante. Los generadores de datos simulados resuelven esto produciendo datos falsos pero estructuralmente correctos. Nuestra herramienta se ejecuta completamente en tu navegador, lo que significa que tu configuración y los datos generados nunca abandonan tu dispositivo. Este enfoque de Privacidad primero garantiza que incluso el proceso de crear datos simulados sea seguro y cumpla con los estándares de seguridad más estrictos.

", - heading4: "Consejos profesionales", - p4: "", - }, cheatsheet: { title: "Tipos de campos de datos simulados", h0: "Tipos disponibles", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "Convenciones de nomenclatura explicadas (camelCase/snake_case/etc.)", - heading2: "Cómo usar esta herramienta", - heading3: "Casos de uso comunes", - heading4: "Consejos profesionales", - p1: "

Las convenciones de nomenclatura son conjuntos de reglas para elegir la secuencia de caracteres que se usará en los identificadores que designan variables, tipos, funciones y otras entidades en el código fuente y la documentación. camelCase (por ejemplo, myVariable) comienza con una letra minúscula y pone en mayúscula la primera letra de cada palabra siguiente. snake_case (por ejemplo, my_variable) usa guiones bajos para separar las palabras.

PascalCase (por ejemplo, MyVariable) pone en mayúscula la primera letra de cada palabra, mientras que kebab-case (por ejemplo, my-variable) usa guiones para separar las palabras. Estas convenciones no son solo cuestión de estética; son fundamentales para la legibilidad del código, su mantenibilidad y el cumplimiento de los estándares idiomáticos de los distintos lenguajes de programación y frameworks.

", - p2: "
  1. Escribe o pega tu texto en el área \"Texto de entrada\" en la parte superior de la página.
  2. La herramienta convertirá automáticamente tu entrada a más de una docena de estilos de mayúsculas/minúsculas diferentes en tiempo real.
  3. Recorre la cuadrícula \"Resultados de la conversión\" para encontrar el estilo específico que necesitas.
  4. Haz clic en el icono \"Copiar\" junto a cualquier resultado para guardarlo en tu portapapeles.
  5. Usa el botón \"Limpiar\" para eliminar toda la entrada y empezar una nueva conversión.
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "Minificador de Código", @@ -1913,16 +1671,6 @@ export default { text2: "📋 Copiar", tpl3: "Todo el procesamiento ocurre en su navegador. Su código nunca sale de su dispositivo.", }, - edu: { - heading1: "¿Qué es la minificación?", - heading2: "Cómo usar esta herramienta", - heading3: "Casos de uso comunes", - heading4: "Consejos profesionales", - p1: "

La minificación es el proceso de eliminar todos los caracteres innecesarios del código fuente sin cambiar su funcionalidad. Esto incluye eliminar espacios en blanco, saltos de línea, comentarios y, a veces, acortar los nombres de las variables. El objetivo es reducir el tamaño del archivo de código, lo que a su vez reduce la cantidad de datos que hay que transferir por la red.

Esto se traduce en tiempos de carga de página más rápidos y un mejor rendimiento para las aplicaciones web. Aunque la minificación es esencial para los entornos de producción, hace que el código sea prácticamente imposible de leer y depurar para los humanos. Por eso, normalmente se realiza como último paso del proceso de build antes de desplegar en un servidor en producción.

", - p2: "
  1. Selecciona el lenguaje de programación (JavaScript, CSS, HTML o JSON) en las pestañas de arriba.
  2. Pega tu código fuente en el área de texto \"Código de entrada\" a la izquierda.
  3. Haz clic en el botón \"Minificar código\" para reducir el tamaño del archivo para uso en producción.
  4. Como alternativa, haz clic en \"Formatear código\" para añadir sangría y formato y mejorar la legibilidad.
  5. Consulta los resultados en el área \"Código de salida\" y haz clic en \"Copiar\" o \"Descargar\" para guardar tu código optimizado.
", - p3: "", - p4: "", - }, }, "image-converter": { name: "Conversor de Imágenes", @@ -1969,16 +1717,6 @@ export default { alert2: "Error al leer archivo.", tpl3: "Procesamiento del lado del cliente con Canvas API - sin subidas, resultados instantáneos", }, - edu: { - heading1: "Comparación de formatos de imagen (PNG/JPEG/WebP)", - p1: "

Elegir el formato de imagen adecuado es crucial para el rendimiento web y la calidad visual. JPEG es el mejor para fotografías e imágenes complejas con muchos colores, ya que usa compresión con pérdida para lograr tamaños de archivo pequeños. PNG es ideal para imágenes que requieren transparencia o tienen bordes definidos y colores sólidos (como logotipos e iconos), ya que usa compresión sin pérdida.

WebP es un formato moderno que ofrece una compresión con y sin pérdida superior, lo que suele resultar en tamaños de archivo significativamente más pequeños que JPEG o PNG manteniendo una alta calidad.

", - heading2: "Cómo usar esta herramienta", - p2: "
  1. Sube tu imagen arrastrándola a la zona Subir imagen o haciendo clic para explorar tus archivos.
  2. Selecciona el formato de salida que quieras (PNG, JPG o WebP) en las opciones de Formato de conversión.
  3. Si has seleccionado un formato con pérdida como JPG o WebP, usa el deslizador de calidad para equilibrar el tamaño de archivo y la fidelidad visual.
  4. Opcionalmente, usa los ajustes de Redimensionar imagen para escalar tu imagen por porcentaje o dimensiones específicas.
  5. Haz clic en Convertir y redimensionar imagen y luego en Descargar para guardar tu recurso optimizado.
", - heading3: "Casos de uso comunes", - p3: "", - heading4: "Consejos profesionales", - p4: "", - }, }, "css-gradient": { name: "Generador de Degradados CSS", @@ -2018,16 +1756,6 @@ export default { alert2: "Error al copiar CSS al portapapeles", tpl3: "Pantallas de carga y superposiciones", }, - edu: { - heading1: "¿Qué son los degradados CSS?", - heading2: "Degradados lineales frente a radiales frente a cónicos", - heading3: "Compatibilidad con navegadores y rendimiento", - heading4: "Consejos profesionales para mejores degradados", - p1: "

Los degradados CSS son una característica potente que te permite mostrar transiciones suaves entre dos o más colores especificados. A diferencia de las imágenes de fondo tradicionales, los degradados los genera el navegador, lo que significa que son infinitamente escalables, consumen menos ancho de banda y se pueden manipular fácilmente con código. Se usan habitualmente en fondos, botones y elementos decorativos para añadir profundidad e interés visual a los diseños web.

", - p2: "

Hay tres tipos principales de degradados CSS:

", - p3: "

Los degradados CSS modernos son ampliamente compatibles con todos los navegadores principales, incluidos Chrome, Firefox, Safari y Edge. Como el motor del navegador los renderiza matemáticamente, tienen un rendimiento excelente en comparación con las imágenes de alta resolución. Sin embargo, para degradados muy complejos con docenas de puntos de color, siempre es buena práctica probar el rendimiento en dispositivos de gama baja. Para navegadores más antiguos (como IE9 e inferiores), se recomienda ofrecer un color sólido de reserva.

", - p4: "", - }, }, "curl-studio": { name: "Estudio cURL", @@ -2096,16 +1824,6 @@ export default { text2: "¡Copiado!", tpl3: "Los registros aparecerán aquí después del enmascaramiento...", }, - edu: { - heading1: "¿Qué es la PII?", - p1: "

La información de identificación personal (PII) es cualquier dato que se pueda usar para identificar a una persona concreta. Esto incluye identificadores directos como nombres, direcciones de correo electrónico y números de teléfono, así como identificadores indirectos como direcciones IP, ubicaciones físicas y números de tarjetas de crédito. En el contexto de los logs de servidor, la PII suele aparecer en parámetros de solicitud, encabezados o mensajes de error.

Proteger la PII es una parte fundamental de la seguridad de datos moderna y es un requisito de diversos marcos legales en todo el mundo.

", - heading2: "Requisitos de cumplimiento (RGPD/CCPA)", - p2: "

Normativas como el Reglamento General de Protección de Datos (RGPD) en Europa y la Ley de Privacidad del Consumidor de California (CCPA) en Estados Unidos imponen reglas estrictas sobre cómo se manejan los datos personales. Estas leyes exigen a las organizaciones implementar la privacidad desde el diseño y minimizar la recopilación y el almacenamiento de datos personales.

Compartir logs sin procesar que contengan PII con equipos de soporte externos o desarrolladores puede provocar infracciones de cumplimiento. Enmascarar o redactar estos datos antes de que salgan de tu entorno seguro es un paso clave para mantener el cumplimiento normativo.

", - heading3: "Estrategias de enmascarado", - p3: "

Hay varias formas de gestionar los datos sensibles en los logs:

Nuestra herramienta se centra en la redacción, usando coincidencia de patrones para encontrar y reemplazar al instante los formatos comunes de PII.

", - heading4: "Consejos profesionales", - p4: "", - }, }, "mermaid-studio": { name: "Estudio Mermaid", @@ -2306,16 +2024,6 @@ export default { text51: "Aún no se han extraído URLs.", text52: "Aún no hay datos de enrutamiento.", }, - edu: { - heading1: "Autenticación de correo electrónico explicada", - heading2: "SPF/DKIM/DMARC", - heading3: "Detección de phishing", - heading4: "Consejos profesionales", - p1: "

La autenticación de correo electrónico es un conjunto de técnicas utilizadas para proporcionar información verificable sobre el origen de un mensaje de correo. Al validar la identidad del remitente, estos protocolos ayudan a los servidores de correo a distinguir entre mensajes legítimos y otros suplantados o fraudulentos (como el phishing). Los tres pilares de la autenticación de correo moderna son SPF, DKIM y DMARC.

Cuando se recibe un correo, el servidor receptor realiza estas comprobaciones y registra los resultados en los encabezados del correo, que esta herramienta analiza por ti.

", - p2: "", - p3: "

Los correos de phishing suelen usar la \"suplantación\" (spoofing) para parecer que provienen de una fuente de confianza. Nuestro analizador busca señales de alerta comunes, como una discrepancia entre la dirección \"From\" (lo que ve el usuario) y el \"Return-Path\" (de dónde vino realmente el correo). También extraemos y analizamos las URL del cuerpo del correo para identificar enlaces sospechosos, como los que usan Punycode (dominios similares) o direcciones IP en lugar de nombres de host.

Al revisar la sección \"Findings\", puedes identificar rápidamente estas señales y determinar si es seguro interactuar con un correo.

", - p4: "", - }, cheatsheet: { title: "Referencia rápida de autenticación de correo", h0: "Qué significan estas comprobaciones", @@ -2491,16 +2199,6 @@ export default { text9: "Primero pega SQL.", text10: "✓ Copiado", }, - edu: { - heading1: "¿Por qué formatear SQL?", - p1: "El SQL puede volverse complejo y difícil de leer rápidamente, especialmente cuando se trata de múltiples joins, subconsultas y condiciones anidadas. Formatear SQL implica añadir sangría coherente, saltos de línea y mayúsculas en las palabras clave. Esto hace que la lógica de la consulta sea mucho más fácil de seguir, algo esencial para la depuración, las revisiones de código y el mantenimiento de esquemas de bases de datos grandes con el tiempo. Una consulta bien formateada también es menos propensa a errores lógicos durante las ediciones manuales.", - heading2: "Cómo usar esta herramienta", - p2: "Pega tu consulta SQL sin procesar en el editor SQL de entrada a la izquierda. Selecciona el dialecto de tu base de datos (Postgres o MySQL) y el estilo de mayúsculas preferido para las palabras clave (UPPER o lower). Haz clic en el botón Formatear para embellecer tu consulta con la sangría y el espaciado adecuados. Usa el botón Validar para comprobar problemas estructurales comunes, como comillas sin cerrar o paréntesis desbalanceados. Haz clic en Copiar para guardar el SQL formateado en tu portapapeles o en Limpiar para empezar de nuevo.", - heading3: "Casos de uso comunes", - p3: "Revisiones de código para formatear SQL desordenado antes de enviar un pull request. Depuración para limpiar consultas generadas por ORM y entender exactamente qué se está ejecutando contra tu base de datos. Documentación para crear ejemplos claros y legibles para guías técnicas, wikis o archivos README. Limpieza de código heredado para refactorizar rápidamente scripts antiguos sin formato a un estilo moderno y legible.", - heading4: "Consejos profesionales", - p4: "Usa expresiones de tabla común (CTE) con la cláusula WITH para dividir consultas complejas en partes más pequeñas y manejables. Usa siempre alias descriptivos para tablas y columnas para dejar claro el propósito de tu consulta. Usa el botón Minificar si necesitas comprimir tu SQL en una sola línea para usarlo en archivos de configuración o herramientas de línea de comandos.", - }, cheatsheet: { title: "Consejos de formateo de SQL", h0: "Mejoras rápidas", @@ -2569,16 +2267,6 @@ export default { text15: "Nota: los valores están enmascarados por seguridad. El diff es heurístico y no incluye comentarios/orden.", text16: "✓ Copiado", }, - edu: { - heading1: "Buenas prácticas de variables de entorno", - heading2: "Gestión de secretos", - heading3: "Seguridad de .env", - heading4: "Consejos profesionales", - p1: "

Las variables de entorno son una parte fundamental de la metodología \"Twelve-Factor App\", que defiende una separación estricta entre la configuración y el código. Al usar variables de entorno, puedes ejecutar el mismo código en distintos entornos (desarrollo, staging, producción) simplemente cambiando los valores de configuración.

Las buenas prácticas incluyen usar nombres descriptivos en mayúsculas (por ejemplo, DATABASE_URL), proporcionar valores predeterminados para ajustes no críticos y nunca codificar directamente información sensible en tu control de versiones.

", - p2: "

Los secretos son una categoría especial de variables de entorno que contienen información sensible, como claves de API, contraseñas de bases de datos y certificados privados. Gestionarlos de forma segura es fundamental para prevenir filtraciones de datos. Deberías usar un servicio dedicado de gestión de secretos (como AWS Secrets Manager, HashiCorp Vault o Cloudflare Secrets) para entornos de producción.

Para el desarrollo local, se suelen usar archivos .env, pero nunca deben subirse a tu repositorio de git. Añade siempre *.env a tu archivo .gitignore.

", - p3: "

Al compartir archivos .env con compañeros de equipo para depuración, existe un alto riesgo de exponer accidentalmente secretos de producción. Nuestro gestor ayuda a mitigar este riesgo con una función de \"Enmascarar valores sensibles\". Usa heurísticas para identificar claves como SECRET, TOKEN o PASSWORD y reemplaza sus valores con una versión enmascarada (por ejemplo, ab...yz (32)).

Esto te permite comparar la estructura y los valores no sensibles de tus archivos de entorno sin filtrar los secretos reales.

", - p4: "", - }, cheatsheet: { title: "Notas sobre Dotenv", h0: "Estrategia de enmascarado", @@ -2638,16 +2326,6 @@ export default { text7: "Aún no hay vista previa.", text8: "✓ Copiado", }, - edu: { - heading1: "¿Qué es SVG?", - p1: "SVG (Scalable Vector Graphics) es un formato de imagen vectorial basado en XML para gráficos bidimensionales, con soporte para interactividad y animación. A diferencia de los formatos rasterizados como JPEG o PNG, los SVG se definen mediante rutas matemáticas, lo que significa que se pueden escalar a cualquier tamaño sin perder calidad. Esto los hace perfectos para logotipos, iconos e ilustraciones en la web, donde se mantienen nítidos en cualquier dispositivo, desde pantallas móviles hasta monitores de escritorio de alta resolución.", - heading2: "Cómo usar esta herramienta", - p2: "Pega tu código SVG en el área de texto Entrada SVG a la izquierda. Haz clic en Vista previa para ver el gráfico y extraer su paleta de colores. Usa los botones Optimizar o Minificar para limpiar el marcado y reducir el tamaño del archivo. Opcionalmente, reemplaza colores específicos introduciendo nuevos valores en el panel Colores y haciendo clic en Aplicar. Haz clic en Copiar o Descargar para guardar tu SVG saneado y optimizado.", - heading3: "Casos de uso comunes", - p3: "Gestión de iconos para limpiar SVG exportados desde herramientas de diseño como Figma o Illustrator. Personalización de tema para cambiar rápidamente los colores de un conjunto de iconos y adaptarlos a tu paleta de marca. Seguridad para sanear SVG de fuentes no confiables y eliminar posibles scripts o referencias externas. Rendimiento para minificar el marcado SVG y reducir el tamaño de los gráficos en línea, mejorando los tiempos de carga de la página.", - heading4: "Consejos profesionales", - p4: "Usa el botón currentColor para convertir todos los fills y strokes explícitos a currentColor, haciendo que tu SVG se pueda estilizar fácilmente con CSS. Optimiza siempre tus SVG antes de usarlos en producción para asegurarte de que sean lo más pequeños posible. Al crear SVG en herramientas de diseño, usa las funciones Outline Stroke y Simplify Path para reducir la complejidad del código generado antes de optimizarlo.", - }, cheatsheet: { title: "Notas de seguridad de SVG", h0: "Saneamiento", @@ -2801,16 +2479,6 @@ export default { text28: "Haz clic en Escanear para buscar secretos.", text29: "✓ Copiado", }, - edu: { - heading1: "¿Qué son las filtraciones de secretos?", - p1: "Las filtraciones de secretos ocurren cuando información sensible, como claves de API, contraseñas o tokens privados, se sube accidentalmente al control de versiones o se comparte en foros públicos. Estas filtraciones pueden provocar accesos no autorizados, filtraciones de datos y pérdidas económicas. Esta herramienta ayuda a identificar patrones comunes de secretos localmente en tu navegador antes de que compartas o subas tu código.", - heading2: "Cómo usar esta herramienta", - p2: "Pega tu código, configuración o archivos de log en el área de entrada. Haz clic en el botón Escanear para analizar el texto en busca de posibles secretos. Revisa los hallazgos y los consejos para cada elemento detectado. Usa el botón Copiar redactado para obtener una versión segura de tu texto con los secretos enmascarados, lista para compartir.", - heading3: "Casos de uso comunes", - p3: "Comprobaciones previas al commit para escanear tu código antes de subirlo y asegurarte de que no incluye secretos. Redacción de logs para enmascarar tokens sensibles en los logs antes de compartirlos con soporte o compañeros de equipo. Auditoría de seguridad para revisar rápidamente archivos de configuración en busca de credenciales codificadas.", - heading4: "Consejos profesionales", - p4: "Rota siempre tus credenciales de inmediato si descubres que se han filtrado. Usa variables de entorno o gestores de secretos en lugar de codificar secretos directamente en tu código fuente. Activa Incluir patrones de baja severidad para un escaneo más exhaustivo, pero prepárate para más falsos positivos.", - }, cheatsheet: { title: "Qué hacer si encuentras un secreto", h0: "Pasos inmediatos", @@ -2907,16 +2575,6 @@ export default { text15: "✓ Estructura JWKS válida (", text16: "Pega un JWK.", }, - edu: { - heading1: "¿Qué es un JWT?", - p1: "Un JSON Web Token (JWT) es una forma compacta y segura para URL de representar claims que se transfieren entre dos partes. Un JWT consta de tres partes codificadas en Base64URL separadas por puntos: el Header (algoritmo y tipo), el Payload (claims) y la Signature. La firma garantiza que el token no ha sido manipulado. Los JWT se usan habitualmente para la autenticación y el intercambio de información en API web. Los claims estándar incluyen sub (sujeto), iss (emisor), aud (audiencia), exp (expiración), nbf (no antes de), iat (emitido en) y jti (ID de JWT).", - heading2: "Algoritmos JWT", - p2: "HS256/384/512 usa HMAC con SHA-2 y un secreto compartido: simple, pero ambas partes deben tener la misma clave. RS256/384/512 usa firmas asimétricas RSA PKCS#1 v1.5: ideal para arquitecturas de microservicios donde los servicios solo necesitan la clave pública. ES256/384/512 usa ECDSA con curvas NIST para firmas más pequeñas que RSA con seguridad equivalente. PS256/384/512 usa RSA-PSS, una variante probabilística preferida sobre RS* en sistemas modernos.", - heading3: "JWK y JWKS", - p3: "Un JSON Web Key (JWK) es una estructura JSON que representa una clave criptográfica. Un JWK Set (JWKS) es una estructura JSON que contiene un array de JWK bajo la propiedad keys. Los servicios publican su JWKS en una URL bien conocida (por ejemplo, /.well-known/jwks.json), lo que permite a los clientes obtener claves públicas para verificar JWT sin un intercambio de claves fuera de banda. Las claves de un JWKS se identifican mediante su kid (ID de clave), al que hacen referencia los headers de los JWT.", - heading4: "Buenas prácticas de seguridad", - p4: "Valida siempre los claims exp, nbf, iss y aud en el servidor. Nunca uses el algoritmo alg: none en producción; elimina toda la protección de la firma. Prefiere los algoritmos asimétricos (RS*, ES*, PS*) sobre HMAC cuando varios servicios necesiten verificar tokens. Rota las claves regularmente y usa kid para identificar qué clave se usó para firmar cada token. Almacena las claves privadas de forma segura; nunca las subas al control de versiones. Usa tiempos de expiración cortos y tokens de actualización (refresh tokens) en lugar de JWT de larga duración.", - }, }, "encoding-workbench": { name: "Banco de Codificación", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "No se detectaron capas de codificación reconocibles.", }, - edu: { - heading1: "¿Qué diferencia hay entre codificación y hashing?", - heading2: "Cómo usar esta herramienta", - heading3: "Codificación en capas explicada", - heading4: "Guía de algoritmos de hash", - p1: "

La codificación transforma los datos en una representación distinta que se puede revertir (decodificar). Los formatos comunes incluyen Base64 (usado para transmitir datos binarios por canales de texto), codificación URL, codificación de entidades HTML y hexadecimal. La codificación no es cifrado; no ofrece confidencialidad.

El hashing es una transformación matemática unidireccional. Una función de hash criptográfica toma cualquier entrada y produce una huella de longitud fija. No es posible invertir un hash para recuperar la entrada original. Los hashes se usan para verificar la integridad de archivos, almacenar contraseñas de forma segura y generar firmas digitales.

", - p2: "
  1. Pestaña Codificar / Decodificar: Pega texto y elige una operación (Base64, URL, HTML, Hex), o haz clic en Detectar capas automáticamente para desenvolver automáticamente varias codificaciones anidadas.
  2. Pestaña Hash: Introduce texto o selecciona un archivo, elige los algoritmos y haz clic en Calcular todos los hashes. Activa el modo HMAC para calcular hashes con clave usando un secreto compartido.
  3. Pestaña Identificar: Pega un hash o una cadena codificada desconocida y haz clic en Identificar para ver los algoritmos probables con su nivel de confianza.
", - p3: "

Los datos del mundo real a menudo se codifican varias veces. Por ejemplo, un payload podría estar codificado en URL, luego en Base64 y después colocado dentro de una cadena hexadecimal. La función Detectar capas automáticamente inspecciona el patrón de entrada, intenta cada decodificación en secuencia y visualiza cada paso como una tarjeta para que veas exactamente cómo se envolvieron los datos.

", - p4: "", - }, }, "oauth-debugger": { name: "Depurador OAuth", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "¿Qué es PKCE y por qué importa?", - p1: "

Proof Key for Code Exchange (PKCE, RFC 7636) se diseñó originalmente para apps móviles y nativas que no pueden almacenar de forma segura un secreto de cliente. Funciona haciendo que el cliente genere un code_verifier aleatorio, derive de él un code_challenge (SHA-256 + base64url) y envíe el challenge junto con la solicitud de autorización. Al intercambiar el código de autorización por tokens, el cliente envía el code_verifier original. El servidor de autorización verifica que coincide con el challenge anterior, demostrando que la solicitud de token proviene del mismo cliente que inició el flujo.

Incluso para clientes confidenciales (apps del lado del servidor con un secreto de cliente), OAuth 2.1 ahora recomienda PKCE como defensa contra los ataques de interceptación del código de autorización.

", - heading2: "¿Por qué está obsoleto el flujo implícito?", - p2: "

El flujo implícito (response_type=token) se diseñó como un atajo para aplicaciones de una sola página, devolviendo el token de acceso directamente en el fragmento de la URL. Esto crea problemas graves: los tokens en las URL aparecen en el historial del navegador, los logs del servidor y los encabezados referrer, y el flujo es vulnerable a ataques de inyección de tokens. OAuth 2.0 Security Best Current Practice (RFC 9700) y OAuth 2.1 eliminan explícitamente el flujo implícito en favor de Authorization Code + PKCE, que las SPA pueden usar de forma segura sin un secreto de cliente.

", - heading3: "Cambios clave en OAuth 2.1", - p3: "", - heading4: "Flujo de Authorization Code paso a paso", - p4: "
  1. Genera el par PKCE: crea un code_verifier aleatorio y calcula code_challenge = BASE64URL(SHA256(code_verifier)).
  2. Redirige al endpoint de autorización: incluye response_type=code, client_id, redirect_uri, scope, state, code_challenge y code_challenge_method=S256.
  3. El usuario se autentica en el servidor de autorización y otorga su consentimiento.
  4. Recibe el código de autorización en tu redirect_uri junto con el state reflejado; verifica que state coincide con el que enviaste.
  5. Intercambia el código por tokens: haz un POST al endpoint de token con grant_type=authorization_code, code, redirect_uri, client_id y code_verifier.
  6. Recibe el token de acceso (y opcionalmente id_token y refresh_token) y úsalos para llamar a las API.
", - }, }, "ladder-game": { name: "Juego de Escalera", diff --git a/src/i18n/fr.js b/src/i18n/fr.js index bf66428..759f8e8 100644 --- a/src/i18n/fr.js +++ b/src/i18n/fr.js @@ -90,16 +90,6 @@ export default { text7: "✓ Copié", tpl8: "Profondeur max", }, - edu: { - heading1: "Qu'est-ce que JSON ?", - p1: "

JSON (JavaScript Object Notation) est un format d'échange de données léger, facile à lire et à écrire pour les humains, et facile à analyser et générer pour les machines. Il est basé sur un sous-ensemble du standard du langage de programmation JavaScript. JSON est un format texte complètement indépendant du langage, mais utilise des conventions familières aux programmeurs de la famille de langages C.

Ces propriétés font de JSON un langage idéal d'échange de données pour les applications web, les API et les fichiers de configuration. Il est devenu le standard de facto pour l'échange de données sur le web, remplaçant largement XML grâce à son empreinte plus petite et ses meilleures performances.

", - heading2: "Comment utiliser cet outil", - p2: "
  1. Collez vos données JSON brutes ou désordonnées dans l'éditeur JSON d'entrée à gauche.
  2. Cliquez sur le bouton Formater pour embellir le code avec une indentation appropriée et une coloration syntaxique.
  3. Alternativement, utilisez le bouton Minifier pour supprimer tous les espaces blancs pour une utilisation en production.
  4. Vérifiez l'indicateur de statut pour vous assurer que votre JSON est valide ; s'il y a une erreur, l'outil mettra en évidence la ligne exacte.
  5. Cliquez sur Copier pour sauvegarder le résultat formaté dans votre presse-papiers ou sur Effacer pour recommencer.
", - heading3: "Cas d'utilisation courants", - p3: "", - heading4: "Conseils de pro", - p4: "", - }, }, "jwt-decoder": { name: "Inspecteur JWT", @@ -139,22 +129,6 @@ export default { status5: "Algorithme : ", status6: "Échec du décodage", }, - edu: { - heading1: "Qu'est-ce qu'un JWT ?", - p1: "

Le JSON Web Token (JWT) est une norme ouverte (RFC 7519) qui définit un moyen compact et autonome de transmettre en toute sécurité des informations entre deux parties sous forme d'objet JSON. Ces informations peuvent être vérifiées et fiables car elles sont signées numériquement. Les JWT peuvent être signés à l'aide d'un secret (avec l'algorithme HMAC) ou d'une paire de clés publique/privée utilisant RSA ou ECDSA.

En raison de leur taille compacte, les JWT sont couramment utilisés dans des scénarios d'authentification et d'échange d'informations, comme les jetons Bearer dans les en-têtes HTTP Authorization.

", - heading2: "Comment utiliser cet outil", - p2: "
  1. Collez votre jeton : Copiez votre JWT encodé (header.payload.signature) et collez-le dans le champ de saisie.
  2. Décodage automatique : L'outil détecte automatiquement le jeton et décode ses composants en temps réel.
  3. Inspectez l'en-tête : Vérifiez l'algorithme (alg) et le type de jeton (typ) dans la section En-tête.
  4. Analysez le payload : Examinez les claims, comme l'expiration (exp), l'émetteur (iss) et le sujet (sub) dans la section Payload.
  5. Vérifiez les claims : Consultez l'encadré Analyse des claims pour des dates lisibles et le statut de validation.
", - heading3: "Cas d'utilisation courants", - p3: "", - heading4: "Conseils de pro", - p4: "", - heading5: "Structure du jeton (header.payload.signature)", - p5: "

Un JWT se compose généralement de trois parties séparées par des points :

", - heading6: "Considérations de sécurité", - p6: "

Bien que les JWT soient signés pour garantir l'intégrité, ils ne sont généralement PAS chiffrés. Cela signifie que quiconque possède le jeton peut décoder le header et le payload pour lire les informations qu'ils contiennent. Ne stockez jamais d'informations sensibles comme des mots de passe ou des clés privées dans le payload d'un JWT.

De plus, vérifiez toujours le claim exp (expiration) pour prévenir les attaques par rejeu, et assurez-vous que votre serveur valide la signature avant de faire confiance aux données du payload.

", - heading7: "Conseils de pro", - p7: "", - }, cheatsheet: { title: "Référence rapide JWT", h0: "Structure", @@ -193,16 +167,6 @@ export default { text0: "✓ Copié !", tpl1: "GUID :", }, - edu: { - heading1: "Qu'est-ce qu'un UUID ?", - p1: "Un identifiant unique universel (UUID) est un nombre de 128 bits utilisé pour identifier de manière unique des informations dans les systèmes informatiques. Ils sont conçus pour être générés indépendamment, sans autorité centrale, tout en maintenant une probabilité de collision négligeable.", - heading2: "Comment utiliser cet outil", - p2: "Sélectionnez la version UUID (v1 pour une génération basée sur le temps, v4 pour l'aléatoire) et le nombre d'identifiants dont vous avez besoin. Cliquez sur Générer pour créer une liste d'identifiants uniques prêts à l'emploi dans votre base de données ou votre application.", - heading3: "Cas d'utilisation courants", - p3: "Clés primaires dans les bases de données distribuées, identifiants de session, suivi des transactions, et nommage de fichiers ou ressources temporaires où l'unicité est critique sur plusieurs systèmes.", - heading4: "Conseils de pro", - p4: "L'UUID v4 est le choix le plus courant pour des identifiants uniques génériques, car il repose sur un aléa de haute qualité. Utilisez la v1 si vous avez besoin de trier les identifiants par date de création.", - }, }, "password-generator": { name: "Générateur de Mots de Passe", @@ -265,24 +229,6 @@ export default { status6: "Faible", text1: "Veuillez saisir une adresse e-mail de base valide.", }, - edu: { - heading1: "Qu'est-ce qui rend un mot de passe sécurisé ?", - p1: "

Un mot de passe sécurisé est votre première ligne de défense contre les accès non autorisés. À l'ère du calcul haute vitesse, la sécurité est définie par l'entropie — la mesure de l'aléatoire et de l'imprévisibilité d'une chaîne. Un mot de passe fort doit être long (au moins 16 caractères), unique pour chaque compte, et composé d'un ensemble diversifié de types de caractères incluant majuscules, minuscules, chiffres et symboles.

Évitez d'utiliser des informations personnelles comme les dates de naissance, les noms d'animaux ou les mots courants du dictionnaire. Même des substitutions d'apparence complexe comme P@ssw0rd123 sont facilement déchiffrées par des outils modernes de force brute qui utilisent de vastes dictionnaires de motifs courants.

", - heading2: "Comment utiliser cet outil", - p2: "
  1. Sélectionnez votre mode : Choisissez entre Mot de passe, Nom d'utilisateur, Phrase de passe ou Alias e-mail selon vos besoins.
  2. Ajustez la longueur : Utilisez le curseur pour définir la longueur souhaitée. Pour les mots de passe, 16+ caractères sont recommandés pour une haute sécurité.
  3. Configurez les options : Activez ou désactivez les jeux de caractères (symboles, chiffres, etc.) ou les styles (lisible vs. sécurisé).
  4. Générer : Cliquez sur le bouton Générer pour créer vos identifiants uniques.
  5. Copier : Utilisez l'icône de copie pour déplacer en toute sécurité le résultat vers votre presse-papiers ou gestionnaire de mots de passe.
", - heading3: "Cas d'utilisation courants", - p3: "", - heading4: "Conseils de pro", - p4: "", - heading5: "Qu'est-ce qui rend un mot de passe sécurisé ?", - p5: "

Un mot de passe sécurisé est votre première ligne de défense contre les accès non autorisés. À l'ère du calcul haute vitesse, la sécurité est définie par l'entropie — la mesure de l'aléatoire et de l'imprévisibilité d'une chaîne. Un mot de passe fort doit être long (au moins 16 caractères), unique pour chaque compte, et composé d'un ensemble diversifié de types de caractères incluant majuscules, minuscules, chiffres et symboles.

Évitez d'utiliser des informations personnelles comme les dates de naissance, les noms d'animaux ou les mots courants du dictionnaire. Même des substitutions d'apparence complexe comme P@ssw0rd123 sont facilement déchiffrées par des outils modernes de force brute qui utilisent de vastes dictionnaires de motifs courants.

", - heading6: "L'entropie expliquée", - p6: "

L'entropie est une mesure de l'aléatoire et de l'imprévisibilité d'un mot de passe, exprimée généralement en bits. Plus l'entropie est élevée, plus le mot de passe est fort. Par exemple, un mot de passe de 10 caractères utilisant uniquement des lettres minuscules a une entropie bien inférieure à un mot de passe de 10 caractères utilisant un ensemble complet de caractères alphanumériques et spéciaux.

Notre générateur calcule l'entropie en temps réel pour vous donner une mesure objective de la force de votre mot de passe. Un mot de passe avec plus de 100 bits d'entropie est considéré comme exceptionnellement fort et résistant aux techniques modernes de déchiffrage.

", - heading7: "Meilleures pratiques", - p7: "", - heading8: "Conseils de pro", - p8: "", - }, }, "hash-calculator": { name: "Calculateur de Hash", @@ -350,16 +296,6 @@ export default { tpl4: "En attente de saisie...", text2: "Calculé : ", }, - edu: { - heading1: "Qu'est-ce que le hachage ?", - p1: "

Le hachage cryptographique est un processus mathématique qui transforme n'importe quelle donnée d'entrée (texte ou fichiers) en une chaîne de caractères de taille fixe, généralement un nombre hexadécimal. Cette empreinte est unique à l'entrée ; même un seul bit modifié dans les données source produit un hash complètement différent, un phénomène appelé effet d'avalanche.

Contrairement au chiffrement, le hachage est une fonction à sens unique. Vous ne pouvez pas inverser un hash pour récupérer les données d'origine. Cela le rend idéal pour vérifier l'intégrité des données, stocker des mots de passe en toute sécurité (combinés à des sels), et identifier des fichiers sans exposer leur contenu.

", - heading2: "Comment utiliser cet outil", - p2: "
  1. Sélectionnez le type d'entrée : Choisissez l'onglet Texte pour des chaînes ou l'onglet Fichier pour des fichiers locaux.
  2. Fournissez l'entrée : Collez votre texte ou glissez-déposez votre fichier dans l'espace de travail.
  3. HMAC optionnel : Saisissez une clé secrète dans le champ HMAC si vous devez générer un hash à clé pour l'authentification.
  4. Consultez les résultats : L'outil calcule automatiquement plusieurs variantes de hash (SHA-256, SHA-512, etc.) en temps réel.
  5. Vérifiez l'intégrité : Utilisez l'onglet Vérifier pour comparer un hash connu à votre entrée afin de détecter toute altération.
", - heading3: "Cas d'utilisation courants", - p3: "", - heading4: "Conseils de pro", - p4: "", - }, cheatsheet: { title: "Référence des algorithmes de hash", h0: "Comparaison des algorithmes", @@ -435,16 +371,6 @@ export default { text5: "Utilisez au moins /", text6: "IPv6 /", }, - edu: { - heading1: "Qu'est-ce que CIDR ?", - heading2: "Comment utiliser cet outil", - heading3: "Cas d'utilisation courants", - heading4: "Conseils de pro", - p1: "Le routage inter-domaines sans classe (CIDR) est une méthode d'allocation des adresses IP et du routage IP. Il a remplacé l'ancien système basé sur les classes (A, B et C) pour offrir plus de flexibilité et d'efficacité dans la distribution des adresses.", - p2: "Saisissez une adresse IP avec un préfixe (ex. : 192.168.1.0/24) ou utilisez le curseur pour ajuster la longueur du préfixe. Cliquez sur \"Lancer l'analyse\" pour voir les détails du réseau, les plages d'hôtes utilisables et les représentations binaires.", - p3: "Planification des sous-réseaux pour l'infrastructure cloud (VPC), dépannage des problèmes de routage, calcul de la capacité d'hôtes pour un préfixe donné et conversion entre CIDR et masques de sous-réseau.", - p4: "Rappellez-vous qu'en IPv4, les première et dernière adresses d'un sous-réseau sont généralement réservées pour l'ID de réseau et l'adresse de diffusion. En IPv6, les sous-réseaux sont presque toujours /64 pour les réseaux locaux standard.", - }, cheatsheet: { title: "Référence rapide de sous-réseau", h0: "Sous-réseaux courants", @@ -619,16 +545,6 @@ export default { tpl3: "Modifier les valeurs par défaut :", tpl4: "Aucun port ne correspond à votre recherche.", }, - edu: { - heading1: "Catégories de ports et guide de sécurité", - p1: "Les ports bien connus (0-1023) sont attribués par l'IANA et nécessitent des privilèges root sur les systèmes Unix. Les ports enregistrés (1024-49151) sont utilisés par les applications. Les ports dynamiques/éphémères (49152-65535) sont utilisés pour les connexions côté client. Comprendre les plages de ports est essentiel pour la configuration du pare-feu et la sécurité réseau.", - heading2: "Comment utiliser cet outil", - p2: "Recherchez par numéro de port ou nom de service pour trouver les détails du protocole et les niveaux de risque de sécurité. Filtrez par catégorie (Bien connus, Enregistrés, Dynamiques) ou protocole (TCP/UDP) pour affiner les résultats. Cliquez sur une ligne pour voir tous les détails, y compris les vulnérabilités courantes et les recommandations de durcissement.", - heading3: "Cas d'utilisation courants", - p3: "Configuration des règles de pare-feu, dépannage réseau, identification de ports ouverts inattendus lors d'audits de sécurité, et référence rapide pour les affectations de ports des protocoles.", - heading4: "Conseils de pro", - p4: "Utilisez le filtre de risque pour identifier rapidement les ports à haut risque de votre réseau. La section Top 50 des ports les plus courants vous donne un aperçu instantané des services les plus fréquemment utilisés.", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
PortServiceRisque
21FTPTransferts de fichiers non chiffrés
23TelnetAuthentification en clair
25SMTPRisque de relais de spam
53DNSAttaques par amplification DDoS
445SMBPropagation de rançongiciels
3389RDPAttaques par force brute
", @@ -872,16 +788,6 @@ export default { text4: "Avertissements", alert0: "Veuillez d'abord générer une configuration", }, - edu: { - heading1: "À propos de WireGuard", - p1: "WireGuard est un protocole VPN moderne et hautes performances qui utilise une cryptographie de pointe. Il est conçu pour être plus simple et plus rapide que les anciens protocoles comme OpenVPN et IPsec, avec une surface d'attaque bien plus réduite grâce à sa base de code minimale. WireGuard fait désormais partie du noyau Linux et est pris en charge nativement sur Windows, macOS, iOS et Android.", - heading2: "Comment utiliser cet outil", - p2: "Sélectionnez un modèle de topologie (Point à point, Étoile, Site à site ou Nomade) pour préremplir une configuration. Cliquez sur Générer les clés pour créer une nouvelle paire de clés localement dans votre navigateur. Remplissez les champs obligatoires et cliquez sur Générer la configuration pour produire le fichier de configuration WireGuard. Utilisez Télécharger .conf pour enregistrer le fichier ou Générer un QR pour créer un code QR destiné à l'import mobile.", - heading3: "Cas d'utilisation courants", - p3: "VPN d'accès distant pour les employés se connectant aux réseaux de l'entreprise. VPN site à site pour connecter les réseaux de succursales. Serveur VPN personnel pour naviguer en sécurité sur le Wi-Fi public. Tunneling d'appareils IoT pour une communication sécurisée entre dispositifs embarqués.", - heading4: "Conseils de pro", - p4: "Utilisez PersistentKeepalive = 25 sur les clients derrière un NAT pour maintenir le tunnel lorsqu'aucun trafic ne circule. PresharedKey ajoute une couche supplémentaire de chiffrement symétrique pour la résistance post-quantique. AllowedIPs = 0.0.0.0/0 achemine tout le trafic à travers le tunnel (tunnel complet), tandis que des CIDR spécifiques créent un tunnel scindé.", - }, cheatsheet: { title: "Référence rapide WireGuard", h0: "Champs Interface", @@ -1025,14 +931,6 @@ export default { tpl6: "Exemple :", tpl7: "Cliquez sur un champ du diagramme pour voir les détails.", }, - edu: { - heading1: "Que sont les en-têtes de protocole ?", - p1: "Les en-têtes de protocole sont des données structurées qui précèdent le payload dans les paquets réseau. Ils contiennent des informations de contrôle telles que les adresses source et destination, les types de protocole, les numéros de séquence et les sommes de contrôle. Comprendre la structure des en-têtes est essentiel pour le débogage réseau, l'analyse de paquets et l'implémentation de protocoles.", - heading2: "Comment utiliser cet outil", - p2: "Sélectionnez un protocole dans les onglets pour voir sa structure d'en-tête. Chaque bloc coloré représente un champ avec sa taille indiquée. Cliquez sur un champ pour voir des informations détaillées, notamment le nom et la description du champ, le décalage en bits/octets, les valeurs courantes et leur signification, et la référence RFC. Utilisez l'analyseur de dump hexadécimal pour analyser de vraies captures de paquets en collant la sortie hex d'outils comme tcpdump ou Wireshark.", - heading3: "Cas d'utilisation courants", - p3: "Analyse de paquets pour comprendre la structure du trafic réseau capturé, apprentissage des protocoles comme aide visuelle pour étudier les protocoles réseau, débogage pour identifier des en-têtes malformés ou des valeurs de champ incorrectes, et référence de développement lors de l'implémentation de protocoles réseau.", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
ValeurProtocole
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
ChampTailleDescription
Source Port2 octetsNuméro de port de l'émetteur
Dest Port2 octetsNuméro de port du destinataire
Seq Number4 octetsNuméro de séquence
Ack Number4 octetsNuméro d'acquittement
Data Offset4 bitsLongueur d'en-tête / 4
Flags9 bitsNS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 octetsTaille de la fenêtre de réception
", @@ -1108,16 +1006,6 @@ export default { tpl0: "Différences", tpl1: "Aucune différence trouvée (ou saisie vide)", }, - edu: { - heading1: "Qu'est-ce que la comparaison de texte (diff) ?", - p1: "La comparaison de texte (diff) consiste à comparer deux séquences de données pour identifier leurs différences. Elle met en évidence ce qui a été ajouté, supprimé ou modifié. C'est une opération fondamentale en développement logiciel, en analyse de données et en gestion de contenu, permettant de suivre les modifications au fil du temps ou de comparer différentes versions d'un document.", - heading2: "Algorithmes de diff", - p2: "La plupart des outils de comparaison de texte utilisent des algorithmes basés sur le problème de la plus longue sous-séquence commune (LCS). L'objectif est de trouver la plus longue séquence d'éléments apparaissant dans les deux textes dans le même ordre relatif. Les implémentations courantes incluent l'algorithme de diff de Myers, très efficace et utilisé par Git, ainsi que l'algorithme de Hunt-McIlroy. Ces algorithmes calculent le nombre minimal de modifications nécessaires pour transformer un texte en un autre.", - heading3: "Cas d'utilisation", - p3: "Revues de code pour que les développeurs voient exactement ce qui a changé dans une pull request. Les systèmes de contrôle de version comme Git stockent l'historique sous forme de série de diffs pour économiser de l'espace. Audit de contenu pour les rédacteurs et éditeurs comparant des brouillons afin de s'assurer que toutes les modifications demandées ont été effectuées. Validation de données pour comparer des fichiers de configuration ou des exports de base de données afin de trouver des divergences.", - heading4: "Conseils de pro", - p4: "De nombreux outils de diff proposent des options pour ignorer les changements d'indentation ou les espaces en fin de ligne, ce qui réduit le bruit lors de la comparaison de code. Incluez quelques lignes de texte inchangé autour des différences (lignes de contexte) pour comprendre l'impact des changements. Les diffs au niveau du mot sont souvent plus utiles pour la prose et les documents en langage naturel, tandis que les diffs au niveau de la ligne sont la norme pour le code.", - }, }, "regex-visualizer": { name: "Visualiseur de Regex", @@ -1168,16 +1056,6 @@ export default { tpl5: "Aucun groupe", tpl6: "Expression régulière invalide", }, - edu: { - heading1: "Que sont les expressions régulières ?", - p1: "Les expressions régulières (regex) sont des motifs puissants utilisés pour faire correspondre des combinaisons de caractères dans des chaînes. Ce sont des outils essentiels pour le traitement de texte, la validation et l'extraction de données dans tous les langages de programmation. Les motifs regex se composent de caractères littéraux et de métacaractères spéciaux qui définissent des règles de recherche. Ils sont utilisés pour la validation de formulaires, l'analyse de logs, les opérations de recherche et remplacement, et les tâches de nettoyage de données.", - heading2: "Comment utiliser cet outil", - p2: "Saisissez votre motif regex dans le champ de saisie. L'outil génère automatiquement un diagramme ferroviaire visualisant la structure du motif. Ajoutez un texte de test pour voir la mise en évidence des correspondances et les explications en temps réel. Utilisez l'aide-mémoire pour une référence rapide sur les motifs et la syntaxe courants. Générez des extraits de code pour votre langage de programmation préféré.", - heading3: "Cas d'utilisation courants", - p3: "Validation d'e-mail pour s'assurer que la saisie utilisateur correspond au bon format avant traitement, analyse de logs pour extraire les horodatages et adresses IP des journaux serveur, nettoyage de données pour supprimer les caractères indésirables ou formater les numéros de téléphone de manière cohérente, et recherche/remplacement pour des transformations de texte en masse avec correspondance de motifs.", - heading4: "Conseils de pro", - p4: "Commencez simple et construisez des motifs complexes progressivement. Utilisez des groupes non capturants (?:) lorsque vous n'avez pas besoin de référencer la correspondance. Testez les cas limites comme les chaînes vides et les caractères spéciaux. Pensez à la lisibilité des regex — les motifs complexes peuvent être documentés avec des commentaires.", - }, cheatsheet: { title: "Référence rapide Regex", h0: "Classes de caractères", @@ -1323,16 +1201,6 @@ export default { text1: "Copier", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "À propos des clés SSH", - p1: "Les clés SSH sont une paire de clés cryptographiques utilisées pour l'authentification sécurisée sur des systèmes distants. La clé privée reste sur votre machine tandis que la clé publique est placée sur le serveur. Cette approche asymétrique est bien plus sécurisée que l'authentification par mot de passe et constitue la norme du secteur pour l'accès aux serveurs, l'hébergement Git et les déploiements automatisés.", - heading2: "Comment utiliser cet outil", - p2: "Sélectionnez le type de clé souhaité (RSA ou ECDSA) et, pour RSA, choisissez la taille de clé. Ajoutez un commentaire optionnel pour identifier la clé (généralement user@host). Cliquez sur Générer pour créer votre paire de clés. Copiez la clé publique à ajouter sur votre serveur et conservez la clé privée en sécurité sur votre machine locale.", - heading3: "Cas d'utilisation courants", - p3: "Authentification serveur pour une connexion SSH sans mot de passe vers des serveurs distants. Hébergement Git pour s'authentifier auprès de GitHub, GitLab ou Bitbucket sans mot de passe. Pipelines CI/CD pour les scripts de déploiement automatisé devant se connecter aux serveurs. Accès à un hôte bastion pour des configurations de rebond sécurisées.", - heading4: "Conseils de pro", - p4: "Les clés Ed25519 sont recommandées pour les nouveaux déploiements — elles sont plus rapides et plus sécurisées que RSA. Protégez toujours votre clé privée avec une phrase de passe forte. Utilisez ssh-agent pour éviter de saisir votre phrase de passe à répétition durant une session. Stockez les clés dans ~/.ssh/ avec les permissions définies à 600.", - }, cheatsheet: { title: "Référence rapide des clés SSH", h0: "Types de clés", @@ -1372,16 +1240,6 @@ export default { tpl2: "Aucun nom alternatif du sujet présent.", tpl3: "Aucune extension analysée.", }, - edu: { - heading1: "Que sont les certificats X.509 ?", - heading2: "Comment utiliser cet outil", - heading3: "Cas d'utilisation courants", - heading4: "Conseils de pro", - p1: "

X.509 est un format standard pour les certificats à clé publique, des documents numériques qui lient de manière sécurisée une clé publique à une identité (comme un site web, une organisation ou un individu). Ces certificats constituent le fondement de l'infrastructure à clé publique (PKI) utilisée pour sécuriser internet via HTTPS, ainsi que pour signer des e-mails et des logiciels.

Un certificat X.509 contient la clé publique, l'identité du détenteur du certificat, et la signature numérique de l'autorité de certification (CA) qui a émis le certificat, prouvant son authenticité.

", - p2: "
  1. Collez votre certificat : Copiez votre certificat encodé en PEM (avec les en-têtes BEGIN et END) et collez-le dans le champ de saisie.
  2. Analysez : Cliquez sur \"Analyser le certificat\" pour extraire et analyser les données.
  3. Consultez le résumé : Vérifiez les cartes en haut pour le nom commun (CN), l'émetteur et les dates de validité.
  4. Inspectez les détails : Développez les sections ci-dessous pour voir l'intégralité du sujet, de l'émetteur, des SAN et des extensions techniques.
  5. Vérifiez le statut : Consultez le badge de statut pour voir si le certificat est actuellement valide ou expiré.
", - p3: "", - p4: "", - }, cheatsheet: { title: "Référence des certificats X.509", h0: "Champs du certificat", @@ -1424,16 +1282,6 @@ export default { text1: "Copier JSON", text2: "Copier XML", }, - edu: { - heading1: "Qu'est-ce que SAML ?", - p1: "Security Assertion Markup Language (SAML) est une norme ouverte basée sur XML pour l'échange de données d'authentification et d'autorisation entre parties, en particulier entre un fournisseur d'identité (IdP) et un fournisseur de services (SP). SAML constitue l'épine dorsale de nombreuses solutions de SSO (Single Sign-On) d'entreprise, permettant aux utilisateurs d'accéder à plusieurs applications avec un seul jeu d'identifiants. La version la plus courante est SAML 2.0, qui utilise des jetons de sécurité contenant des assertions pour transmettre des informations sur un principal entre l'IdP et le SP.", - heading2: "Comment utiliser cet outil", - p2: "Collez le SAMLResponse encodé en Base64 ou le XML brut dans le champ de saisie. Activez Tenter l'inflation si vous décodez un payload de liaison Redirect. Cliquez sur Décoder la réponse pour analyser le message. Consultez le résumé rapide pour l'émetteur, le sujet et le statut de validité. Consultez les attributs utilisateur décodés dans le tableau Attributs. Utilisez les onglets pour voir le XML formaté, les détails de l'assertion, ou une représentation JSON des claims.", - heading3: "Cas d'utilisation courants", - p3: "Dépannage SSO en diagnostiquant pourquoi un utilisateur ne peut pas se connecter, en vérifiant les assertions expirées ou les incohérences d'audience. Tests d'intégration pour vérifier que votre fournisseur d'identité envoie les bons attributs. Audit de sécurité pour inspecter le XML brut et s'assurer que les assertions sont correctement signées. Développement pour consulter rapidement le contenu d'un message SAML lors de l'intégration d'un fournisseur de services.", - heading4: "Conseils de pro", - p4: "Les messages SAML envoyés via HTTP-Redirect sont généralement compressés (deflate) avant l'encodage Base64 — si votre décodage échoue, essayez d'activer la case Tenter l'inflation. Assurez-vous que l'AudienceRestriction correspond à votre Entity ID de SP. Si une réponse est marquée invalide, vérifiez les horaires NotBefore et NotOnOrAfter pour un éventuel décalage d'horloge entre l'IdP et le SP.", - }, cheatsheet: { title: "Référence rapide SAML", h0: "Flux SAML", @@ -1476,16 +1324,6 @@ export default { alert1: "Veuillez saisir une chaîne User-Agent", tpl2: "Sortie brute de l'analyse", }, - edu: { - heading1: "Qu'est-ce qu'un User-Agent ?", - p1: "Un User-Agent est une chaîne envoyée par votre navigateur à chaque site que vous visitez. Elle identifie la version du navigateur, le système d'exploitation et le type d'appareil, permettant aux serveurs d'optimiser le contenu pour votre environnement spécifique.", - heading2: "Comment utiliser cet outil", - p2: "Collez une chaîne User-Agent dans le champ de saisie ou cliquez sur Utiliser ceci pour analyser la chaîne de votre navigateur actuel. L'outil détaillera le moteur du navigateur, la version du système d'exploitation et les caractéristiques de l'appareil.", - heading3: "Cas d'utilisation courants", - p3: "Déboguer des problèmes de compatibilité de site web, analyser les logs de serveur web pour identifier le trafic de bots, vérifier l'usurpation de navigateur, et comprendre la répartition des appareils dans votre audience.", - heading4: "Conseils de pro", - p4: "De nombreux navigateurs modernes figent ou simplifient leur chaîne User-Agent pour empêcher le fingerprinting. Recherchez toujours les jetons Version ou Chrome pour obtenir les informations de version les plus précises.", - }, }, "qr-code": { name: "Générateur de Codes QR", @@ -1524,16 +1362,6 @@ export default { alert3: "Copié !", tpl4: "Téléversez une image à décoder", }, - edu: { - heading1: "Que sont les codes QR ?", - p1: "Les codes QR (Quick Response) sont des codes-barres bidimensionnels capables de stocker divers types de données, le plus souvent des URL. Ils peuvent être scannés par des smartphones et des lecteurs spécialisés pour accéder rapidement à des informations ou déclencher des actions.", - heading2: "Comment utiliser cet outil", - p2: "Saisissez le texte ou l'URL que vous souhaitez encoder. Ajustez la taille et le niveau de correction d'erreur si nécessaire. Le code QR se met à jour en temps réel et peut être téléchargé sous forme d'image pour un usage imprimé ou numérique.", - heading3: "Cas d'utilisation courants", - p3: "Partage de liens de site web, fourniture d'identifiants Wi-Fi, cartes de visite numériques (vCards), billetterie d'événements, et flux de paiement mobile ou d'authentification.", - heading4: "Conseils de pro", - p4: "Des niveaux de correction d'erreur plus élevés (H ou Q) permettent au code QR de rester scannable même s'il est partiellement endommagé ou masqué, ce qui est idéal pour la signalétique physique ou le branding.", - }, }, "timestamp-converter": { name: "Convertisseur d'Horodatage", @@ -1564,16 +1392,6 @@ export default { text0: "Horodatage invalide", tpl1: "Unix (millisecondes)", }, - edu: { - heading1: "Qu'est-ce que l'heure Unix ?", - p1: "L'heure Unix (également connue comme heure Epoch, heure POSIX ou horodatage Unix) est un système pour décrire un moment dans le temps. C'est le nombre de secondes écoulées depuis l'Epoch Unix, moins les secondes intercalaires ; l'Epoch Unix est le 00:00:00 UTC du 1er janvier 1970. Il est largement utilisé dans les systèmes d'exploitation et les formats de fichiers car c'est un seul entier, ce qui facilite son stockage et sa manipulation par les ordinateurs. Ce standard permet à différents systèmes de communiquer le temps avec précision quel que soit leur fuseau horaire local.", - heading2: "Comment utiliser cet outil", - p2: "Pour convertir Unix en Humain : Saisissez l'horodatage dans le champ Horodatage Unix et sélectionnez s'il est en secondes ou millisecondes. Pour convertir Humain en Unix : Sélectionnez la date et l'heure à l'aide des sélecteurs, puis choisissez votre fuseau horaire souhaité. Utilisez le bouton Maintenant pour obtenir rapidement l'horodatage actuel. Consultez les résultats en temps réel, incluant ISO 8601, Heure locale, UTC et heure relative. Cliquez sur le bouton Copier à côté de n'importe quel résultat pour le sauvegarder dans votre presse-papiers.", - heading3: "Cas d'utilisation courants", - p3: "Analyse de journaux pour convertir des horodatages cryptiques trouvés dans des journaux de serveur ou des entrées de base de données en dates lisibles pour le débogage. Développement d'API pour vérifier que votre backend envoie les valeurs d'époque correctes. Migration de données pour s'assurer que les données temporelles restent cohérentes lors du déplacement entre systèmes. Planification pour calculer des horodatages futurs ou passés pour les tâches cron, les dates d'expiration ou les déclencheurs d'événements.", - heading4: "Conseils de pro", - p4: "Lorsque vous travaillez avec JavaScript, rappellez-vous que Date.now() retourne des millisecondes, tandis que les horodatages Unix standard sont en secondes — divisez par 1000 pour convertir. Utilisez toujours le format ISO 8601 pour l'échange de données entre systèmes pour garantir une compatibilité maximale. Soyez conscient du problème de l'an 2038 où les entiers signés 32 bits déborderont ; les systèmes modernes utilisent des entiers 64 bits qui résolvent cela pour l'avenir prévisible.", - }, }, "color-converter": { name: "Convertisseur de Couleurs", @@ -1589,16 +1407,6 @@ export default { badge7: "Côté client uniquement", badge8: "Confidentialité avant tout", }, - edu: { - heading1: "Les modèles de couleur expliqués (HEX/RGB/HSL)", - heading2: "Comment utiliser cet outil", - heading3: "Cas d'utilisation courants", - heading4: "Conseils de pro", - p1: "

Les modèles de couleur sont des systèmes mathématiques pour représenter les couleurs. HEX (Hexadécimal) est un code à 6 chiffres utilisé en HTML et CSS, représentant les composantes Rouge, Vert et Bleu. RGB (Rouge, Vert, Bleu) utilise des valeurs décimales de 0 à 255 pour chaque canal, souvent utilisé en imagerie numérique.

HSL (Teinte, Saturation, Luminosité) est plus intuitif pour les humains, car il décrit la couleur en termes de son pigment de base (Teinte), d'intensité (Saturation) et de luminosité (Luminosité). Comprendre ces modèles aide à choisir le bon format pour vos besoins de conception et de développement, assurant la cohérence sur différentes plateformes et appareils.

", - p2: "
  1. Utilisez le sélecteur de couleur visuel pour sélectionner une couleur en faisant glisser le curseur dans le carré de saturation/luminosité et le curseur de teinte.
  2. Alternativement, saisissez une valeur spécifique dans le champ \"Saisie manuelle\" (prend en charge les formats #hex, rgb ou hsl).
  3. Observez la boîte \"Aperçu\" pour voir la couleur sélectionnée en temps réel.
  4. Consultez les valeurs converties dans les cartes HEX, RGB, HSL et HSV ci-dessous.
  5. Cliquez sur l'icône \"Copier\" sur n'importe quelle carte pour sauvegarder ce format spécifique dans votre presse-papiers.
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "Convertisseur d'Unités", @@ -1616,16 +1424,6 @@ export default { text0: "Sélectionnez des unités pour voir la formule de conversion", text1: "Saisissez un nombre valide", }, - edu: { - heading1: "Aperçu des systèmes de mesure", - p1: "Les systèmes de mesure sont des collections d'unités de mesure et de règles les reliant entre elles. Les deux systèmes les plus courants sont le Système Métrique (Système International d'Unités ou SI) et le Système Impérial. Le système métrique est basé sur les puissances de dix, ce qui le rend très logique et facile à mettre à l'échelle. Le système impérial, principalement utilisé aux États-Unis, utilise des unités comme les pouces, les pieds et les livres qui ont des origines historiques et des facteurs de conversion moins uniformes. Comprendre les différences entre ces systèmes est essentiel pour la science, l'ingénierie, le commerce international et les tâches quotidiennes comme la cuisine ou les voyages.", - heading2: "Comment utiliser cet outil", - p2: "Sélectionnez la catégorie de mesure (ex. : Longueur, Poids, Température) dans la grille en haut. Choisissez l'unité à partir de laquelle vous souhaitez convertir dans le menu déroulant De. Entrez la valeur que vous souhaitez convertir dans le champ de saisie. Sélectionnez l'unité cible dans le menu déroulant Vers. La valeur convertie apparaîtra instantanément avec la formule mathématique utilisée pour la conversion.", - heading3: "Cas d'utilisation courants", - p3: "Voyage pour convertir des distances de kilomètres en miles ou des températures de Celsius en Fahrenheit. Cuisine pour traduire des recettes entre mesures métriques (grammes/millilitres) et impériales (onces/tasses). Ingénierie et science pour des conversions précises entre différentes unités de pression, d'énergie ou de vitesse. Stockage numérique pour comprendre la différence entre Mégaoctets, Gigaoctets et Téraoctets.", - heading4: "Conseils de pro", - p4: "Utilisez le bouton Échanger pour inverser rapidement la direction de conversion entre vos unités sélectionnées. Vérifiez toujours le type d'unité spécifique, surtout pour le volume et le poids, car les noms peuvent être similaires dans différents systèmes comme les gallons américains vs. britanniques. Lors d'une série de conversions multiples, conservez autant de décimales que possible jusqu'au résultat final pour éviter les erreurs d'arrondi cumulées.", - }, }, "yaml-toml-converter": { name: "Convertisseur YAML/TOML", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ Échec de la conversion TOML :", tpl7: "En attente de conversion.", }, - edu: { - heading1: "Comparaison YAML vs TOML vs JSON", - p1: "JSON est le format le plus utilisé pour l'échange de données grâce à sa simplicité et à sa prise en charge native en JavaScript. YAML (YAML Ain't Markup Language) est une norme de sérialisation de données conviviale qui utilise l'indentation pour représenter la structure, ce qui la rend populaire pour les fichiers de configuration complexes. TOML (Tom's Obvious, Minimal Language) est conçu pour être facile à lire et à écrire grâce à sa sémantique évidente, et est souvent utilisé pour la configuration de projets. Alors que JSON est strict et compact, YAML et TOML privilégient la lisibilité humaine et la facilité d'édition manuelle.", - heading2: "Comment utiliser cet outil", - p2: "Collez vos données de configuration (JSON, YAML ou TOML) dans la zone de texte source à gauche. L'outil détecte automatiquement le format source, ou vous pouvez le sélectionner manuellement dans le menu déroulant. Cliquez sur Valider uniquement pour vérifier les erreurs de syntaxe sans effectuer de conversion. Cliquez sur l'un des boutons de conversion (vers JSON, vers YAML, vers TOML) pour convertir vos données dans ce format. Consultez les résultats dans les panneaux de sortie à droite et cliquez sur Copier pour les enregistrer dans votre presse-papiers.", - heading3: "Cas d'utilisation courants", - p3: "Infrastructure as Code pour convertir entre JSON et YAML lors du travail avec des manifestes Kubernetes, des fichiers Docker Compose ou des modèles AWS CloudFormation. Configuration de projet pour migrer des paramètres entre package.json (JSON) et pyproject.toml ou Cargo.toml (TOML). Prototypage d'API pour visualiser rapidement à quoi ressemble une structure de données complexe dans différents formats. Migration héritée pour convertir d'anciens fichiers de configuration vers des formats modernes tout en garantissant l'intégrité des données.", - heading4: "Conseils de pro", - p4: "Utilisez YAML pour les pipelines CI/CD où la lisibilité des structures imbriquées complexes est essentielle à la maintenabilité. Préférez TOML pour les fichiers de configuration au niveau applicatif afin d'offrir une interface propre aux utilisateurs finaux qui pourraient devoir les modifier manuellement. Lors de la conversion de YAML vers JSON, soyez attentif aux problèmes de coercition de type de YAML (où NO peut être interprété comme false) et assurez-vous que vos types de données sont préservés correctement.", - }, cheatsheet: { title: "Comparaison des formats", h0: "Différences de syntaxe", @@ -1719,16 +1507,6 @@ export default { text1: "Copier", text2: "Copié !", }, - edu: { - heading1: "Qu'est-ce que htpasswd ?", - p1: "

Le fichier htpasswd est une base de données à plat utilisée pour stocker des noms d'utilisateur et des mots de passe hachés pour l'authentification basique sur les serveurs web Apache et Nginx. C'est un moyen simple mais efficace de protéger des répertoires spécifiques ou des panneaux d'administration d'un site web sans avoir besoin d'un système d'authentification complet basé sur une base de données.

Chaque ligne d'un fichier htpasswd représente un seul utilisateur et suit le format username:hashed_password.

", - heading2: "Comment utiliser cet outil", - p2: "
  1. Saisissez le nom d'utilisateur : Tapez le nom d'utilisateur que vous souhaitez utiliser pour l'authentification.
  2. Fournissez un mot de passe : Saisissez un mot de passe ou cliquez sur Générer un mot de passe fort pour en créer un sécurisé.
  3. Sélectionnez l'algorithme : Choisissez Bcrypt (-B) pour une sécurité moderne ou Apache MD5 (-m) pour la compatibilité héritée.
  4. Générez : Cliquez sur Générer l'entrée pour créer la chaîne hachée.
  5. Copiez ou téléchargez : Copiez la ligne résultante dans votre presse-papiers ou téléchargez-la sous forme de fichier à envoyer sur votre serveur.
", - heading3: "Cas d'utilisation courants", - p3: "", - heading4: "Conseils de pro", - p4: "", - }, }, "mock-data-generator": { name: "Générateur de Données Fictives", @@ -1762,16 +1540,6 @@ export default { text1: "Copier", text2: "Aucune ligne à prévisualiser.", }, - edu: { - heading1: "Qu'est-ce que les données simulées ?", - p1: "

Les données simulées sont des informations synthétiques qui imitent les données du monde réel sans contenir d'informations sensibles ou d'identification personnelle (PII). Elles sont essentielles pour les développeurs et les testeurs qui ont besoin de jeux de données réalistes pour construire et valider des applications sans risquer de violations de données ou d'enfreindre des réglementations sur la vie privée comme le RGPD ou la CCPA. En utilisant des données simulées, vous pouvez simuler divers scénarios, des profils d'utilisateurs standard aux cas limites, en veillant à ce que votre logiciel gère tous les types d'entrées avec élégance.

", - heading2: "Stratégies de test", - p2: "

Des tests efficaces nécessitent des jeux de données diversifiés. Utilisez des données simulées pour amorcer vos bases de données de développement, effectuer des tests de charge avec des milliers d'enregistrements ou vérifier les mises en page UI avec des longueurs de chaînes variables. C'est particulièrement utile pour les tests d'intégration où vous avez besoin de réponses prévisibles d'APIs externes. En générant des données localement, vous pouvez créer des environnements de test cohérents faciles à réinitialiser et à reproduire, conduisant à des cycles de développement plus fiables et plus rapides.

", - heading3: "Confidentialité des données dans les simulations", - p3: "

La vie privée est une priorité absolue dans le développement logiciel moderne. L'utilisation de données de production réelles dans des environnements de développement ou de staging est un risque de sécurité majeur. Les générateurs de données simulées résolvent ce problème en produisant des données fausses mais structurellement correctes. Notre outil fonctionne entièrement dans votre navigateur, ce qui signifie que votre configuration et les données générées restent dans votre navigateur et ne sont pas envoyées à nos serveurs. Cette approche Confidentialité d'abord garantit que même le processus de création de données simulées est sécurisé et conforme aux normes de sécurité les plus strictes.

", - heading4: "Conseils de pro", - p4: "", - }, cheatsheet: { title: "Types de champs de données simulées", h0: "Types disponibles", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "Conventions de nommage expliquées (camelCase/snake_case/etc.)", - heading2: "Comment utiliser cet outil", - heading3: "Cas d'utilisation courants", - heading4: "Conseils de pro", - p1: "

Les conventions de nommage sont des ensembles de règles pour choisir la séquence de caractères utilisée pour les identifiants désignant les variables, types, fonctions et autres entités dans le code source et la documentation. camelCase (ex. myVariable) commence par une minuscule et met une majuscule à la première lettre de chaque mot suivant. snake_case (ex. my_variable) utilise des underscores pour séparer les mots.

PascalCase (ex. MyVariable) met une majuscule à la première lettre de chaque mot, tandis que kebab-case (ex. my-variable) utilise des tirets pour séparer les mots. Ces conventions ne sont pas qu'une question d'esthétique ; elles sont essentielles pour la lisibilité du code, sa maintenabilité, et le respect des standards idiomatiques des différents langages de programmation et frameworks.

", - p2: "
  1. Tapez ou collez votre texte dans la zone \"Texte d'entrée\" en haut de la page.
  2. L'outil convertit automatiquement votre saisie en plus d'une douzaine de styles de casse différents en temps réel.
  3. Parcourez la grille \"Résultats de conversion\" pour trouver le style de casse dont vous avez besoin.
  4. Cliquez sur l'icône \"Copier\" à côté de n'importe quel résultat pour l'enregistrer dans votre presse-papiers.
  5. Utilisez le bouton \"Effacer\" pour supprimer toute la saisie et démarrer une nouvelle conversion.
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "Minificateur de Code", @@ -1913,16 +1671,6 @@ export default { text2: "📋 Copier", tpl3: "Tout le traitement s'effectue dans votre navigateur. Votre code est traité localement et n'est jamais envoyé à nos serveurs.", }, - edu: { - heading1: "Qu'est-ce que la minification ?", - heading2: "Comment utiliser cet outil", - heading3: "Cas d'utilisation courants", - heading4: "Conseils de pro", - p1: "

La minification consiste à supprimer tous les caractères inutiles du code source sans en changer le fonctionnement. Cela inclut la suppression des espaces, des sauts de ligne, des commentaires, et parfois le raccourcissement des noms de variables. L'objectif est de réduire la taille du fichier de code, ce qui réduit à son tour la quantité de données à transférer sur le réseau.

Cela conduit à des temps de chargement de page plus rapides et à de meilleures performances pour les applications web. Bien que la minification soit essentielle pour les environnements de production, elle rend le code presque impossible à lire et à déboguer pour un humain. Elle est donc généralement effectuée comme étape finale du processus de build avant le déploiement sur un serveur de production.

", - p2: "
  1. Sélectionnez le langage de programmation (JavaScript, CSS, HTML ou JSON) dans les onglets en haut.
  2. Collez votre code source dans la zone de texte \"Code d'entrée\" à gauche.
  3. Cliquez sur le bouton \"Minifier le code\" pour réduire la taille du fichier pour un usage en production.
  4. Vous pouvez aussi cliquer sur \"Embellir le code\" pour ajouter indentation et formatage afin d'améliorer la lisibilité.
  5. Consultez les résultats dans la zone \"Code de sortie\" et cliquez sur \"Copier\" ou \"Télécharger\" pour enregistrer votre code optimisé.
", - p3: "", - p4: "", - }, }, "image-converter": { name: "Convertisseur d'Images", @@ -1969,16 +1717,6 @@ export default { alert2: "Erreur de lecture du fichier.", tpl3: "Traitement côté client via l'API Canvas — aucun envoi, résultats instantanés", }, - edu: { - heading1: "Comparaison des formats d'image (PNG/JPEG/WebP)", - p1: "

Choisir le bon format d'image est essentiel pour la performance web et la qualité visuelle. JPEG convient le mieux aux photographies et aux images complexes avec de nombreuses couleurs, car il utilise une compression avec perte pour obtenir des fichiers légers. PNG est idéal pour les images nécessitant de la transparence ou ayant des contours nets et des couleurs unies (comme les logos et icônes), car il utilise une compression sans perte.

WebP est un format moderne offrant une compression supérieure, avec ou sans perte, produisant souvent des fichiers nettement plus légers que JPEG ou PNG tout en conservant une haute qualité.

", - heading2: "Comment utiliser cet outil", - p2: "
  1. Téléversez votre image en la déposant dans la zone Téléverser une image ou en cliquant pour parcourir vos fichiers.
  2. Sélectionnez le format de sortie souhaité (PNG, JPG ou WebP) dans les options Convertir le format.
  3. Si vous avez choisi un format avec perte comme JPG ou WebP, utilisez le curseur de qualité pour équilibrer taille de fichier et fidélité visuelle.
  4. Optionnellement, utilisez les paramètres Redimensionner l'image pour ajuster votre image par pourcentage ou dimensions spécifiques.
  5. Cliquez sur Convertir et redimensionner l'image puis sur Télécharger pour enregistrer votre fichier optimisé.
", - heading3: "Cas d'utilisation courants", - p3: "", - heading4: "Conseils de pro", - p4: "", - }, }, "css-gradient": { name: "Générateur de Dégradés CSS", @@ -2018,16 +1756,6 @@ export default { alert2: "Échec de la copie du CSS dans le presse-papiers", tpl3: "Écrans de chargement et superpositions", }, - edu: { - heading1: "Que sont les dégradés CSS ?", - heading2: "Dégradés linéaires vs radiaux vs coniques", - heading3: "Support navigateur et performance", - heading4: "Conseils de pro pour de meilleurs dégradés", - p1: "

Les dégradés CSS sont une fonctionnalité puissante permettant d'afficher des transitions fluides entre deux couleurs ou plus. Contrairement aux images d'arrière-plan traditionnelles, les dégradés sont générés par le navigateur, ce qui les rend infiniment redimensionnables, moins gourmands en bande passante, et facilement manipulables par le code. Ils sont couramment utilisés pour les arrière-plans, boutons et éléments décoratifs afin d'ajouter de la profondeur et un intérêt visuel aux designs web.

", - p2: "

Il existe trois principaux types de dégradés CSS :

", - p3: "

Les dégradés CSS modernes sont largement pris en charge par tous les principaux navigateurs, dont Chrome, Firefox, Safari et Edge. Comme ils sont rendus mathématiquement par le moteur du navigateur, ils sont extrêmement performants comparés à des images haute résolution. Cependant, pour des dégradés très complexes avec des dizaines de points de couleur, il est toujours conseillé de tester les performances sur des appareils moins puissants. Pour les anciens navigateurs (comme IE9 et antérieurs), il est recommandé de fournir une couleur unie en repli.

", - p4: "", - }, }, "curl-studio": { name: "Studio cURL", @@ -2096,16 +1824,6 @@ export default { text2: "Copié !", tpl3: "Les logs apparaîtront ici après le masquage...", }, - edu: { - heading1: "Qu'est-ce que les PII ?", - p1: "

Les informations personnellement identifiables (PII) sont toute donnée pouvant être utilisée pour identifier un individu spécifique. Cela inclut les identifiants directs comme les noms, adresses e-mail et numéros de téléphone, ainsi que les identifiants indirects comme les adresses IP, les localisations physiques et les numéros de carte bancaire. Dans le contexte des logs serveur, les PII apparaissent souvent dans les paramètres de requête, les en-têtes ou les messages d'erreur.

Protéger les PII est un aspect essentiel de la sécurité des données moderne et est exigé par divers cadres juridiques à travers le monde.

", - heading2: "Exigences de conformité (RGPD/CCPA)", - p2: "

Des réglementations comme le Règlement Général sur la Protection des Données (RGPD) en Europe et le California Consumer Privacy Act (CCPA) aux États-Unis imposent des règles strictes sur le traitement des données personnelles. Ces lois exigent des organisations qu'elles mettent en œuvre le privacy by design et qu'elles minimisent la collecte et le stockage des données personnelles.

Partager des logs bruts contenant des PII avec des équipes de support tierces ou des développeurs peut entraîner des violations de conformité. Masquer ou rédiger ces données avant qu'elles ne quittent votre environnement sécurisé est une étape clé pour maintenir la conformité réglementaire.

", - heading3: "Stratégies de masquage", - p3: "

Il existe plusieurs façons de gérer les données sensibles dans les logs :

Notre outil se concentre sur la rédaction, en utilisant la correspondance de motifs pour trouver et remplacer instantanément les formats de PII courants.

", - heading4: "Conseils de pro", - p4: "", - }, }, "mermaid-studio": { name: "Studio Mermaid", @@ -2306,16 +2024,6 @@ export default { text51: "Aucune URL extraite pour le moment.", text52: "Aucune donnée de routage pour le moment.", }, - edu: { - heading1: "Authentification des e-mails expliquée", - heading2: "SPF/DKIM/DMARC", - heading3: "Détection de phishing", - heading4: "Conseils de pro", - p1: "

L'authentification des e-mails regroupe un ensemble de techniques permettant de fournir des informations vérifiables sur l'origine d'un message. En validant l'identité de l'expéditeur, ces protocoles aident les serveurs de messagerie à distinguer les messages légitimes des messages usurpés ou frauduleux (comme le phishing). Les trois piliers de l'authentification moderne des e-mails sont SPF, DKIM et DMARC.

Lorsqu'un e-mail est reçu, le serveur destinataire effectue ces vérifications et enregistre les résultats dans les en-têtes de l'e-mail, que cet outil analyse pour vous.

", - p2: "", - p3: "

Les e-mails de phishing utilisent souvent l'\"usurpation\" pour sembler provenir d'une source fiable. Notre analyseur recherche les signaux d'alerte courants, comme une incohérence entre l'adresse \"From\" (ce que voit l'utilisateur) et le \"Return-Path\" (d'où vient réellement le courrier). Nous extrayons et analysons également les URL dans le corps de l'e-mail pour identifier les liens suspects, comme ceux utilisant le Punycode (domaines similaires trompeurs) ou des adresses IP au lieu de noms d'hôte.

En consultant la section \"Résultats\", vous pouvez rapidement identifier ces signaux et déterminer si un e-mail est sûr.

", - p4: "", - }, cheatsheet: { title: "Référence rapide de l'authentification e-mail", h0: "Signification de ces vérifications", @@ -2491,16 +2199,6 @@ export default { text9: "Collez d'abord du SQL.", text10: "✓ Copié", }, - edu: { - heading1: "Pourquoi formater le SQL ?", - p1: "Le SQL peut rapidement devenir complexe et difficile à lire, en particulier avec de multiples jointures, sous-requêtes et conditions imbriquées. Formater le SQL consiste à ajouter une indentation cohérente, des sauts de ligne et une capitalisation des mots-clés. Cela rend la logique de la requête beaucoup plus facile à suivre, ce qui est essentiel pour le débogage, les revues de code et la maintenance de grands schémas de base de données au fil du temps. Une requête bien formatée est également moins sujette aux erreurs logiques lors des modifications manuelles.", - heading2: "Comment utiliser cet outil", - p2: "Collez votre requête SQL brute dans l'éditeur SQL d'entrée à gauche. Sélectionnez votre dialecte de base de données (Postgres ou MySQL) et la casse de mots-clés préférée (MAJUSCULES ou minuscules). Cliquez sur le bouton Formater pour embellir votre requête avec une indentation et un espacement appropriés. Utilisez le bouton Valider pour vérifier les problèmes structurels courants comme des guillemets non fermés ou des parenthèses déséquilibrées. Cliquez sur Copier pour enregistrer le SQL formaté dans votre presse-papiers ou sur Effacer pour recommencer.", - heading3: "Cas d'utilisation courants", - p3: "Revues de code pour formater du SQL désordonné avant de soumettre une pull request. Débogage pour nettoyer les requêtes générées par les ORM afin de comprendre exactement ce qui est exécuté sur votre base de données. Documentation pour créer des exemples clairs et lisibles pour des guides techniques, wikis ou fichiers README. Nettoyage de code hérité pour refactoriser rapidement d'anciens scripts non formatés dans un style moderne et lisible.", - heading4: "Conseils de pro", - p4: "Utilisez des Common Table Expressions (CTE) avec la clause WITH pour décomposer des requêtes complexes en parties plus petites et gérables. Utilisez toujours des alias descriptifs pour les tables et colonnes afin de rendre l'intention de votre requête claire. Utilisez le bouton Minifier si vous devez compresser votre SQL sur une seule ligne pour l'utiliser dans des fichiers de configuration ou des outils en ligne de commande.", - }, cheatsheet: { title: "Astuces de formatage SQL", h0: "Gains rapides", @@ -2569,16 +2267,6 @@ export default { text15: "Remarque : Les valeurs sont masquées par sécurité. Le diff est heuristique et n'inclut pas les commentaires/l'ordre.", text16: "✓ Copié", }, - edu: { - heading1: "Bonnes pratiques pour les variables d'environnement", - heading2: "Gestion des secrets", - heading3: "Sécurité des fichiers .env", - heading4: "Conseils de pro", - p1: "

Les variables d'environnement sont un élément fondamental de la méthodologie \"Twelve-Factor App\", qui prône une séparation stricte de la configuration et du code. En utilisant des variables d'environnement, vous pouvez exécuter le même code dans différents environnements (développement, préproduction, production) simplement en changeant les valeurs de configuration.

Les bonnes pratiques incluent l'utilisation de noms descriptifs en majuscules (ex. DATABASE_URL), la fourniture de valeurs par défaut pour les paramètres non critiques, et de ne jamais coder en dur d'informations sensibles directement dans votre contrôle de version.

", - p2: "

Les secrets sont une catégorie spéciale de variables d'environnement contenant des informations sensibles comme des clés API, des mots de passe de base de données et des certificats privés. Les gérer de manière sécurisée est essentiel pour prévenir les violations de données. Vous devriez utiliser un service dédié de gestion des secrets (comme AWS Secrets Manager, HashiCorp Vault ou Cloudflare Secrets) pour les environnements de production.

Pour le développement local, les fichiers .env sont couramment utilisés, mais ils ne doivent jamais être commités dans votre dépôt git. Ajoutez toujours *.env à votre fichier .gitignore.

", - p3: "

Lors du partage de fichiers .env avec des coéquipiers pour le débogage, il existe un risque élevé d'exposer accidentellement des secrets de production. Notre outil aide à atténuer ce risque grâce à la fonctionnalité \"Masquer les valeurs sensibles\". Il utilise des heuristiques pour identifier des clés comme SECRET, TOKEN ou PASSWORD et remplace leurs valeurs par une version masquée (ex. ab...yz (32)).

Cela vous permet de comparer la structure et les valeurs non sensibles de vos fichiers d'environnement sans divulguer les secrets réels.

", - p4: "", - }, cheatsheet: { title: "Notes Dotenv", h0: "Stratégie de masquage", @@ -2638,16 +2326,6 @@ export default { text7: "Aucun aperçu pour le moment.", text8: "✓ Copié", }, - edu: { - heading1: "Qu'est-ce que le SVG ?", - p1: "Le SVG (Scalable Vector Graphics) est un format d'image vectorielle basé sur XML pour les graphiques bidimensionnels, avec prise en charge de l'interactivité et de l'animation. Contrairement aux formats matriciels comme JPEG ou PNG, les SVG sont définis par des chemins mathématiques, ce qui leur permet d'être mis à l'échelle sans perte de qualité. Cela les rend parfaits pour les logos, icônes et illustrations sur le web, où ils restent nets sur tous les supports, des écrans mobiles aux moniteurs de bureau haute résolution.", - heading2: "Comment utiliser cet outil", - p2: "Collez votre code SVG dans la zone de texte SVG d'entrée à gauche. Cliquez sur Aperçu pour voir le graphique et extraire sa palette de couleurs. Utilisez les boutons Optimiser ou Minifier pour nettoyer le balisage et réduire la taille du fichier. Optionnellement, remplacez des couleurs spécifiques en saisissant de nouvelles valeurs dans le panneau Couleurs puis en cliquant sur Appliquer. Cliquez sur Copier ou Télécharger pour enregistrer votre SVG assaini et optimisé.", - heading3: "Cas d'utilisation courants", - p3: "Gestion d'icônes pour nettoyer les SVG exportés depuis des outils de design comme Figma ou Illustrator. Thématisation pour changer rapidement les couleurs d'un ensemble d'icônes afin de correspondre à votre palette de marque. Sécurité pour assainir les SVG provenant de sources non fiables afin de supprimer d'éventuels scripts ou références externes. Performance pour minifier le balisage SVG afin de réduire la taille des graphiques en ligne et améliorer les temps de chargement des pages.", - heading4: "Conseils de pro", - p4: "Utilisez le bouton currentColor pour convertir tous les fill et stroke explicites en currentColor, rendant votre SVG facilement stylable via CSS. Optimisez toujours vos SVG avant de les utiliser en production pour garantir qu'ils sont aussi légers que possible. Lors de la création de SVG dans des outils de design, utilisez les fonctions Vectoriser le contour et Simplifier le tracé pour réduire la complexité du code généré avant l'optimisation.", - }, cheatsheet: { title: "Notes de sécurité SVG", h0: "Assainissement", @@ -2801,16 +2479,6 @@ export default { text28: "Cliquez sur Scanner pour trouver des secrets.", text29: "✓ Copié", }, - edu: { - heading1: "Que sont les fuites de secrets ?", - p1: "Les fuites de secrets se produisent lorsque des informations sensibles comme des clés API, mots de passe ou jetons privés sont accidentellement commitées dans un contrôle de version ou partagées sur des forums publics. Ces fuites peuvent entraîner des accès non autorisés, des violations de données et des pertes financières. Cet outil aide à identifier les motifs de secrets courants localement dans votre navigateur avant de partager ou committer votre code.", - heading2: "Comment utiliser cet outil", - p2: "Collez votre code, configuration ou fichiers de logs dans la zone de saisie. Cliquez sur le bouton Scanner pour analyser le texte à la recherche de secrets potentiels. Consultez les résultats et conseils pour chaque élément détecté. Utilisez le bouton Copier la version masquée pour obtenir une version sécurisée de votre texte avec les secrets masqués.", - heading3: "Cas d'utilisation courants", - p3: "Vérifications pre-commit pour scanner votre code avant de committer afin de vous assurer qu'aucun secret n'est inclus. Masquage de logs pour masquer les jetons sensibles dans les logs avant de les partager avec le support ou des coéquipiers. Audit de sécurité pour auditer rapidement les fichiers de configuration à la recherche d'identifiants codés en dur.", - heading4: "Conseils de pro", - p4: "Renouvelez toujours vos identifiants immédiatement si vous découvrez qu'ils ont fuité. Utilisez des variables d'environnement ou des gestionnaires de secrets plutôt que de coder en dur des secrets dans votre code source. Activez Inclure les motifs de faible sévérité pour un scan plus approfondi, mais attendez-vous à davantage de faux positifs.", - }, cheatsheet: { title: "Que faire si vous trouvez un secret", h0: "Étapes immédiates", @@ -2907,16 +2575,6 @@ export default { text15: "✓ Structure JWKS valide (", text16: "Veuillez coller une JWK.", }, - edu: { - heading1: "Qu'est-ce qu'un JWT ?", - p1: "Un JSON Web Token (JWT) est un moyen compact et compatible avec les URL de représenter des claims à transférer entre deux parties. Un JWT se compose de trois parties encodées en Base64URL séparées par des points : le Header (algorithme et type), le Payload (claims), et la Signature. La signature garantit que le jeton n'a pas été altéré. Les JWT sont couramment utilisés pour l'authentification et l'échange d'informations dans les API web. Les claims standards incluent sub (sujet), iss (émetteur), aud (audience), exp (expiration), nbf (pas avant), iat (émis le), et jti (ID JWT).", - heading2: "Algorithmes JWT", - p2: "HS256/384/512 utilise HMAC avec SHA-2 et un secret partagé — simple, mais les deux parties doivent détenir la même clé. RS256/384/512 utilise des signatures asymétriques RSA PKCS#1 v1.5 — idéal pour les architectures de microservices où les services n'ont besoin que de la clé publique. ES256/384/512 utilise ECDSA avec des courbes NIST pour des signatures plus petites que RSA à sécurité équivalente. PS256/384/512 utilise RSA-PSS, une variante probabiliste préférée à RS* dans les systèmes modernes.", - heading3: "JWK et JWKS", - p3: "Une JSON Web Key (JWK) est une structure JSON représentant une clé cryptographique. Un JWK Set (JWKS) est une structure JSON contenant un tableau de JWK sous la propriété keys. Les services publient leur JWKS à une URL bien connue (ex. /.well-known/jwks.json), permettant aux clients de récupérer les clés publiques pour la vérification JWT sans échange de clés hors bande. Les clés d'un JWKS sont identifiées par leur kid (Key ID), auquel les headers JWT font référence.", - heading4: "Bonnes pratiques de sécurité", - p4: "Validez toujours les claims exp, nbf, iss et aud côté serveur. N'utilisez jamais l'algorithme alg: none en production — il supprime toute protection par signature. Préférez les algorithmes asymétriques (RS*, ES*, PS*) à HMAC lorsque plusieurs services doivent vérifier des jetons. Renouvelez régulièrement les clés et utilisez kid pour identifier quelle clé a signé chaque jeton. Stockez les clés privées de manière sécurisée — ne les commitez jamais dans un contrôle de version. Utilisez des durées d'expiration courtes et des jetons de rafraîchissement plutôt que des JWT à longue durée de vie.", - }, }, "encoding-workbench": { name: "Atelier d'Encodage", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "Aucune couche d'encodage reconnaissable détectée.", }, - edu: { - heading1: "Encodage vs hachage : quelle différence ?", - heading2: "Comment utiliser cet outil", - heading3: "L'encodage en couches expliqué", - heading4: "Guide des algorithmes de hash", - p1: "

L'encodage transforme les données en une représentation différente qui peut être inversée (décodée). Les formats courants incluent le Base64 — utilisé pour transmettre des données binaires sur des canaux texte — l'encodage URL, l'encodage d'entités HTML et l'hexadécimal. L'encodage n'est pas du chiffrement ; il n'offre aucune confidentialité.

Le hachage est une transformation mathématique à sens unique. Une fonction de hachage cryptographique prend n'importe quelle entrée et produit une empreinte de longueur fixe. Vous ne pouvez pas inverser un hash pour récupérer l'entrée d'origine. Les hashs sont utilisés pour vérifier l'intégrité des fichiers, stocker les mots de passe en toute sécurité, et générer des signatures numériques.

", - p2: "
  1. Onglet Encoder / Décoder : Collez du texte et choisissez une opération (Base64, URL, HTML, Hex), ou cliquez sur Détection automatique des couches pour dénicher automatiquement plusieurs encodages imbriqués.
  2. Onglet Hash : Saisissez du texte ou sélectionnez un fichier, choisissez des algorithmes, et cliquez sur Tout hacher. Activez le mode HMAC pour calculer des hashs à clé avec un secret partagé.
  3. Onglet Identifier : Collez un hash ou une chaîne encodée inconnue et cliquez sur Identifier pour voir les algorithmes probables avec des taux de confiance.
", - p3: "

Les données réelles sont souvent encodées plusieurs fois. Par exemple, un payload pourrait être encodé en URL, puis en Base64, puis placé dans une chaîne hexadécimale. La fonctionnalité Détection automatique des couches inspecte le motif de l'entrée, tente chaque décodage en séquence, et visualise chaque étape sous forme de carte afin que vous puissiez voir exactement comment les données ont été enveloppées.

", - p4: "", - }, }, "oauth-debugger": { name: "Débogueur OAuth", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "Qu'est-ce que PKCE et pourquoi est-ce important ?", - p1: "

Proof Key for Code Exchange (PKCE, RFC 7636) a été conçu à l'origine pour les applications mobiles et natives qui ne peuvent pas stocker un client secret de manière sécurisée. Il fonctionne en faisant générer par le client un code_verifier aléatoire, en en dérivant un code_challenge (SHA-256 + base64url), et en envoyant le challenge avec la requête d'autorisation. Lors de l'échange du code d'autorisation contre des jetons, le client envoie le code_verifier d'origine. Le serveur d'autorisation vérifie qu'il correspond au challenge précédent — prouvant que la requête de jeton provient du même client qui a démarré le flux.

Même pour les clients confidentiels (applications côté serveur avec un client secret), PKCE est désormais recommandé par OAuth 2.1 comme défense contre les attaques d'interception de code d'autorisation.

", - heading2: "Pourquoi le flux implicite est-il déprécié ?", - p2: "

Le flux implicite (response_type=token) a été conçu comme raccourci pour les applications monopages, retournant le jeton d'accès directement dans le fragment d'URL. Cela crée de sérieux problèmes : les jetons dans les URL apparaissent dans l'historique du navigateur, les logs serveur et les en-têtes referrer, et le flux est vulnérable aux attaques par injection de jeton. OAuth 2.0 Security Best Current Practice (RFC 9700) et OAuth 2.1 suppriment explicitement le flux implicite au profit de Authorization Code + PKCE, que les SPA peuvent utiliser en toute sécurité sans client secret.

", - heading3: "Principaux changements d'OAuth 2.1", - p3: "", - heading4: "Le flux Authorization Code étape par étape", - p4: "
  1. Générer la paire PKCE : Créez un code_verifier aléatoire et calculez code_challenge = BASE64URL(SHA256(code_verifier)).
  2. Rediriger vers l'endpoint d'autorisation : Incluez response_type=code, client_id, redirect_uri, scope, state, code_challenge, et code_challenge_method=S256.
  3. L'utilisateur s'authentifie auprès du serveur d'autorisation et accorde son consentement.
  4. Recevez le code d'autorisation à votre redirect_uri accompagné du state renvoyé — vérifiez que state correspond à celui envoyé.
  5. Échangez le code contre des jetons : POST vers l'endpoint de jeton avec grant_type=authorization_code, code, redirect_uri, client_id, et code_verifier.
  6. Recevez le jeton d'accès (et optionnellement id_token et refresh_token) et utilisez-les pour appeler des API.
", - }, }, "ladder-game": { name: "Jeu de l'Échelle", diff --git a/src/i18n/ja.js b/src/i18n/ja.js index ef58382..8668882 100644 --- a/src/i18n/ja.js +++ b/src/i18n/ja.js @@ -90,16 +90,6 @@ export default { text7: "✓ コピー済み", tpl8: "最大深度", }, - edu: { - heading1: "JSONとは何ですか?", - p1: "

JSON(JavaScript Object Notation)は、人間が読み書きしやすく、機械が解析・生成しやすい軽量なデータ交換フォーマットです。JavaScriptプログラミング言語標準のサブセットに基づいています。JSONは完全に言語に依存しないテキストフォーマットですが、C系言語のプログラマーに親しみやすい規則を使用しています。

これらの特性により、JSONはWebアプリケーション、API、設定ファイルに理想的なデータ交換言語となっています。より小さなフットプリントと優れたパフォーマンスにより、Web上のデータ交換の事実上の標準となり、XMLを大きく置き換えました。

", - heading2: "このツールの使い方", - p2: "
  1. 左側のJSON入力エディターに生のまたは整形されていないJSONデータを貼り付けます。
  2. フォーマットボタンをクリックして、適切なインデントとシンタックスハイライトでコードを整形します。
  3. または、ミニファイボタンを使用して本番環境用にすべての空白を削除します。
  4. ステータスインジケーターを確認してJSONが有効かどうかを確認します;エラーがある場合、ツールは正確な行をハイライトします。
  5. コピーをクリックして整形された結果をクリップボードに保存するか、クリアをクリックして最初からやり直します。
", - heading3: "一般的なユースケース", - p3: "", - heading4: "プロのヒント", - p4: "", - }, }, "jwt-decoder": { name: "JWTインスペクター", @@ -139,22 +129,6 @@ export default { status5: "アルゴリズム: ", status6: "デコードに失敗しました", }, - edu: { - heading1: "JWTとは何ですか?", - p1: "

JSON Web Token(JWT)は、当事者間で情報をJSONオブジェクトとして安全に伝送するための、コンパクトで自己完結型の方法を定義するオープンスタンダード(RFC 7519)です。この情報はデジタル署名されているため、検証・信頼できます。JWTはシークレット(HMACアルゴリズムを使用)または公開鍵/秘密鍵ペア(RSAまたはECDSAを使用)で署名できます。

コンパクトなサイズのため、JWTはHTTP AuthorizationヘッダーのBearerトークンなど、認証や情報交換のシナリオでよく使用されます。

", - heading2: "このツールの使い方", - p2: "
  1. トークンを貼り付ける:エンコードされたJWT(header.payload.signature)をコピーして、入力欄に貼り付けます。
  2. 自動デコード:ツールが自動的にトークンを検出し、リアルタイムで各部分をデコードします。
  3. ヘッダーを確認:ヘッダーセクションでアルゴリズム(alg)とトークンタイプ(typ)を確認します。
  4. ペイロードを分析:ペイロードセクションで有効期限(exp)、発行者(iss)、サブジェクト(sub)などのクレームを確認します。
  5. クレームを検証:クレーム分析ボックスで人間が読める形式の日時と検証ステータスを確認します。
", - heading3: "一般的なユースケース", - p3: "", - heading4: "プロのヒント", - p4: "", - heading5: "トークンの構造(header.payload.signature)", - p5: "

JWTは通常、ドットで区切られた3つの部分から構成されます:

", - heading6: "セキュリティ上の考慮事項", - p6: "

JWTは完全性を保証するために署名されていますが、通常は暗号化されていません。つまり、トークンを持っている人は誰でもヘッダーとペイロードをデコードして中の情報を読むことができます。パスワードや秘密鍵などの機密情報をJWTペイロードに保存しないでください。

また、リプレイ攻撃を防ぐためにexp(有効期限)クレームを必ず検証し、ペイロードのデータを信頼する前にサーバーが署名を検証するようにしてください。

", - heading7: "プロのヒント", - p7: "", - }, cheatsheet: { title: "JWTクイックリファレンス", h0: "構造", @@ -193,16 +167,6 @@ export default { text0: "✓ コピー済み!", tpl1: "GUID:", }, - edu: { - heading1: "UUIDとは何ですか?", - p1: "汎用一意識別子(UUID)は、コンピュータシステム内の情報を一意に識別するために使用される128ビットの数値です。中央機関を介さずに独立して生成できるように設計されており、衝突する確率は無視できるほど小さくなっています。", - heading2: "このツールの使い方", - p2: "UUIDバージョン(時間ベースのv1、ランダムなv4)と必要なID数を選択します。生成をクリックすると、データベースやアプリケーションですぐに使用できる一意の識別子のリストが作成されます。", - heading3: "一般的なユースケース", - p3: "分散データベースの主キー、セッション識別子、トランザクション追跡、複数のシステムにまたがって一意性が重要となる一時ファイルやリソースの命名などに使用されます。", - heading4: "プロのヒント", - p4: "UUID v4は高品質な乱数に基づいているため、汎用的な一意IDとして最も一般的に選択されます。作成時刻でIDをソートする必要がある場合はv1を使用してください。", - }, }, "password-generator": { name: "パスワード生成ツール", @@ -265,24 +229,6 @@ export default { status6: "弱い", text1: "有効なベースメールアドレスを入力してください。", }, - edu: { - heading1: "強力なパスワードとは?", - p1: "

強力なパスワードは、不正アクセスに対する最初の防御線です。高速コンピューティングの現代において、「安全」はエントロピーによって定義されます — 文字列のランダム性と予測不可能性の尺度です。強力なパスワードは長く(少なくとも16文字)、すべてのアカウントで一意であり、大文字、小文字、数字、記号を含む多様な文字タイプで構成されている必要があります。

誕生日、ペットの名前、一般的な辞書の単語などの個人情報の使用は避けてください。P@ssw0rd123のような複雑に見える置き換えも、一般的なパターンの膨大な辞書を使用する現代のブルートフォースツールによって簡単に解析されます。

", - heading2: "このツールの使い方", - p2: "
  1. モードを選択:ニーズに応じて、パスワード、ユーザー名、パスフレーズ、またはメールエイリアスを選択します。
  2. 長さを調整:スライダーを使用して希望の長さを設定します。パスワードの場合、高いセキュリティのために16文字以上が推奨されます。
  3. オプションを設定:文字セット(記号、数字など)またはスタイル(読みやすい vs. セキュア)を切り替えます。
  4. 生成:生成ボタンをクリックして一意の認証情報を作成します。
  5. コピー:コピーアイコンを使用して結果をクリップボードまたはパスワードマネージャーに安全に移動します。
", - heading3: "一般的なユースケース", - p3: "", - heading4: "プロのヒント", - p4: "", - heading5: "強力なパスワードとは?", - p5: "

強力なパスワードは、不正アクセスに対する最初の防御線です。高速コンピューティングの現代において、「安全」はエントロピーによって定義されます — 文字列のランダム性と予測不可能性の尺度です。強力なパスワードは長く(少なくとも16文字)、すべてのアカウントで一意であり、大文字、小文字、数字、記号を含む多様な文字タイプで構成されている必要があります。

誕生日、ペットの名前、一般的な辞書の単語などの個人情報の使用は避けてください。P@ssw0rd123のような複雑に見える置き換えも、一般的なパターンの膨大な辞書を使用する現代のブルートフォースツールによって簡単に解析されます。

", - heading6: "エントロピーの説明", - p6: "

エントロピーはパスワードのランダム性と予測不可能性の尺度で、通常ビットで表されます。エントロピーが高いほど、パスワードは強力です。例えば、小文字のみを使用する10文字のパスワードは、英数字と特殊文字を完全に使用する10文字のパスワードよりもエントロピーがはるかに低くなります。

ジェネレーターはリアルタイムでエントロピーを計算し、パスワード強度の客観的な測定値を提供します。100ビット以上のエントロピーを持つパスワードは、現代の解析技術に対して非常に強力と見なされます。

", - heading7: "ベストプラクティス", - p7: "", - heading8: "プロのヒント", - p8: "", - }, }, "hash-calculator": { name: "ハッシュ計算ツール", @@ -350,16 +296,6 @@ export default { tpl4: "入力待ち...", text2: "計算結果: ", }, - edu: { - heading1: "ハッシュ化とは何ですか?", - p1: "

暗号学的ハッシュ化とは、任意の入力データ(テキストやファイル)を固定長の文字列(通常は16進数)に変換する数学的プロセスです。このフィンガープリントは入力に対して一意であり、元データのたった1ビットの変化でもまったく異なるハッシュ値になります。この現象は雪崩効果として知られています。

暗号化とは異なり、ハッシュ化は一方向関数です。ハッシュから元のデータを復元することはできません。このため、データの整合性検証、(ソルトと組み合わせた)パスワードの安全な保存、内容を公開せずにファイルを識別する用途に最適です。

", - heading2: "このツールの使い方", - p2: "
  1. 入力タイプを選択:文字列の場合はテキストタブ、ローカルファイルの場合はファイルタブを選択します。
  2. 入力を提供:テキストを貼り付けるか、ファイルをワークスペースにドラッグ&ドロップします。
  3. HMAC(任意):認証用のキー付きハッシュを生成する必要がある場合は、HMACフィールドにシークレットキーを入力します。
  4. 結果を確認:ツールが複数のハッシュバリアント(SHA-256、SHA-512など)をリアルタイムで自動計算します。
  5. 整合性を検証:検証タブを使用して、既知のハッシュと入力を比較し、改ざんがないか確認します。
", - heading3: "一般的なユースケース", - p3: "", - heading4: "プロのヒント", - p4: "", - }, cheatsheet: { title: "ハッシュアルゴリズムリファレンス", h0: "アルゴリズム比較", @@ -435,16 +371,6 @@ export default { text5: "最低でも /", text6: "IPv6 /", }, - edu: { - heading1: "CIDRとは何ですか?", - heading2: "このツールの使い方", - heading3: "一般的なユースケース", - heading4: "プロのヒント", - p1: "クラスレスドメイン間ルーティング(CIDR)は、IPアドレスとIPルーティングを割り当てる方法です。アドレス配布においてより柔軟性と効率性を提供するために、クラス(A、B、C)に基づく古いシステムを置き換えました。", - p2: "IPアドレスにプレフィックスを付けて入力するか(例:192.168.1.0/24)、スライダーを使用してプレフィックス長を調整します。「分析実行」をクリックして、ネットワークの詳細、使用可能なホスト範囲、バイナリ表現を確認します。", - p3: "クラウドインフラ(VPC)のネットワークサブネット計画、ルーティング問題のトラブルシューティング、特定のプレフィックスのホスト容量の計算、CIDRとサブネットマスク間の変換。", - p4: "IPv4では、サブネットの最初と最後のアドレスは通常、ネットワークIDとブロードキャストアドレス用に予約されています。IPv6では、標準ローカルネットワークのサブネットはほぼ常に/64です。", - }, cheatsheet: { title: "サブネットクイックリファレンス", h0: "一般的なサブネット", @@ -619,16 +545,6 @@ export default { tpl3: "デフォルトを変更:", tpl4: "検索条件に一致するポートが見つかりません。", }, - edu: { - heading1: "ポートカテゴリとセキュリティガイド", - p1: "ウェルノウンポート(0〜1023)はIANAによって割り当てられ、Unixシステムではroot権限が必要です。登録済みポート(1024〜49151)はアプリケーションで使用されます。動的/一時ポート(49152〜65535)はクライアント側の接続に使用されます。ポート範囲を理解することは、ファイアウォール設定とネットワークセキュリティにとって不可欠です。", - heading2: "このツールの使い方", - p2: "ポート番号またはサービス名で検索して、プロトコルの詳細やセキュリティリスクレベルを確認します。カテゴリ(ウェルノウン、登録済み、動的)またはプロトコル(TCP/UDP)でフィルタリングして結果を絞り込みます。任意の行をクリックすると、一般的な脆弱性や強化の推奨事項を含む詳細を確認できます。", - heading3: "一般的なユースケース", - p3: "ファイアウォールルールの設定、ネットワークのトラブルシューティング、セキュリティ監査での予期しない開放ポートの特定、プロトコルのポート割り当てのクイックリファレンスとして使用します。", - heading4: "プロのヒント", - p4: "リスクフィルターを使用して、ネットワーク内のリスクの高いポートを素早く特定できます。「よく使われるポートトップ50」セクションでは、最も頻繁に使用されるサービスを一目で確認できます。", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
ポートサービスリスク
21FTP暗号化されないファイル転送
23Telnet平文による認証
25SMTPメールスパム中継のリスク
53DNSDDoS 増幅攻撃
445SMBランサムウェアの拡散
3389RDPブルートフォース攻撃
", @@ -872,16 +788,6 @@ export default { text4: "警告", alert0: "先に設定を生成してください", }, - edu: { - heading1: "WireGuardについて", - p1: "WireGuardは、最新の暗号技術を使用した高性能なVPNプロトコルです。OpenVPNやIPsecなどの旧来のプロトコルよりもシンプルかつ高速に設計されており、コードベースが最小限であるため攻撃対象領域も大幅に小さくなっています。WireGuardは現在Linuxカーネルの一部となっており、Windows、macOS、iOS、Androidでネイティブにサポートされています。", - heading2: "このツールの使い方", - p2: "トポロジーテンプレート(ポイントツーポイント、ハブアンドスポーク、サイト間、ロードウォリアー)を選択すると、設定が事前入力されます。鍵を生成をクリックすると、ブラウザ内でローカルに新しい鍵ペアが作成されます。必須項目を入力して設定を生成をクリックすると、WireGuardの設定ファイルが作成されます。.confをダウンロードでファイルを保存するか、QRコードを生成でモバイルインポート用のQRコードを作成します。", - heading3: "一般的なユースケース", - p3: "社員が社内ネットワークに接続するためのリモートアクセスVPN。支社間のネットワークを接続するサイト間VPN。公共Wi-Fiでの安全なブラウジングのための個人用VPNサーバー。組み込みデバイス間の安全な通信のためのIoTデバイストンネリング。", - heading4: "プロのヒント", - p4: "NAT配下のクライアントでは、トラフィックが流れていないときにトンネルを維持するために PersistentKeepalive = 25 を使用してください。PresharedKeyは耐量子性のために対称暗号化の層を追加します。AllowedIPs = 0.0.0.0/0 はすべてのトラフィックをトンネル経由でルーティングします(フルトンネル)。特定のCIDRを指定するとスプリットトンネルになります。", - }, cheatsheet: { title: "WireGuardクイックリファレンス", h0: "インターフェースフィールド", @@ -1025,14 +931,6 @@ export default { tpl6: "例:", tpl7: "図中の任意のフィールドをクリックすると詳細が表示されます。", }, - edu: { - heading1: "プロトコルヘッダーとは?", - p1: "プロトコルヘッダーは、ネットワークパケットのペイロードの前に置かれる構造化データです。送信元・宛先アドレス、プロトコルタイプ、シーケンス番号、チェックサムなどの制御情報が含まれます。ヘッダー構造を理解することは、ネットワークのデバッグ、パケット分析、プロトコル実装に不可欠です。", - heading2: "このツールの使い方", - p2: "タブからプロトコルを選択すると、そのヘッダー構造が表示されます。色分けされた各ブロックは、サイズが示されたフィールドを表します。任意のフィールドをクリックすると、フィールド名と説明、ビット/バイトオフセット、一般的な値とその意味、RFC参照など、詳細情報が表示されます。tcpdumpやWiresharkなどのツールから16進出力を貼り付けて、実際のパケットキャプチャを分析するには16進ダンプパーサーを使用してください。", - heading3: "一般的なユースケース", - p3: "キャプチャしたネットワークトラフィックの構造を理解するためのパケット分析、ネットワークプロトコルを学習するための視覚教材としてのプロトコル学習、不正な形式のヘッダーや誤ったフィールド値を特定するためのデバッグ、ネットワークプロトコルを実装する際の開発リファレンスとして使用します。", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
値プロトコル
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
フィールドサイズ説明
Source Port2 バイト送信元ポート番号
Dest Port2 バイト宛先ポート番号
Seq Number4 バイトシーケンス番号
Ack Number4 バイト確認応答番号
Data Offset4 ビットヘッダー長 / 4
Flags9 ビットNS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 バイト受信ウィンドウサイズ
", @@ -1108,16 +1006,6 @@ export default { tpl0: "差分", tpl1: "差分なし(または空の入力)", }, - edu: { - heading1: "テキスト差分とは何ですか?", - p1: "テキスト差分(diff)とは、2つのデータ列を比較して、その違いを特定するプロセスです。追加、削除、変更された箇所をハイライト表示します。これはソフトウェア開発、データ分析、コンテンツ管理における基本的な操作であり、時間の経過による変更の追跡や、文書の異なるバージョンの比較を可能にします。", - heading2: "差分アルゴリズム", - p2: "ほとんどのテキスト差分ツールは、最長共通部分列(LCS)問題に基づくアルゴリズムを使用しています。目標は、両方のテキストに同じ相対順序で現れる要素の最長シーケンスを見つけることです。一般的な実装には、Gitで使用されている非常に効率的なMyers差分アルゴリズムや、Hunt-McIlroyアルゴリズムがあります。これらのアルゴリズムは、あるテキストを別のテキストに変換するために必要な最小限の編集回数を計算します。", - heading3: "ユースケース", - p3: "開発者がプルリクエストで何が変更されたかを正確に把握するためのコードレビュー。スペースを節約するために履歴を一連の差分として保存するGitなどのバージョン管理システム。ライターや編集者が要求されたすべての変更が行われたことを確認するために下書きを比較するコンテンツ監査。設定ファイルやデータベースのエクスポートを比較して相違点を見つけるデータ検証。", - heading4: "プロのヒント", - p4: "多くの差分ツールには、インデントや末尾のスペースの変更を無視するオプションがあり、コードを比較する際のノイズを減らすことができます。変更の影響を理解するために、差分の周囲に変更されていないテキストを数行含めます(コンテキスト行)。単語レベルの差分は文章や自然言語の文書に、行レベルの差分はコードに標準的で、それぞれ有用です。", - }, }, "regex-visualizer": { name: "正規表現ビジュアライザー", @@ -1168,16 +1056,6 @@ export default { tpl5: "グループなし", tpl6: "無効な正規表現", }, - edu: { - heading1: "正規表現とは何ですか?", - p1: "正規表現(regex)は、文字列内の文字の組み合わせをマッチさせるために使用される強力なパターンです。プログラミング言語全般にわたるテキスト処理、検証、データ抽出のための必須ツールです。正規表現パターンは、リテラル文字と検索ルールを定義する特殊なメタ文字で構成されます。フォーム検証、ログ解析、検索置換操作、データクリーニングタスクなどで使用されます。", - heading2: "このツールの使い方", - p2: "入力欄に正規表現パターンを入力します。ツールが自動的にパターン構造を可視化する鉄道図(レールロードダイアグラム)を生成します。テストテキストを追加すると、リアルタイムでマッチのハイライトと説明が表示されます。よく使われるパターンや構文のクイックリファレンスにはチートシートを使用してください。お好みのプログラミング言語用のコードスニペットも生成できます。", - heading3: "一般的なユースケース", - p3: "処理前にユーザー入力が正しいメール形式と一致することを確認するメール検証、サーバーログからタイムスタンプやIPアドレスを抽出するログ解析、不要な文字を削除したり電話番号の形式を統一したりするデータクリーニング、パターンマッチングによる一括テキスト変換のための検索置換に使用されます。", - heading4: "プロのヒント", - p4: "シンプルに始めて、複雑なパターンは段階的に構築しましょう。マッチを参照する必要がない場合は、非キャプチャグループ(?:)を使用してください。空文字列や特殊文字などのエッジケースをテストしてください。正規表現の可読性も考慮しましょう — 複雑なパターンにはコメントでドキュメントを付けることができます。", - }, cheatsheet: { title: "正規表現クイックリファレンス", h0: "文字クラス", @@ -1323,16 +1201,6 @@ export default { text1: "コピー", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "SSH鍵について", - p1: "SSH鍵は、リモートシステムへの安全な認証に使用される暗号鍵のペアです。秘密鍵は自分のマシンに保持し、公開鍵はサーバーに配置します。この非対称的なアプローチはパスワード認証よりもはるかに安全で、サーバーアクセス、Gitホスティング、自動デプロイの業界標準となっています。", - heading2: "このツールの使い方", - p2: "希望する鍵タイプ(RSAまたはECDSA)を選択し、RSAの場合は鍵長も選択します。鍵を識別するための任意のコメント(一般的にはuser@host)を追加できます。生成をクリックすると鍵ペアが作成されます。公開鍵をコピーしてサーバーに追加し、秘密鍵はローカルマシンで安全に保管してください。", - heading3: "一般的なユースケース", - p3: "リモートサーバーへのパスワードレスSSHログインのためのサーバー認証。パスワードなしでGitHub、GitLab、Bitbucketに認証するGitホスティング。サーバーへの接続が必要な自動デプロイスクリプトのためのCI/CDパイプライン。安全な踏み台ホスト構成のためのバスティオンホストアクセス。", - heading4: "プロのヒント", - p4: "新規デプロイにはEd25519鍵が推奨されます — RSAよりも高速で安全です。秘密鍵は必ず強力なパスフレーズで保護してください。セッション中にパスフレーズを繰り返し入力しなくて済むよう、ssh-agentを使用してください。鍵は~/.ssh/に600のパーミッションで保存してください。", - }, cheatsheet: { title: "SSH鍵クイックリファレンス", h0: "鍵タイプ", @@ -1372,16 +1240,6 @@ export default { tpl2: "サブジェクト代替名がありません。", tpl3: "パースされた拡張がありません。", }, - edu: { - heading1: "X.509証明書とは何ですか?", - heading2: "このツールの使い方", - heading3: "一般的なユースケース", - heading4: "プロのヒント", - p1: "

X.509は公開鍵証明書の標準フォーマットで、公開鍵をID(Webサイト、組織、個人など)に安全に結び付けるデジタル文書です。これらの証明書は、HTTPSを通じてインターネットを保護するために使用される公開鍵基盤(PKI)の基盤であり、メールやソフトウェアの署名にも使用されます。

X.509証明書には、公開鍵、証明書所有者のID、そして証明書を発行した認証局(CA)のデジタル署名が含まれており、その真正性を証明します。

", - p2: "
  1. 証明書を貼り付ける:PEM形式の証明書(BEGINとENDのヘッダーを含む)をコピーして入力欄に貼り付けます。
  2. 解析:「証明書を解析」をクリックしてデータを抽出・分析します。
  3. サマリーを確認:上部のカードでコモンネーム(CN)、発行者、有効期限を確認します。
  4. 詳細を確認:下のセクションを展開して、完全なサブジェクト、発行者、SAN、技術的な拡張情報を確認します。
  5. ステータスを確認:ステータスバッジを見て、証明書が現在有効か期限切れかを確認します。
", - p3: "", - p4: "", - }, cheatsheet: { title: "X.509証明書リファレンス", h0: "証明書フィールド", @@ -1424,16 +1282,6 @@ export default { text1: "JSONコピー", text2: "XMLコピー", }, - edu: { - heading1: "SAMLとは何ですか?", - p1: "Security Assertion Markup Language(SAML)は、当事者間、特にIDプロバイダー(IdP)とサービスプロバイダー(SP)の間で認証・認可データを交換するためのXMLベースのオープンスタンダードです。SAMLは多くのエンタープライズシングルサインオン(SSO)ソリューションの基盤であり、ユーザーが1組の認証情報で複数のアプリケーションにアクセスできるようにします。最も一般的なバージョンはSAML 2.0で、アサーションを含むセキュリティトークンを使用して、プリンシパルに関する情報をIdPとSP間でやり取りします。", - heading2: "このツールの使い方", - p2: "Base64エンコードされたSAMLResponseまたは生のXMLを入力欄に貼り付けます。Redirectバインディングのペイロードをデコードする場合は、「インフレートを試行」を切り替えます。「レスポンスをデコード」をクリックしてメッセージを解析します。クイックサマリーで発行者、サブジェクト、有効性ステータスを確認します。属性テーブルでデコードされたユーザー属性を確認できます。タブを使って整形されたXML、アサーション詳細、またはクレームのJSON表現を表示できます。", - heading3: "一般的なユースケース", - p3: "アサーションの期限切れやオーディエンスの不一致を確認して、ユーザーがログインできない理由を診断するSSOトラブルシューティング。IDプロバイダーが正しい属性を送信していることを確認する統合テスト。生のXMLを検査してアサーションが適切に署名されていることを確認するセキュリティ監査。サービスプロバイダー統合中にSAMLメッセージの内容を素早く確認するための開発。", - heading4: "プロのヒント", - p4: "HTTP-Redirectで送信されるSAMLメッセージは、通常Base64エンコードされる前にデフレート(圧縮)されます — デコードに失敗する場合は「インフレートを試行」チェックボックスを切り替えてみてください。AudienceRestrictionがSPのエンティティIDと一致していることを確認してください。レスポンスが無効とマークされた場合は、NotBeforeとNotOnOrAfterの時刻を確認し、IdPとSPのクロック間の時刻ずれがないか確認してください。", - }, cheatsheet: { title: "SAMLクイックリファレンス", h0: "SAMLフロー", @@ -1476,16 +1324,6 @@ export default { alert1: "User-Agent文字列を入力してください", tpl2: "生の分析出力", }, - edu: { - heading1: "User-Agentとは何ですか?", - p1: "User-Agentは、訪問するすべてのWebサイトにブラウザが送信する文字列です。ブラウザのバージョン、オペレーティングシステム、デバイスタイプを識別し、サーバーが特定の環境に合わせてコンテンツを最適化できるようにします。", - heading2: "このツールの使い方", - p2: "入力ボックスにUser-Agent文字列を貼り付けるか、「これを使用」をクリックして現在のブラウザ文字列を分析します。ツールはブラウザエンジン、OSバージョン、デバイスの特性を詳細に分解して表示します。", - heading3: "一般的なユースケース", - p3: "Webサイトの互換性問題のデバッグ、Webサーバーログを分析してボットトラフィックを特定すること、ブラウザのなりすましの検証、オーディエンスのデバイス分布の把握などに使用されます。", - heading4: "プロのヒント", - p4: "多くの最新ブラウザは、フィンガープリンティングを防ぐためにUser-Agent文字列を固定化または簡略化しています。最も正確なバージョン情報を得るには、常にVersionまたはChromeトークンを確認してください。", - }, }, "qr-code": { name: "QRコード生成ツール", @@ -1524,16 +1362,6 @@ export default { alert3: "コピー済み!", tpl4: "デコードする画像をアップロード", }, - edu: { - heading1: "QRコードとは何ですか?", - p1: "QRコード(Quick Response)は、さまざまな種類のデータ(最も一般的にはURL)を格納できる2次元バーコードです。スマートフォンや専用リーダーでスキャンすることで、情報に素早くアクセスしたり、アクションをトリガーしたりできます。", - heading2: "このツールの使い方", - p2: "エンコードしたいテキストまたはURLを入力します。必要に応じてサイズと誤り訂正レベルを調整します。QRコードはリアルタイムで更新され、印刷用またはデジタル用の画像としてダウンロードできます。", - heading3: "一般的なユースケース", - p3: "Webサイトリンクの共有、Wi-Fi認証情報の提供、デジタル名刺(vCard)、イベントチケット、モバイル決済や認証フローなどに使用されます。", - heading4: "プロのヒント", - p4: "高い誤り訂正レベル(HまたはQ)を使用すると、QRコードが一部破損したり隠れたりしてもスキャン可能な状態を保てるため、物理的な看板やブランディングに最適です。", - }, }, "timestamp-converter": { name: "タイムスタンプ変換ツール", @@ -1564,16 +1392,6 @@ export default { text0: "無効なタイムスタンプ", tpl1: "Unix(ミリ秒)", }, - edu: { - heading1: "Unix時間とは何ですか?", - p1: "Unix時間(Epoch時間、POSIX時間、またはUnixタイムスタンプとも呼ばれる)は、ある時点を記述するシステムです。うるう秒を除いたUnix Epochからの経過秒数です;Unix Epochは1970年1月1日00:00:00 UTCです。単一の整数なのでコンピューターが保存・操作しやすく、オペレーティングシステムやファイルフォーマットで広く使用されています。この標準により、異なるシステムはローカルタイムゾーン設定に関係なく時間を正確に通信できます。", - heading2: "このツールの使い方", - p2: "UnixからHumanへの変換:Unixタイムスタンプフィールドにタイムスタンプを入力し、秒またはミリ秒かを選択します。HumanからUnixへの変換:ピッカーを使用して日時を選択し、希望のタイムゾーンを選択します。現在のタイムスタンプをすばやく取得するには、現在ボタンを使用してください。ISO 8601、ローカル時間、UTC、相対時間を含むリアルタイムの結果を確認してください。結果の横にあるコピーボタンをクリックしてクリップボードに保存します。", - heading3: "一般的なユースケース", - p3: "サーバーログやデータベースエントリで見つかる難解なタイムスタンプをデバッグ用の読みやすい日付に変換するログ分析。バックエンドが正しいエポック値を送信しているか確認するAPI開発。システム間で移動する際に時間ベースのデータの一貫性を確保するデータ移行。cronジョブ、有効期限、イベントトリガーの将来または過去のタイムスタンプを計算するスケジューリング。", - heading4: "プロのヒント", - p4: "JavaScriptで作業する場合、Date.now()はミリ秒を返しますが、標準のUnixタイムスタンプは秒単位であることを覚えておいてください — 変換するには1000で割ります。最大の互換性を確保するために、システム間のデータ交換には常にISO 8601フォーマットを使用してください。32ビット符号付き整数がオーバーフローする2038年問題に注意してください;現代のシステムは64ビット整数を使用しており、近い将来はこれを解決します。", - }, }, "color-converter": { name: "カラー変換ツール", @@ -1589,16 +1407,6 @@ export default { badge7: "ブラウザ内完結", badge8: "プライバシー保護", }, - edu: { - heading1: "カラーモデルの説明(HEX/RGB/HSL)", - heading2: "このツールの使い方", - heading3: "一般的なユースケース", - heading4: "プロのヒント", - p1: "

カラーモデルは色を表現するための数学的システムです。HEX(16進数)はHTMLとCSSで使用される6桁のコードで、赤、緑、青のコンポーネントを表します。RGB(赤、緑、青)はデジタルイメージングでよく使用され、各チャンネルに0から255の10進数値を使用します。

HSL(色相、彩度、輝度)は基本色(色相)、強度(彩度)、明るさ(輝度)で色を説明するため、人間にとってより直感的です。これらのモデルを理解することで、異なるプラットフォームやデバイス間での一貫性を確保しながら、デザインと開発のニーズに適した形式を選択するのに役立ちます。

", - p2: "
  1. 彩度/輝度の四角形でカーソルをドラッグし、色相スライダーを使用して視覚的カラーピッカーで色を選択します。
  2. または、「手動入力」フィールドに特定の値を入力します(#hex、rgb、またはhsl形式をサポート)。
  3. 「プレビュー」ボックスでリアルタイムに選択した色を確認します。
  4. 下のHEX、RGB、HSL、HSVカードで変換された値を確認します。
  5. カードの「コピー」アイコンをクリックしてその形式をクリップボードに保存します。
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "単位変換ツール", @@ -1616,16 +1424,6 @@ export default { text0: "変換式を見るには単位を選択", text1: "有効な数値を入力", }, - edu: { - heading1: "測定システムの概要", - p1: "測定システムは測定単位の集合とそれらを互いに関連付けるルールです。最も一般的な2つのシステムは、メートル法(国際単位系またはSI)とヤード・ポンド法です。メートル法は10のべき乗に基づいており、非常に論理的でスケールしやすいです。主に米国で使用されるヤード・ポンド法は、インチ、フィート、ポンドなどの単位を使用し、歴史的な起源と均一でない変換係数を持っています。これらのシステムの違いを理解することは、科学、工学、国際貿易、料理や旅行などの日常的なタスクに不可欠です。", - heading2: "このツールの使い方", - p2: "上部のグリッドから測定カテゴリー(例:長さ、重さ、温度)を選択します。変換元ドロップダウンメニューから変換したい単位を選択します。入力フィールドに変換したい値を入力します。変換先ドロップダウンメニューでターゲット単位を選択します。変換された値が変換に使用された数式とともに即座に表示されます。", - heading3: "一般的なユースケース", - p3: "キロメートルをマイルに、または摂氏を華氏に変換する旅行。メートル法(グラム/ミリリットル)とヤード・ポンド法(オンス/カップ)の測定間でレシピを変換する料理。圧力、エネルギー、または速度の異なる単位間の精密な変換のための工学と科学。メガバイト、ギガバイト、テラバイトの違いを理解するデジタルストレージ。", - heading4: "プロのヒント", - p4: "選択した単位間の変換方向を素早く逆転させるには、スワップボタンを使用してください。特にボリュームと重量の場合は特定の単位タイプを常に再確認してください;米国ガロンと英国ガロンのように名前が異なるシステムで似ている場合があります。一連の複数の変換を実行する場合は、累積丸め誤差を避けるために最終結果まで可能な限り多くの小数点以下の桁数を保持してください。", - }, }, "yaml-toml-converter": { name: "YAML/TOML変換ツール", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ TOML変換失敗:", tpl7: "変換待ち。", }, - edu: { - heading1: "YAML vs TOML vs JSON の比較", - p1: "JSONは、そのシンプルさとJavaScriptでのネイティブサポートにより、データ交換で最も広く使用されているフォーマットです。YAML(YAML Ain't Markup Language)は、インデントを使って構造を表現する人間に優しいデータシリアライズ標準であり、複雑な設定ファイルでよく使われます。TOML(Tom's Obvious, Minimal Language)は、明確な意味論により読み書きが容易になるよう設計されており、プロジェクトの設定によく使用されます。JSONが厳密でコンパクトであるのに対し、YAMLとTOMLは人間の可読性と手動編集のしやすさを優先しています。", - heading2: "このツールの使い方", - p2: "設定データ(JSON、YAML、TOML)を左側のソーステキストエリアに貼り付けます。ツールが自動的にソース形式を検出しますが、ドロップダウンから手動で選択することもできます。検証のみをクリックすると、変換を行わずに構文エラーをチェックできます。変換ボタン(→ JSON、→ YAML、→ TOML)のいずれかをクリックすると、データがその形式に変換されます。右側の出力パネルで結果を確認し、コピーをクリックしてクリップボードに保存します。", - heading3: "一般的なユースケース", - p3: "KubernetesマニフェストやDocker Composeファイル、AWS CloudFormationテンプレートを扱う際にJSONとYAMLを相互変換するInfrastructure as Code。package.json(JSON)とpyproject.tomlやCargo.toml(TOML)間で設定を移行するプロジェクト設定。複雑なデータ構造が異なる形式でどう見えるかを素早く可視化するAPIプロトタイピング。データの整合性を保ちながら古い設定ファイルを最新の形式に変換するレガシー移行。", - heading4: "プロのヒント", - p4: "複雑にネストした構造の可読性が保守性に不可欠なCI/CDパイプラインにはYAMLを使用してください。手動で編集する可能性があるエンドユーザー向けにクリーンなインターフェースを提供するには、アプリケーションレベルの設定ファイルにはTOMLを推奨します。YAMLからJSONに変換する際は、YAMLの型強制の問題(NOがfalseと解釈される場合があるなど)に注意し、データ型が正しく保持されることを確認してください。", - }, cheatsheet: { title: "フォーマット比較", h0: "構文の違い", @@ -1719,16 +1507,6 @@ export default { text1: "コピー", text2: "コピー済み!", }, - edu: { - heading1: "htpasswdとは何ですか?", - p1: "

htpasswdファイルは、ApacheやNginxのWebサーバーでBasic認証に使用するユーザー名とハッシュ化されたパスワードを保存するフラットファイルデータベースです。フルのデータベースベースの認証システムを必要とせずに、Webサイトの特定のディレクトリや管理パネルを保護するためのシンプルで効果的な方法です。

htpasswdファイルの各行は1人のユーザーを表し、username:hashed_passwordの形式に従います。

", - heading2: "このツールの使い方", - p2: "
  1. ユーザー名を入力:認証に使用するユーザー名を入力します。
  2. パスワードを指定:パスワードを入力するか、「強力なパスワードを生成」をクリックして安全なパスワードを作成します。
  3. アルゴリズムを選択:最新のセキュリティにはBcrypt(-B)を、レガシー互換性にはApache MD5(-m)を選択します。
  4. 生成:「エントリーを生成」をクリックしてハッシュ化された文字列を作成します。
  5. コピーまたはダウンロード:生成された行をクリップボードにコピーするか、ファイルとしてダウンロードしてサーバーにアップロードします。
", - heading3: "一般的なユースケース", - p3: "", - heading4: "プロのヒント", - p4: "", - }, }, "mock-data-generator": { name: "モックデータ生成ツール", @@ -1762,16 +1540,6 @@ export default { text1: "コピー", text2: "プレビューする行がありません。", }, - edu: { - heading1: "モックデータとは何ですか?", - p1: "

モックデータは、機密情報や個人識別情報(PII)を含まずに実世界のデータを模倣する合成情報です。GDPRやCCPAなどのプライバシー規制に違反したりデータ漏洩のリスクなしに、アプリケーションを構築・検証するための現実的なデータセットが必要な開発者やテスターに不可欠です。モックデータを使用することで、標準的なユーザープロファイルからエッジケースまで、様々なシナリオをシミュレートし、ソフトウェアがすべてのタイプの入力を適切に処理することを確認できます。

", - heading2: "テスト戦略", - p2: "

効果的なテストには多様なデータセットが必要です。開発データベースをシードしたり、何千ものレコードで負荷テストを実行したり、様々な文字列長でUIレイアウトを検証するためにモックデータを使用してください。外部APIから予測可能なレスポンスが必要な統合テストに特に役立ちます。ローカルでデータを生成することで、リセットと再現が容易な一貫したテスト環境を作成し、より信頼性が高く高速な開発サイクルをもたらします。

", - heading3: "モックにおけるデータプライバシー", - p3: "

プライバシーは現代のソフトウェア開発における最優先事項です。開発またはステージング環境で実際の本番データを使用することは、主要なセキュリティリスクです。モックデータジェネレーターは、偽物だが構造的に正しいデータを生成することでこれを解決します。このツールはブラウザ内で完全に実行されるため、設定と生成されたデータがデバイスから離れることはありません。このプライバシーファーストのアプローチにより、モックデータを作成するプロセス自体も最も厳格なセキュリティ基準に安全で準拠していることを保証します。

", - heading4: "プロのヒント", - p4: "", - }, cheatsheet: { title: "モックデータフィールドタイプ", h0: "利用可能なタイプ", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "命名規則の解説(camelCase/snake_caseなど)", - heading2: "このツールの使い方", - heading3: "一般的なユースケース", - heading4: "プロのヒント", - p1: "

命名規則とは、ソースコードやドキュメント内で変数、型、関数、その他のエンティティを表す識別子に使用する文字列を選ぶための一連のルールです。camelCase(例:myVariable)は小文字で始まり、それ以降の各単語の先頭を大文字にします。snake_case(例:my_variable)はアンダースコアで単語を区切ります。

PascalCase(例:MyVariable)はすべての単語の先頭を大文字にし、kebab-case(例:my-variable)はハイフンで単語を区切ります。これらの規則は単なる見た目の問題ではなく、コードの可読性、保守性、そしてさまざまなプログラミング言語やフレームワークの慣用的な標準に従うために重要です。

", - p2: "
  1. ページ上部の「入力テキスト」欄にテキストを入力または貼り付けます。
  2. ツールが自動的に入力内容をリアルタイムで10種類以上のケーススタイルに変換します。
  3. 「変換結果」グリッドをスクロールして、必要な特定のケーススタイルを見つけます。
  4. 結果の横にある「コピー」アイコンをクリックしてクリップボードに保存します。
  5. 「クリア」ボタンを使ってすべての入力を削除し、新しい変換を開始します。
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "コード圧縮ツール", @@ -1913,16 +1671,6 @@ export default { text2: "📋 コピー", tpl3: "すべての処理はブラウザで行われます。コードがデバイスから離れることはありません。", }, - edu: { - heading1: "圧縮(Minification)とは何ですか?", - heading2: "このツールの使い方", - heading3: "一般的なユースケース", - heading4: "プロのヒント", - p1: "

圧縮(Minification)とは、機能を変えずにソースコードから不要な文字をすべて削除するプロセスです。空白、改行、コメントの削除に加え、変数名を短縮することもあります。目的はコードのファイルサイズを削減することで、これによりネットワーク経由で転送する必要のあるデータ量も削減されます。

これにより、ページの読み込み速度が向上し、Webアプリケーションのパフォーマンスが改善します。圧縮は本番環境には不可欠ですが、コードは人間が読んでデバッグすることがほぼ不可能になります。そのため、通常は本番サーバーへのデプロイ前、ビルドプロセスの最終ステップとして実行されます。

", - p2: "
  1. 上部のタブからプログラミング言語(JavaScript、CSS、HTML、JSON)を選択します。
  2. 左側の「入力コード」テキストエリアにソースコードを貼り付けます。
  3. 「コードを圧縮」ボタンをクリックして、本番用にファイルサイズを削減します。
  4. あるいは、「コードを整形」をクリックしてインデントと書式を追加し、読みやすくします。
  5. 「出力コード」エリアで結果を確認し、「コピー」または「ダウンロード」をクリックして最適化されたコードを保存します。
", - p3: "", - p4: "", - }, }, "image-converter": { name: "画像変換ツール", @@ -1969,16 +1717,6 @@ export default { alert2: "ファイル読み取りエラー。", tpl3: "Canvas APIによるクライアント側処理 - アップロードなし、即時結果", }, - edu: { - heading1: "画像フォーマットの比較(PNG/JPEG/WebP)", - p1: "

適切な画像フォーマットを選ぶことは、Webパフォーマンスと視覚的品質にとって非常に重要です。JPEGは写真や色数の多い複雑な画像に最適で、非可逆圧縮を使用して小さなファイルサイズを実現します。PNGは透明度が必要な画像や、輪郭がはっきりした単色の画像(ロゴやアイコンなど)に最適で、可逆圧縮を使用します。

WebPは非可逆・可逆の両方で優れた圧縮を提供する最新のフォーマットで、高い品質を保ちながらJPEGやPNGよりも大幅に小さいファイルサイズになることが多いです。

", - heading2: "このツールの使い方", - p2: "
  1. 「画像をアップロード」ゾーンに画像をドロップするか、クリックしてファイルを選択します。
  2. 「変換フォーマット」オプションから希望の出力形式(PNG、JPG、WebP)を選択します。
  3. JPGやWebPなどの非可逆フォーマットを選択した場合、品質スライダーを使ってファイルサイズと画質のバランスを調整します。
  4. 必要に応じて、「画像をリサイズ」設定を使ってパーセンテージまたは特定の寸法で画像を拡大縮小します。
  5. 「変換してリサイズ」をクリックし、続けて「ダウンロード」をクリックして最適化されたアセットを保存します。
", - heading3: "一般的なユースケース", - p3: "", - heading4: "プロのヒント", - p4: "", - }, }, "css-gradient": { name: "CSSグラデーション生成ツール", @@ -2018,16 +1756,6 @@ export default { alert2: "CSSのクリップボードコピーに失敗", tpl3: "ローディング画面とオーバーレイ", }, - edu: { - heading1: "CSSグラデーションとは何ですか?", - heading2: "線形 vs 放射状 vs 円錐グラデーション", - heading3: "ブラウザサポートとパフォーマンス", - heading4: "より良いグラデーションのためのプロのヒント", - p1: "

CSSグラデーションは、2つ以上の指定した色の間で滑らかな移行を表示できる強力な機能です。従来の背景画像とは異なり、グラデーションはブラウザによって生成されるため、無限に拡大縮小可能で、帯域幅の消費が少なく、コードで簡単に操作できます。背景、ボタン、装飾要素によく使用され、Webデザインに奥行きと視覚的な魅力を加えます。

", - p2: "

CSSグラデーションには主に3つの種類があります:

", - p3: "

最新のCSSグラデーションは、Chrome、Firefox、Safari、Edgeなど、すべての主要ブラウザで広くサポートされています。ブラウザのエンジンによって数学的にレンダリングされるため、高解像度の画像と比較して非常にパフォーマンスに優れています。ただし、色の分岐点が数十個ある非常に複雑なグラデーションの場合は、低スペックデバイスでのパフォーマンスを常にテストすることをお勧めします。古いブラウザ(IE9以下など)向けには、単色のフォールバックを用意することをお勧めします。

", - p4: "", - }, }, "curl-studio": { name: "cURLスタジオ", @@ -2096,16 +1824,6 @@ export default { text2: "コピー済み!", tpl3: "マスク後にログがここに表示されます...", }, - edu: { - heading1: "PIIとは何ですか?", - p1: "

個人識別情報(PII)とは、特定の個人を識別するために使用できるあらゆるデータのことです。これには、氏名、メールアドレス、電話番号などの直接的な識別子だけでなく、IPアドレス、所在地、クレジットカード番号などの間接的な識別子も含まれます。サーバーログの文脈では、PIIはリクエストパラメーター、ヘッダー、エラーメッセージによく現れます。

PIIの保護は現代のデータセキュリティの重要な要素であり、世界各国のさまざまな法的枠組みによって義務付けられています。

", - heading2: "コンプライアンス要件(GDPR/CCPA)", - p2: "

欧州の一般データ保護規則(GDPR)や米国のカリフォルニア州消費者プライバシー法(CCPA)などの規制は、個人データの取り扱い方法に厳格なルールを課しています。これらの法律は、組織にプライバシー・バイ・デザインの実装と、個人データの収集・保存の最小化を求めています。

PIIを含む生のログをサードパーティのサポートチームや開発者と共有すると、コンプライアンス違反につながる可能性があります。安全な環境を離れる前にこのデータをマスキングまたは匿名化することは、規制コンプライアンスを維持するための重要なステップです。

", - heading3: "マスキング戦略", - p3: "

ログ内の機密データを扱う方法はいくつかあります:

本ツールは編集(redaction)に焦点を当てており、パターンマッチングを使って一般的なPII形式を即座に検出・置換します。

", - heading4: "プロのヒント", - p4: "", - }, }, "mermaid-studio": { name: "Mermaidスタジオ", @@ -2306,16 +2024,6 @@ export default { text51: "URLはまだ抽出されていません。", text52: "経路情報はまだありません。", }, - edu: { - heading1: "メール認証の仕組み", - heading2: "SPF/DKIM/DMARC", - heading3: "フィッシング検出", - heading4: "プロのヒント", - p1: "

メール認証とは、メールメッセージの送信元について検証可能な情報を提供するために使用される一連の技術です。送信者の身元を検証することで、これらのプロトコルはメールサーバーが正当なメッセージと(フィッシングのような)なりすまし・詐欺メッセージを区別するのに役立ちます。現代のメール認証の3本柱はSPF、DKIM、DMARCです。

メールを受信すると、受信サーバーはこれらのチェックを実行し、結果をメールヘッダーに記録します。このツールはそれを解析して表示します。

", - p2: "", - p3: "

フィッシングメールは、信頼できる送信元からのように見せかけるために「なりすまし」をよく使用します。本アナライザーは、「差出人」アドレス(ユーザーに表示されるもの)と「Return-Path」(実際にメールが送られてきた場所)の不一致など、よくある警告サインを探します。また、メール本文中のURLを抽出・分析し、Punycode(見た目が似たドメイン)やホスト名の代わりにIPアドレスを使用しているなど、疑わしいリンクを特定します。

「検出結果」セクションを確認することで、これらの兆候を素早く特定し、そのメールとやり取りしても安全かどうかを判断できます。

", - p4: "", - }, cheatsheet: { title: "メール認証クイックリファレンス", h0: "各チェックの意味", @@ -2491,16 +2199,6 @@ export default { text9: "まずSQLを貼り付けてください。", text10: "✓ コピー済み", }, - edu: { - heading1: "なぜSQLを整形するのか?", - p1: "SQLは、複数のJOIN、サブクエリ、ネストした条件を扱う場合など、すぐに複雑で読みにくくなることがあります。SQLの整形には、一貫したインデント、改行、キーワードの大文字化を加えることが含まれます。これによりクエリのロジックが格段に追いやすくなり、デバッグ、コードレビュー、そして時間の経過とともに大規模なデータベーススキーマを保守する上で不可欠です。整形の行き届いたクエリは、手動編集の際の論理エラーも起こりにくくなります。", - heading2: "このツールの使い方", - p2: "左側の「入力SQL」エディターに生のSQLクエリを貼り付けます。データベースの方言(PostgresまたはMySQL)と希望のキーワード大文字小文字(大文字または小文字)を選択します。「フォーマット」ボタンをクリックすると、適切なインデントとスペーシングでクエリが整形されます。「検証」ボタンを使用して、閉じられていない引用符や不均衡な括弧など、よくある構造上の問題をチェックします。「コピー」をクリックして整形されたSQLをクリップボードに保存するか、「クリア」をクリックして最初からやり直します。", - heading3: "一般的なユースケース", - p3: "プルリクエストを提出する前に乱雑なSQLを整形するコードレビュー。データベースに対して実際に何が実行されているかを正確に理解するために、ORMが生成したクエリを整理するデバッグ。技術ガイド、Wiki、READMEファイル向けに明確で読みやすい例を作成するドキュメント作成。古い非整形スクリプトを最新の読みやすいスタイルに素早くリファクタリングするレガシーの整理。", - heading4: "プロのヒント", - p4: "WITH句を使った共通テーブル式(CTE)を活用して、複雑なクエリをより小さく管理しやすい部分に分解しましょう。クエリの意図を明確にするため、テーブルやカラムには常に説明的なエイリアスを使用してください。設定ファイルやコマンドラインツールで使用するためにSQLを1行に圧縮する必要がある場合は、「圧縮」ボタンを使用してください。", - }, cheatsheet: { title: "SQL整形のヒント", h0: "手早く改善できるポイント", @@ -2569,16 +2267,6 @@ export default { text15: "注: 安全のため値はマスクされます。差分はヒューリスティックで、コメント/順序は含みません。", text16: "✓ コピー済み", }, - edu: { - heading1: "環境変数のベストプラクティス", - heading2: "シークレット管理", - heading3: ".envのセキュリティ", - heading4: "プロのヒント", - p1: "

環境変数は、設定とコードの厳密な分離を提唱する「Twelve-Factor App」方法論の基本的な要素です。環境変数を使用することで、設定値を変更するだけで同じコードを異なる環境(開発、ステージング、本番)で実行できます。

ベストプラクティスには、説明的な大文字の名前を使用すること(例:DATABASE_URL)、重要でない設定にはデフォルト値を提供すること、機密情報を決してソース管理に直接ハードコードしないことが含まれます。

", - p2: "

シークレットは、APIキー、データベースパスワード、秘密証明書などの機密情報を含む特別なカテゴリの環境変数です。これらを安全に管理することは、データ漏洩を防ぐために極めて重要です。本番環境では、専用のシークレット管理サービス(AWS Secrets Manager、HashiCorp Vault、Cloudflare Secretsなど)を使用すべきです。

ローカル開発では.envファイルが一般的に使用されますが、決してgitリポジトリにコミットしてはいけません。必ず*.envを.gitignoreファイルに追加してください。

", - p3: "

デバッグのために.envファイルをチームメイトと共有すると、誤って本番のシークレットを露出させてしまうリスクが高くなります。本ツールは「機密値をマスク」機能を提供することで、このリスクを軽減します。ヒューリスティックを使用してSECRET、TOKEN、PASSWORDのようなキーを識別し、その値をマスクされたバージョン(例:ab...yz (32))に置き換えます。

これにより、実際のシークレットを漏らすことなく、環境ファイルの構造や機密でない値を比較できます。

", - p4: "", - }, cheatsheet: { title: "Dotenvに関する注意事項", h0: "マスキング戦略", @@ -2638,16 +2326,6 @@ export default { text7: "まだプレビューはありません。", text8: "✓ コピー済み", }, - edu: { - heading1: "SVGとは何ですか?", - p1: "SVG(Scalable Vector Graphics)は、インタラクティブ性とアニメーションをサポートする2次元グラフィックス用のXMLベースのベクター画像フォーマットです。JPEGやPNGのようなラスターフォーマットとは異なり、SVGは数学的なパスで定義されているため、品質を落とすことなくどんなサイズにも拡大縮小できます。これにより、モバイル画面から高解像度のデスクトップモニターまで、あらゆる場面で鮮明さを保てるため、Web上のロゴ、アイコン、イラストに最適です。", - heading2: "このツールの使い方", - p2: "左側の「SVG入力」テキストエリアにSVGコードを貼り付けます。「プレビュー」をクリックすると、グラフィックが表示され、カラーパレットが抽出されます。「最適化」または「圧縮」ボタンを使ってマークアップを整理し、ファイルサイズを削減します。必要に応じて、カラーパネルで新しい値を入力し「適用」をクリックして特定の色を置き換えます。「コピー」または「ダウンロード」をクリックして、サニタイズ・最適化されたSVGを保存します。", - heading3: "一般的なユースケース", - p3: "FigmaやIllustratorなどのデザインツールからエクスポートされたSVGを整理するアイコン管理。ブランドパレットに合わせてアイコンセットの色を素早く変更するテーマ設定。信頼できないソースからのSVGをサニタイズし、潜在的なスクリプトや外部参照を削除するセキュリティ対策。インライングラフィックのサイズを削減してページ読み込み時間を改善するために、SVGマークアップを圧縮するパフォーマンス改善。", - heading4: "プロのヒント", - p4: "「currentColor」ボタンを使用すると、明示的なfillとstrokeをすべてcurrentColorに変換し、CSS経由でSVGを簡単にスタイリングできるようにします。本番で使用する前に、常にSVGを最適化してできるだけ小さくしてください。デザインツールでSVGを作成する際は、「Outline Stroke」や「Simplify Path」機能を使って、最適化前に生成されるコードの複雑さを減らしてください。", - }, cheatsheet: { title: "SVGの安全性に関する注意事項", h0: "サニタイズ", @@ -2801,16 +2479,6 @@ export default { text28: "スキャンをクリックしてシークレットを探します。", text29: "✓ コピー済み", }, - edu: { - heading1: "シークレット漏洩とは何ですか?", - p1: "シークレット漏洩は、APIキー、パスワード、秘密トークンなどの機密情報が誤ってバージョン管理にコミットされたり、公開フォーラムで共有されたりすることで発生します。これらの漏洩は、不正アクセス、データ侵害、金銭的損失につながる可能性があります。このツールは、コードを共有またはコミットする前に、ブラウザ上でローカルに一般的なシークレットパターンを識別するのに役立ちます。", - heading2: "このツールの使い方", - p2: "入力エリアにコード、設定、またはログファイルを貼り付けます。「スキャン」ボタンをクリックして、テキスト内の潜在的なシークレットを分析します。検出された各項目について、結果とアドバイスを確認します。「編集済みをコピー」ボタンを使用して、シークレットがマスクされた共有安全なバージョンのテキストを取得します。", - heading3: "一般的なユースケース", - p3: "シークレットが含まれていないことを確認するためにコミット前にコードをスキャンするプリコミットチェック。サポートやチームメイトと共有する前にログ内の機密トークンをマスクするログの編集。ハードコードされた認証情報がないか設定ファイルを素早く監査するセキュリティ監査。", - heading4: "プロのヒント", - p4: "認証情報が漏洩していることが判明した場合は、必ずすぐにローテーションしてください。ソースコードにシークレットをハードコードする代わりに、環境変数やシークレットマネージャーを使用してください。より徹底したスキャンには「低重要度パターンを含める」を有効にしてください。ただし、誤検出が増える可能性があることに注意してください。", - }, cheatsheet: { title: "シークレットを見つけた場合の対処法", h0: "すぐに行うべき手順", @@ -2907,16 +2575,6 @@ export default { text15: "✓ 有効なJWKS構造(", text16: "JWKを貼り付けてください。", }, - edu: { - heading1: "JWTとは何ですか?", - p1: "JSON Web Token(JWT)は、当事者間で転送されるクレームを表現するためのコンパクトでURL安全な手段です。JWTはドットで区切られた3つのBase64URLエンコード部分から構成されます:ヘッダー(アルゴリズムとタイプ)、ペイロード(クレーム)、署名です。署名はトークンが改ざんされていないことを保証します。JWTはWeb APIにおける認証や情報交換によく使用されます。標準クレームには、sub(サブジェクト)、iss(発行者)、aud(オーディエンス)、exp(有効期限)、nbf(Not Before)、iat(発行日時)、jti(JWT ID)が含まれます。", - heading2: "JWTアルゴリズム", - p2: "HS256/384/512は、SHA-2と共有シークレットを使ったHMACを使用します — シンプルですが、両者が同じ鍵を保持する必要があります。RS256/384/512は、RSA PKCS#1 v1.5非対称署名を使用します — サービスが公開鍵のみを必要とするマイクロサービスアーキテクチャに最適です。ES256/384/512は、NIST曲線を使ったECDSAを使用し、同等のセキュリティでRSAよりも小さな署名を実現します。PS256/384/512は、確率的な方式であるRSA-PSSを使用し、最新のシステムではRS*よりも推奨されます。", - heading3: "JWKとJWKS", - p3: "JSON Web Key(JWK)は、暗号鍵を表現するJSON構造です。JWK Set(JWKS)は、keysプロパティの下にJWKの配列を含むJSON構造です。サービスは、既知のURL(例:/.well-known/jwks.json)でJWKSを公開し、クライアントが帯域外の鍵交換なしにJWT検証用の公開鍵を取得できるようにします。JWKS内の鍵はkid(Key ID)によって識別され、JWTヘッダーがこれを参照します。", - heading4: "セキュリティのベストプラクティス", - p4: "exp、nbf、iss、audクレームは必ずサーバー側で検証してください。本番環境では絶対にalg: noneアルゴリズムを使用しないでください — すべての署名保護が失われます。複数のサービスがトークンを検証する必要がある場合は、HMACよりも非対称アルゴリズム(RS*、ES*、PS*)を優先してください。鍵は定期的にローテーションし、各トークンの署名に使用された鍵を識別するためにkidを使用してください。秘密鍵は安全に保管し、絶対にバージョン管理にコミットしないでください。長期間有効なJWTではなく、短い有効期限とリフレッシュトークンを使用してください。", - }, }, "encoding-workbench": { name: "エンコーディングワークベンチ", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "認識できるエンコード層が見つかりませんでした。", }, - edu: { - heading1: "エンコーディングとハッシュ化の違い", - heading2: "このツールの使い方", - heading3: "多層エンコーディングの解説", - heading4: "ハッシュアルゴリズムガイド", - p1: "

エンコーディングは、データを可逆的(デコード可能)な別の表現に変換します。一般的な形式には、テキストチャネル経由でバイナリデータを送信するために使用されるBase64、URLエンコーディング、HTMLエンティティエンコーディング、16進数などがあります。エンコーディングは暗号化ではなく、機密性は提供しません。

ハッシュ化は一方向の数学的変換です。暗号学的ハッシュ関数は、任意の入力を受け取り、固定長のフィンガープリントを生成します。ハッシュから元の入力を復元することはできません。ハッシュは、ファイルの整合性検証、パスワードの安全な保存、デジタル署名の生成に使用されます。

", - p2: "
  1. エンコード/デコードタブ:テキストを貼り付けて操作(Base64、URL、HTML、16進数)を選択するか、「レイヤーを自動検出」をクリックして複数のネストしたエンコーディングを自動的に解除します。
  2. ハッシュタブ:テキストを入力するかファイルを選択し、アルゴリズムを選んで「すべてハッシュ化」をクリックします。HMACモードを有効にすると、共有シークレットを使ったキー付きハッシュを計算できます。
  3. 識別タブ:未知のハッシュやエンコードされた文字列を貼り付けて「識別」をクリックすると、確信度付きで有力なアルゴリズムが表示されます。
", - p3: "

実際のデータは、複数回エンコードされることがよくあります。例えば、ペイロードがURLエンコードされ、次にBase64エンコードされ、さらに16進文字列の中に入れられることがあります。「レイヤーを自動検出」機能は、入力パターンを検査し、各デコードを順番に試み、すべてのステップをカードとして可視化するため、データがどのようにラップされていたかを正確に確認できます。

", - p4: "", - }, }, "oauth-debugger": { name: "OAuthデバッガー", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "PKCEとは何ですか?なぜ重要なのですか?", - p1: "

Proof Key for Code Exchange(PKCE、RFC 7636)は、もともとクライアントシークレットを安全に保存できないモバイルアプリやネイティブアプリ向けに設計されました。クライアントがランダムなcode_verifierを生成し、そこからcode_challengeを導出し(SHA-256 + base64url)、認可リクエストと一緒にチャレンジを送信することで機能します。認可コードをトークンと交換する際、クライアントは元のcode_verifierを送信します。認可サーバーは、それが以前のチャレンジと一致することを検証します — これにより、トークンリクエストがフローを開始したのと同じクライアントから来たことが証明されます。

機密クライアント(クライアントシークレットを持つサーバー側アプリ)であっても、PKCEは現在OAuth 2.1により、認可コード傍受攻撃への対策として推奨されています。

", - heading2: "なぜインプリシットフローは非推奨なのですか?", - p2: "

インプリシットフロー(response_type=token)は、シングルページアプリ向けのショートカットとして設計され、アクセストークンをURLフラグメントに直接返します。これは深刻な問題を引き起こします。URL内のトークンはブラウザ履歴、サーバーログ、リファラーヘッダーに残り、フローはトークンインジェクション攻撃に対して脆弱です。OAuth 2.0 Security Best Current Practice(RFC 9700)とOAuth 2.1は、SPAがクライアントシークレットなしで安全に使用できる認可コード+PKCEを優先し、インプリシットフローを明示的に廃止しています。

", - heading3: "OAuth 2.1の主な変更点", - p3: "", - heading4: "認可コードフローのステップバイステップ解説", - p4: "
  1. PKCEペアを生成:ランダムなcode_verifierを作成し、code_challenge = BASE64URL(SHA256(code_verifier))を計算します。
  2. 認可エンドポイントにリダイレクト:response_type=code、client_id、redirect_uri、scope、state、code_challenge、code_challenge_method=S256を含めます。
  3. 認可サーバーでユーザーが認証し、同意を許可します。
  4. エコーされたstateとともに、redirect_uriで認可コードを受け取ります — stateが送信したものと一致することを確認します。
  5. コードをトークンと交換:grant_type=authorization_code、code、redirect_uri、client_id、code_verifierを使ってトークンエンドポイントにPOSTします。
  6. アクセストークンを受け取り(オプションでid_tokenとrefresh_tokenも)、APIの呼び出しに使用します。
", - }, }, "ladder-game": { name: "あみだくじ", diff --git a/src/i18n/ko.js b/src/i18n/ko.js index 1a2b704..34b5e78 100644 --- a/src/i18n/ko.js +++ b/src/i18n/ko.js @@ -90,16 +90,6 @@ export default { text7: "✓ 복사됨", tpl8: "최대 깊이", }, - edu: { - heading1: "JSON이란 무엇인가요?", - p1: "

JSON(JavaScript Object Notation)은 사람이 읽고 쓰기 쉽고 기계가 파싱하고 생성하기 쉬운 경량 데이터 교환 형식입니다. JavaScript 프로그래밍 언어 표준의 하위 집합을 기반으로 합니다. JSON은 완전히 언어에 독립적인 텍스트 형식이지만 C 계열 언어 프로그래머에게 친숙한 규칙을 사용합니다.

이러한 특성들은 JSON을 웹 애플리케이션, API, 구성 파일에 이상적인 데이터 교환 언어로 만듭니다. JSON은 더 작은 용량과 더 나은 성능으로 XML을 대체하며 웹에서 데이터 교환의 사실상 표준이 되었습니다.

", - heading2: "이 도구 사용 방법", - p2: "
  1. 왼쪽의 JSON 입력 편집기에 원시 또는 지저분한 JSON 데이터를 붙여넣으세요.
  2. 형식 버튼을 클릭하여 적절한 들여쓰기와 구문 강조로 코드를 보기 좋게 만드세요.
  3. 또는 최소화 버튼을 사용하여 프로덕션 사용을 위해 모든 공백을 제거하세요.
  4. JSON이 유효한지 확인하려면 상태 표시기를 확인하세요; 오류가 있으면 도구가 정확한 줄을 강조 표시합니다.
  5. 형식화된 결과를 클립보드에 저장하려면 복사를 클릭하거나 초기화하려면 지우기를 클릭하세요.
", - heading3: "일반적인 사용 사례", - p3: "", - heading4: "프로 팁", - p4: "", - }, }, "jwt-decoder": { name: "JWT 검사기", @@ -139,22 +129,6 @@ export default { status5: "알고리즘: ", status6: "디코딩 실패", }, - edu: { - heading1: "JWT란 무엇인가요?", - p1: "

JSON 웹 토큰(JWT)은 당사자 간에 정보를 JSON 객체 형태로 안전하게 전송하기 위한 간결하고 독립적인 방식을 정의하는 공개 표준(RFC 7519)입니다. 이 정보는 디지털 서명되어 있어 검증하고 신뢰할 수 있습니다. JWT는 비밀 키(HMAC 알고리즘 사용) 또는 RSA나 ECDSA를 사용하는 공개/개인 키 쌍으로 서명할 수 있습니다.

간결한 크기 덕분에 JWT는 HTTP Authorization 헤더의 Bearer 토큰과 같이 인증 및 정보 교환 시나리오에서 흔히 사용됩니다.

", - heading2: "이 도구 사용 방법", - p2: "
  1. 토큰 붙여넣기: 인코딩된 JWT(header.payload.signature)를 복사하여 입력란에 붙여넣으세요.
  2. 자동 디코딩: 도구가 토큰을 자동으로 감지하여 실시간으로 구성 요소를 디코딩합니다.
  3. 헤더 확인: Header 섹션에서 알고리즘(alg)과 토큰 유형(typ)을 확인하세요.
  4. 페이로드 분석: Payload 섹션에서 만료 시간(exp), 발급자(iss), 주체(sub) 등의 클레임을 확인하세요.
  5. 클레임 검증: Claim Analysis 상자에서 사람이 읽기 쉬운 날짜와 검증 상태를 확인하세요.
", - heading3: "일반적인 사용 사례", - p3: "", - heading4: "프로 팁", - p4: "", - heading5: "토큰 구조 (header.payload.signature)", - p5: "

JWT는 일반적으로 점으로 구분된 세 부분으로 구성됩니다:

", - heading6: "보안 고려 사항", - p6: "

JWT는 무결성을 보장하기 위해 서명되지만 일반적으로 암호화되지는 않습니다. 즉, 토큰을 가진 사람은 누구나 헤더와 페이로드를 디코딩하여 내부 정보를 읽을 수 있습니다. 비밀번호나 개인 키 같은 민감한 정보를 JWT 페이로드에 저장하지 마세요.

또한 재전송 공격을 방지하기 위해 항상 exp(만료) 클레임을 확인하고, 서버가 페이로드의 데이터를 신뢰하기 전에 서명을 검증하도록 하세요.

", - heading7: "프로 팁", - p7: "", - }, cheatsheet: { title: "JWT 빠른 참조", h0: "구조", @@ -193,16 +167,6 @@ export default { text0: "✓ 복사됨!", tpl1: "GUID:", }, - edu: { - heading1: "UUID란 무엇인가요?", - p1: "범용 고유 식별자(UUID)는 컴퓨터 시스템에서 정보를 고유하게 식별하는 데 사용되는 128비트 숫자입니다. 중앙 기관 없이 독립적으로 생성되도록 설계되었으며 충돌 확률은 무시할 수 있을 정도로 낮습니다.", - heading2: "이 도구 사용 방법", - p2: "UUID 버전(시간 기반은 v1, 무작위는 v4)과 필요한 ID 개수를 선택하세요. 생성 버튼을 클릭하면 데이터베이스나 애플리케이션에서 바로 사용할 수 있는 고유 식별자 목록이 만들어집니다.", - heading3: "일반적인 사용 사례", - p3: "분산 데이터베이스의 기본 키, 세션 식별자, 트랜잭션 추적, 그리고 여러 시스템에서 고유성이 중요한 임시 파일이나 리소스의 이름 지정 등에 사용됩니다.", - heading4: "프로 팁", - p4: "UUID v4는 고품질 무작위성에 기반하기 때문에 범용 고유 ID로 가장 널리 사용됩니다. 생성 시간 순으로 ID를 정렬해야 한다면 v1을 사용하세요.", - }, }, "password-generator": { name: "비밀번호 생성기", @@ -265,24 +229,6 @@ export default { status6: "약함", text1: "유효한 기본 이메일 주소를 입력하세요.", }, - edu: { - heading1: "강력한 비밀번호란 무엇인가요?", - p1: "

강력한 비밀번호는 무단 접근에 대한 첫 번째 방어선입니다. 고속 컴퓨팅 시대에서 \"안전하다\"는 것은 엔트로피로 정의됩니다 — 문자열의 무작위성과 예측 불가능성의 척도입니다. 강력한 비밀번호는 길어야 하고(최소 16자), 모든 계정에서 고유해야 하며, 대문자, 소문자, 숫자, 기호를 포함한 다양한 문자 유형으로 구성되어야 합니다.

생일, 반려동물 이름, 흔한 사전 단어 같은 개인 정보는 피하세요. P@ssw0rd123처럼 복잡해 보이는 조합도 일반적인 패턴의 방대한 사전을 사용하는 현대의 무차별 대입 도구에 의해 쉽게 크래킹됩니다.

", - heading2: "이 도구 사용 방법", - p2: "
  1. 모드 선택: 필요에 따라 비밀번호, 사용자명, 패스프레이즈, 또는 이메일 별칭 중에서 선택하세요.
  2. 길이 조정: 슬라이더를 사용하여 원하는 길이를 설정하세요. 비밀번호의 경우, 높은 보안을 위해 16자 이상이 권장됩니다.
  3. 옵션 구성: 문자 세트(기호, 숫자 등) 또는 스타일(읽기 쉬운 vs. 보안)을 전환하세요.
  4. 생성: 생성 버튼을 클릭하여 고유한 자격증명을 만드세요.
  5. 복사: 복사 아이콘을 사용하여 결과를 클립보드나 비밀번호 관리자로 안전하게 이동하세요.
", - heading3: "일반적인 사용 사례", - p3: "", - heading4: "프로 팁", - p4: "", - heading5: "강력한 비밀번호란 무엇인가요?", - p5: "

강력한 비밀번호는 무단 접근에 대한 첫 번째 방어선입니다. 고속 컴퓨팅 시대에서 \"안전하다\"는 것은 엔트로피로 정의됩니다 — 문자열의 무작위성과 예측 불가능성의 척도입니다. 강력한 비밀번호는 길어야 하고(최소 16자), 모든 계정에서 고유해야 하며, 대문자, 소문자, 숫자, 기호를 포함한 다양한 문자 유형으로 구성되어야 합니다.

생일, 반려동물 이름, 흔한 사전 단어 같은 개인 정보는 피하세요. P@ssw0rd123처럼 복잡해 보이는 조합도 일반적인 패턴의 방대한 사전을 사용하는 현대의 무차별 대입 도구에 의해 쉽게 크래킹됩니다.

", - heading6: "엔트로피 설명", - p6: "

엔트로피는 비밀번호의 무작위성과 예측 불가능성의 척도로, 일반적으로 비트로 표현됩니다. 엔트로피가 높을수록 비밀번호가 더 강력합니다. 예를 들어, 소문자만 사용하는 10자 비밀번호는 전체 영숫자 및 특수 문자를 사용하는 10자 비밀번호보다 엔트로피가 훨씬 낮습니다.

생성기는 실시간으로 엔트로피를 계산하여 비밀번호 강도에 대한 객관적인 측정값을 제공합니다. 100비트 이상의 엔트로피를 가진 비밀번호는 현대의 크래킹 기술에 매우 강한 것으로 간주됩니다.

", - heading7: "모범 사례", - p7: "", - heading8: "프로 팁", - p8: "", - }, }, "hash-calculator": { name: "해시 계산기", @@ -350,16 +296,6 @@ export default { tpl4: "입력 대기 중...", text2: "계산됨: ", }, - edu: { - heading1: "해싱이란 무엇인가요?", - p1: "

암호학적 해싱은 텍스트나 파일 같은 입력 데이터를 고정된 길이의 문자열(일반적으로 16진수)로 변환하는 수학적 프로세스입니다. 이 지문은 입력값마다 고유하며, 원본 데이터에서 단 한 비트만 바뀌어도 완전히 다른 해시가 생성됩니다. 이를 눈사태 효과(avalanche effect)라고 합니다.

암호화와 달리 해싱은 단방향 함수입니다. 해시를 역산하여 원본 데이터를 얻을 수 없습니다. 이러한 특성 덕분에 데이터 무결성 검증, (솔트와 결합한) 안전한 비밀번호 저장, 내용을 노출하지 않고 파일을 식별하는 데 이상적입니다.

", - heading2: "이 도구 사용 방법", - p2: "
  1. 입력 유형 선택: 문자열은 텍스트 탭, 로컬 파일은 파일 탭을 선택하세요.
  2. 입력 제공: 작업 영역에 텍스트를 붙여넣거나 파일을 드래그 앤 드롭하세요.
  3. 선택적 HMAC: 인증용 키드 해시를 생성하려면 HMAC 필드에 비밀 키를 입력하세요.
  4. 결과 확인: 도구가 실시간으로 여러 해시 변형(SHA-256, SHA-512 등)을 자동으로 계산합니다.
  5. 무결성 검증: 검증 탭을 사용해 알려진 해시와 입력값을 비교하여 변조 여부를 확인하세요.
", - heading3: "일반적인 사용 사례", - p3: "", - heading4: "프로 팁", - p4: "", - }, cheatsheet: { title: "해시 알고리즘 참조", h0: "알고리즘 비교", @@ -435,16 +371,6 @@ export default { text5: "최소 /", text6: "IPv6 /", }, - edu: { - heading1: "CIDR이란 무엇인가요?", - heading2: "이 도구 사용 방법", - heading3: "일반적인 사용 사례", - heading4: "프로 팁", - p1: "클래스리스 도메인 간 라우팅(CIDR)은 IP 주소와 IP 라우팅을 할당하는 방법입니다. 주소 배포에 더 많은 유연성과 효율성을 제공하기 위해 클래스(A, B, C) 기반의 이전 시스템을 대체했습니다.", - p2: "IP 접두사와 함께 IP 주소를 입력하거나(예: 192.168.1.0/24) 슬라이더를 사용하여 접두사 길이를 조정합니다. \"분석 실행\"을 클릭하여 네트워크 세부 정보, 사용 가능한 호스트 범위 및 이진 표현을 확인합니다.", - p3: "클라우드 인프라(VPC)를 위한 네트워크 서브넷 계획, 라우팅 문제 해결, 특정 접두사의 호스트 용량 계산, CIDR과 서브넷 마스크 간 변환.", - p4: "IPv4에서 서브넷의 첫 번째와 마지막 주소는 일반적으로 네트워크 ID와 브로드캐스트 주소로 예약됩니다. IPv6에서 서브넷은 표준 로컬 네트워크의 경우 거의 항상 /64입니다.", - }, cheatsheet: { title: "서브넷 빠른 참조", h0: "일반적인 서브넷", @@ -619,16 +545,6 @@ export default { tpl3: "기본값 변경:", tpl4: "검색과 일치하는 포트를 찾을 수 없습니다.", }, - edu: { - heading1: "포트 카테고리 및 보안 가이드", - p1: "잘 알려진 포트(0-1023)는 IANA가 할당하며 Unix 시스템에서 루트 권한이 필요합니다. 등록된 포트(1024-49151)는 애플리케이션이 사용합니다. 동적/임시 포트(49152-65535)는 클라이언트 측 연결에 사용됩니다. 포트 범위를 이해하는 것은 방화벽 구성과 네트워크 보안에 필수적입니다.", - heading2: "이 도구 사용 방법", - p2: "포트 번호 또는 서비스 이름으로 검색하여 프로토콜 세부 정보와 보안 위험 수준을 확인하세요. 카테고리(잘 알려진, 등록된, 동적) 또는 프로토콜(TCP/UDP)로 필터링하여 결과를 좁힐 수 있습니다. 행을 클릭하면 일반적인 취약점과 보안 강화 권장 사항을 포함한 전체 세부 정보를 볼 수 있습니다.", - heading3: "일반적인 사용 사례", - p3: "방화벽 규칙 구성, 네트워크 문제 해결, 보안 감사 중 예기치 않게 열린 포트 식별, 프로토콜 포트 할당에 대한 빠른 참조 등에 사용됩니다.", - heading4: "프로 팁", - p4: "위험도 필터를 사용하면 네트워크에서 고위험 포트를 빠르게 식별할 수 있습니다. '가장 많이 사용되는 상위 50개 포트' 섹션은 가장 자주 사용되는 서비스를 한눈에 보여줍니다.", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
포트서비스위험
21FTP암호화되지 않은 파일 전송
23Telnet평문 인증
25SMTP이메일 스팸 릴레이 위험
53DNSDDoS 증폭 공격
445SMB랜섬웨어 확산
3389RDP무차별 대입 공격
", @@ -872,16 +788,6 @@ export default { text4: "경고", alert0: "먼저 구성을 생성해 주세요", }, - edu: { - heading1: "WireGuard 소개", - p1: "WireGuard는 최신 암호화 기술을 사용하는 현대적이고 고성능인 VPN 프로토콜입니다. OpenVPN이나 IPsec 같은 기존 프로토콜보다 더 단순하고 빠르게 설계되었으며, 최소한의 코드베이스 덕분에 공격 표면이 훨씬 작습니다. WireGuard는 현재 Linux 커널에 포함되어 있으며 Windows, macOS, iOS, Android에서 네이티브로 지원됩니다.", - heading2: "이 도구 사용 방법", - p2: "토폴로지 템플릿(포인트 투 포인트, 허브 앤 스포크, 사이트 투 사이트, 로드 워리어)을 선택하면 구성이 미리 채워집니다. 키 생성 버튼을 클릭하면 브라우저에서 로컬로 새 키 쌍이 만들어집니다. 필수 필드를 입력한 후 구성 생성 버튼을 클릭하면 WireGuard 구성 파일이 만들어집니다. 구성 파일(.conf) 다운로드로 파일을 저장하거나 QR 생성으로 모바일 가져오기용 QR 코드를 만드세요.", - heading3: "일반적인 사용 사례", - p3: "회사 네트워크에 연결하는 직원용 원격 접속 VPN. 지사 네트워크를 연결하는 사이트 투 사이트 VPN. 공용 Wi-Fi에서 안전하게 탐색하기 위한 개인 VPN 서버. 임베디드 기기 간 안전한 통신을 위한 IoT 기기 터널링.", - heading4: "프로 팁", - p4: "NAT 뒤에 있는 클라이언트에서는 트래픽이 없을 때도 터널을 유지하기 위해 PersistentKeepalive = 25를 사용하세요. PresharedKey는 양자내성을 위한 추가적인 대칭 암호화 계층을 더합니다. AllowedIPs = 0.0.0.0/0은 모든 트래픽을 터널을 통해 라우팅하고(풀 터널), 특정 CIDR을 지정하면 분할 터널이 됩니다.", - }, cheatsheet: { title: "WireGuard 빠른 참조", h0: "인터페이스 필드", @@ -1025,14 +931,6 @@ export default { tpl6: "예:", tpl7: "다이어그램에서 필드를 클릭하면 세부 정보를 볼 수 있습니다.", }, - edu: { - heading1: "프로토콜 헤더란 무엇인가요?", - p1: "프로토콜 헤더는 네트워크 패킷에서 페이로드 앞에 오는 구조화된 데이터입니다. 발신지 및 수신지 주소, 프로토콜 유형, 시퀀스 번호, 체크섬 같은 제어 정보를 담고 있습니다. 헤더 구조를 이해하는 것은 네트워크 디버깅, 패킷 분석, 프로토콜 구현에 필수적입니다.", - heading2: "이 도구 사용 방법", - p2: "탭에서 프로토콜을 선택하면 헤더 구조를 볼 수 있습니다. 각 색상 블록은 크기가 표시된 하나의 필드를 나타냅니다. 필드를 클릭하면 필드 이름과 설명, 비트/바이트 오프셋, 일반적인 값과 의미, RFC 참조 등 세부 정보를 확인할 수 있습니다. 16진수 덤프 파서를 사용하면 tcpdump나 Wireshark 같은 도구의 16진수 출력을 붙여넣어 실제 패킷 캡처를 분석할 수 있습니다.", - heading3: "일반적인 사용 사례", - p3: "캡처된 네트워크 트래픽의 구조를 이해하기 위한 패킷 분석, 네트워크 프로토콜 학습을 위한 시각적 보조 자료, 잘못된 헤더나 필드 값을 찾아내는 디버깅, 네트워크 프로토콜 구현 시 참고 자료로 활용됩니다.", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
값프로토콜
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
필드크기설명
Source Port2바이트발신 포트 번호
Dest Port2바이트수신 포트 번호
Seq Number4바이트시퀀스 번호
Ack Number4바이트확인 응답 번호
Data Offset4비트헤더 길이 / 4
Flags9비트NS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2바이트수신 윈도 크기
", @@ -1108,16 +1006,6 @@ export default { tpl0: "차이점", tpl1: "차이점 없음 (또는 빈 입력)", }, - edu: { - heading1: "텍스트 비교(Diff)란 무엇인가요?", - p1: "텍스트 비교(diffing)는 두 데이터 시퀀스를 비교하여 차이점을 식별하는 과정입니다. 추가되거나 삭제되거나 수정된 부분을 강조 표시합니다. 이는 소프트웨어 개발, 데이터 분석, 콘텐츠 관리에서 기본적인 작업으로, 시간에 따른 변경 사항을 추적하거나 문서의 여러 버전을 비교할 수 있게 해줍니다.", - heading2: "Diff 알고리즘", - p2: "대부분의 텍스트 비교 도구는 최장 공통 부분 수열(LCS) 문제를 기반으로 한 알고리즘을 사용합니다. 목표는 두 텍스트에 동일한 상대적 순서로 나타나는 요소의 가장 긴 시퀀스를 찾는 것입니다. 일반적인 구현으로는 매우 효율적이며 Git에서 사용되는 Myers diff 알고리즘과 Hunt-McIlroy 알고리즘이 있습니다. 이 알고리즘들은 한 텍스트를 다른 텍스트로 변환하는 데 필요한 최소 편집 횟수를 계산합니다.", - heading3: "사용 사례", - p3: "개발자가 풀 리퀘스트에서 정확히 무엇이 바뀌었는지 확인할 수 있는 코드 리뷰. 공간을 절약하기 위해 이력을 일련의 diff로 저장하는 Git 같은 버전 관리 시스템. 요청된 모든 변경 사항이 반영되었는지 확인하기 위해 초안을 비교하는 작가와 편집자의 콘텐츠 감사. 불일치를 찾기 위해 구성 파일이나 데이터베이스 내보내기를 비교하는 데이터 검증.", - heading4: "프로 팁", - p4: "많은 diff 도구에는 들여쓰기나 후행 공백의 변경을 무시하는 옵션이 있어 코드를 비교할 때 노이즈를 줄일 수 있습니다. 변경 사항의 영향을 이해하려면 차이 주변에 변경되지 않은 텍스트 몇 줄(컨텍스트 줄)을 포함하세요. 산문이나 자연어 문서에는 단어 단위 diff가 더 유용한 경우가 많은 반면, 코드에는 줄 단위 diff가 표준입니다.", - }, }, "regex-visualizer": { name: "정규식 시각화 도구", @@ -1168,16 +1056,6 @@ export default { tpl5: "그룹 없음", tpl6: "잘못된 정규 표현식", }, - edu: { - heading1: "정규 표현식이란 무엇인가요?", - p1: "정규 표현식(regex)은 문자열에서 문자 조합을 일치시키는 데 사용되는 강력한 패턴입니다. 프로그래밍 언어 전반에서 텍스트 처리, 검증, 데이터 추출에 필수적인 도구입니다. 정규식 패턴은 리터럴 문자와 검색 규칙을 정의하는 특수 메타 문자로 구성됩니다. 양식 검증, 로그 파싱, 검색 및 바꾸기 작업, 데이터 정제 작업에 사용됩니다.", - heading2: "이 도구 사용 방법", - p2: "입력란에 정규식 패턴을 입력하세요. 도구가 패턴 구조를 시각화하는 레일로드 다이어그램을 자동으로 생성합니다. 테스트 텍스트를 추가하면 실시간으로 일치 항목이 강조 표시되고 설명이 표시됩니다. 일반적인 패턴과 구문에 대한 빠른 참조는 치트시트를 이용하세요. 원하는 프로그래밍 언어의 코드 스니펫을 생성할 수 있습니다.", - heading3: "일반적인 사용 사례", - p3: "처리 전 사용자 입력이 올바른 이메일 형식과 일치하는지 확인하는 이메일 검증, 서버 로그에서 타임스탬프와 IP 주소를 추출하는 로그 파싱, 불필요한 문자를 제거하거나 전화번호 형식을 일관되게 맞추는 데이터 정제, 패턴 매칭을 이용한 대량 텍스트 변환을 위한 검색 및 바꾸기에 사용됩니다.", - heading4: "프로 팁", - p4: "간단하게 시작해서 점진적으로 복잡한 패턴을 만드세요. 일치 항목을 참조할 필요가 없다면 비캡처 그룹 (?:)을 사용하세요. 빈 문자열이나 특수 문자 같은 엣지 케이스를 테스트하세요. 정규식의 가독성을 고려하세요 — 복잡한 패턴은 주석으로 문서화할 수 있습니다.", - }, cheatsheet: { title: "정규식 빠른 참조", h0: "문자 클래스", @@ -1323,16 +1201,6 @@ export default { text1: "복사", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "SSH 키 소개", - p1: "SSH 키는 원격 시스템에 안전하게 인증하는 데 사용되는 한 쌍의 암호화 키입니다. 개인 키는 내 컴퓨터에 남아 있고, 공개 키는 서버에 배치됩니다. 이 비대칭 방식은 비밀번호 인증보다 훨씬 안전하며, 서버 접근, Git 호스팅, 자동화된 배포에서 업계 표준으로 사용됩니다.", - heading2: "이 도구 사용 방법", - p2: "원하는 키 유형(RSA 또는 ECDSA)을 선택하고, RSA의 경우 키 크기도 선택하세요. 키를 식별할 선택적 주석(일반적으로 user@host)을 추가할 수 있습니다. 생성 버튼을 클릭해 키 쌍을 만드세요. 공개 키를 복사해 서버에 추가하고, 개인 키는 로컬 컴퓨터에 안전하게 보관하세요.", - heading3: "일반적인 사용 사례", - p3: "원격 서버에 암호 없이 SSH 로그인하기 위한 서버 인증. 비밀번호 없이 GitHub, GitLab, Bitbucket에 인증하는 Git 호스팅. 서버에 연결해야 하는 자동화된 배포 스크립트를 위한 CI/CD 파이프라인. 안전한 점프 호스트 구성을 위한 배스천 호스트 접근.", - heading4: "프로 팁", - p4: "새로운 배포에는 Ed25519 키를 권장합니다 — RSA보다 더 빠르고 안전합니다. 항상 강력한 패스프레이즈로 개인 키를 보호하세요. 세션 중 패스프레이즈를 반복해서 입력하지 않으려면 ssh-agent를 사용하세요. 키는 권한을 600으로 설정하여 ~/.ssh/에 보관하세요.", - }, cheatsheet: { title: "SSH 키 빠른 참조", h0: "키 유형", @@ -1372,16 +1240,6 @@ export default { tpl2: "주체 대체 이름이 없습니다.", tpl3: "파싱된 확장이 없습니다.", }, - edu: { - heading1: "X.509 인증서란 무엇인가요?", - heading2: "이 도구 사용 방법", - heading3: "일반적인 사용 사례", - heading4: "프로 팁", - p1: "

X.509는 공개 키 인증서의 표준 형식으로, 공개 키를 신원(웹사이트, 조직, 개인 등)에 안전하게 결합하는 디지털 문서입니다. 이 인증서는 HTTPS를 통해 인터넷을 보호하고 이메일과 소프트웨어에 서명하는 데 사용되는 공개 키 기반 구조(PKI)의 기반입니다.

X.509 인증서에는 공개 키, 인증서 소유자의 신원, 그리고 해당 인증서를 발급한 인증 기관(CA)의 디지털 서명이 포함되어 있어 진위를 증명합니다.

", - p2: "
  1. 인증서 붙여넣기: PEM으로 인코딩된 인증서(BEGIN 및 END 헤더 포함)를 복사하여 입력란에 붙여넣으세요.
  2. 파싱: \"인증서 파싱\"을 클릭하여 데이터를 추출하고 분석하세요.
  3. 요약 검토: 상단 카드에서 일반 이름(CN), 발급자, 유효 기간을 확인하세요.
  4. 세부 정보 확인: 아래 섹션을 펼쳐 전체 Subject, Issuer, SAN, 기술적 확장을 확인하세요.
  5. 상태 확인: 상태 배지를 확인하여 인증서가 현재 유효한지 만료되었는지 확인하세요.
", - p3: "", - p4: "", - }, cheatsheet: { title: "X.509 인증서 참조", h0: "인증서 필드", @@ -1424,16 +1282,6 @@ export default { text1: "JSON 복사", text2: "XML 복사", }, - edu: { - heading1: "SAML이란 무엇인가요?", - p1: "SAML(Security Assertion Markup Language)은 당사자 간, 특히 자격 증명 공급자(IdP)와 서비스 공급자(SP) 간에 인증 및 인가 데이터를 교환하기 위한 XML 기반 공개 표준입니다. SAML은 여러 엔터프라이즈 SSO(싱글 사인온) 솔루션의 근간으로, 사용자가 하나의 자격 증명 집합으로 여러 애플리케이션에 접근할 수 있게 해줍니다. 가장 널리 쓰이는 버전은 SAML 2.0으로, 어설션을 담은 보안 토큰을 사용해 IdP와 SP 사이에 주체에 대한 정보를 전달합니다.", - heading2: "이 도구 사용 방법", - p2: "Base64로 인코딩된 SAMLResponse 또는 원시 XML을 입력란에 붙여넣으세요. Redirect 바인딩 페이로드를 디코딩하는 경우 압축 해제 시도 옵션을 켜세요. 응답 디코딩을 클릭해 메시지를 파싱하세요. 빠른 요약에서 발급자, 주체, 유효성 상태를 확인하세요. 속성 테이블에서 디코딩된 사용자 속성을 확인하세요. 탭을 사용해 정리된 XML, 어설션 세부 정보, 또는 클레임의 JSON 표현을 확인하세요.", - heading3: "일반적인 사용 사례", - p3: "만료된 어설션이나 대상 불일치를 확인하여 사용자가 로그인하지 못하는 이유를 진단하는 SSO 문제 해결. 자격 증명 공급자가 올바른 속성을 보내고 있는지 확인하는 통합 테스트. 원시 XML을 검사하고 어설션이 적절히 서명되었는지 확인하는 보안 감사. 서비스 공급자 통합 중 SAML 메시지의 내용을 빠르게 확인하는 개발.", - heading4: "프로 팁", - p4: "HTTP-Redirect로 전송되는 SAML 메시지는 보통 Base64로 인코딩되기 전에 deflate(압축)됩니다 — 디코딩이 실패하면 압축 해제 시도 체크박스를 켜보세요. AudienceRestriction이 SP의 엔터티 ID와 일치하는지 확인하세요. 응답이 유효하지 않다고 표시되면 IdP와 SP 시계 간의 시간 오차를 확인하기 위해 NotBefore와 NotOnOrAfter 시간을 확인하세요.", - }, cheatsheet: { title: "SAML 빠른 참조", h0: "SAML 흐름", @@ -1476,16 +1324,6 @@ export default { alert1: "User-Agent 문자열을 입력하세요", tpl2: "원시 분석 출력", }, - edu: { - heading1: "User-Agent란 무엇인가요?", - p1: "User-Agent는 방문하는 모든 웹사이트로 브라우저가 전송하는 문자열입니다. 브라우저 버전, 운영체제, 기기 유형을 식별하여 서버가 특정 환경에 맞게 콘텐츠를 최적화할 수 있게 해줍니다.", - heading2: "이 도구 사용 방법", - p2: "입력란에 User-Agent 문자열을 붙여넣거나 '이것 사용' 버튼을 클릭해 현재 브라우저 문자열을 분석하세요. 도구가 브라우저 엔진, OS 버전, 기기 특성을 세부적으로 분석합니다.", - heading3: "일반적인 사용 사례", - p3: "웹사이트 호환성 문제 디버깅, 봇 트래픽을 식별하기 위한 웹 서버 로그 분석, 브라우저 스푸핑 확인, 방문자의 기기 분포 파악에 사용됩니다.", - heading4: "프로 팁", - p4: "많은 최신 브라우저는 핑거프린팅을 방지하기 위해 User-Agent 문자열을 고정하거나 단순화합니다. 가장 정확한 버전 정보를 확인하려면 Version이나 Chrome 토큰을 확인하세요.", - }, }, "qr-code": { name: "QR 코드 생성기", @@ -1524,16 +1362,6 @@ export default { alert3: "복사됨!", tpl4: "디코딩할 이미지 업로드", }, - edu: { - heading1: "QR 코드란 무엇인가요?", - p1: "QR(Quick Response) 코드는 다양한 유형의 데이터, 가장 흔하게는 URL을 저장할 수 있는 2차원 바코드입니다. 스마트폰과 전용 리더기로 스캔하여 정보에 빠르게 접근하거나 작업을 실행할 수 있습니다.", - heading2: "이 도구 사용 방법", - p2: "인코딩할 텍스트나 URL을 입력하세요. 필요하면 크기와 오류 정정 수준을 조정하세요. QR 코드는 실시간으로 업데이트되며, 인쇄나 디지털 용도로 이미지로 다운로드할 수 있습니다.", - heading3: "일반적인 사용 사례", - p3: "웹사이트 링크 공유, Wi-Fi 자격 증명 제공, 디지털 명함(vCard), 이벤트 티켓 발급, 모바일 결제나 인증 흐름에 사용됩니다.", - heading4: "프로 팁", - p4: "더 높은 오류 정정 수준(H 또는 Q)을 사용하면 QR 코드가 일부 손상되거나 가려져도 스캔이 가능하여, 실물 표지판이나 브랜딩에 이상적입니다.", - }, }, "timestamp-converter": { name: "타임스탬프 변환기", @@ -1564,16 +1392,6 @@ export default { text0: "잘못된 타임스탬프", tpl1: "Unix (밀리초)", }, - edu: { - heading1: "Unix 시간이란 무엇인가요?", - p1: "Unix 시간(Epoch 시간, POSIX 시간, Unix 타임스탬프라고도 함)은 특정 시점을 설명하는 시스템입니다. 윤초를 제외하고 Unix Epoch 이후 경과된 초의 수입니다; Unix Epoch는 1970년 1월 1일 00:00:00 UTC입니다. 단일 정수이므로 컴퓨터가 저장하고 조작하기 쉬워 운영 체제와 파일 형식에서 널리 사용됩니다. 이 표준을 통해 서로 다른 시스템은 로컬 시간대 설정에 관계없이 시간을 정확하게 통신할 수 있습니다.", - heading2: "이 도구 사용 방법", - p2: "Unix에서 사람 읽기 가능 형식으로 변환: Unix 타임스탬프 필드에 타임스탬프를 입력하고 초 또는 밀리초 여부를 선택합니다. 사람 읽기 가능 형식에서 Unix로 변환: 선택기를 사용하여 날짜와 시간을 선택하고 원하는 시간대를 선택합니다. 현재 타임스탬프를 빠르게 가져오려면 지금 버튼을 사용하세요. ISO 8601, 로컬 시간, UTC, 상대 시간을 포함한 실시간 결과를 확인하세요. 결과 옆의 복사 버튼을 클릭하여 클립보드에 저장하세요.", - heading3: "일반적인 사용 사례", - p3: "서버 로그나 데이터베이스 항목에서 발견되는 암호화된 타임스탬프를 디버깅을 위해 읽기 쉬운 날짜로 변환하는 로그 분석. 백엔드가 올바른 에포크 값을 전송하는지 확인하는 API 개발. 시스템 간 이동 시 시간 기반 데이터의 일관성을 보장하는 데이터 마이그레이션. 크론 작업, 만료 날짜, 이벤트 트리거를 위한 미래 또는 과거 타임스탬프를 계산하는 스케줄링.", - heading4: "프로 팁", - p4: "JavaScript로 작업할 때 Date.now()는 밀리초를 반환하지만 표준 Unix 타임스탬프는 초 단위임을 기억하세요 — 변환하려면 1000으로 나누세요. 시스템 간 데이터 교환 시 최대 호환성을 위해 ISO 8601 형식을 항상 사용하세요. 32비트 부호 있는 정수가 오버플로되는 2038년 문제에 주의하세요; 현대 시스템은 64비트 정수를 사용하여 가까운 미래에는 이 문제를 해결합니다.", - }, }, "color-converter": { name: "색상 변환기", @@ -1589,16 +1407,6 @@ export default { badge7: "내 브라우저에서만", badge8: "개인정보 보호", }, - edu: { - heading1: "색상 모델 설명 (HEX/RGB/HSL)", - heading2: "이 도구 사용 방법", - heading3: "일반적인 사용 사례", - heading4: "프로 팁", - p1: "

색상 모델은 색상을 표현하기 위한 수학적 시스템입니다. HEX(16진수)는 HTML과 CSS에서 사용되는 6자리 코드로, 빨강, 초록, 파랑 구성 요소를 나타냅니다. RGB(빨강, 초록, 파랑)는 디지털 이미징에서 자주 사용되며 각 채널에 0에서 255까지의 십진수 값을 사용합니다.

HSL(색조, 채도, 밝기)은 기본 색상(색조), 강도(채도), 밝기(밝기)로 색상을 설명하므로 인간에게 더 직관적입니다. 이러한 모델을 이해하면 다양한 플랫폼과 기기에서 일관성을 보장하면서 디자인과 개발 요구에 맞는 올바른 형식을 선택하는 데 도움이 됩니다.

", - p2: "
  1. 채도/밝기 사각형에서 커서를 드래그하고 색조 슬라이더를 사용하여 시각적 색상 선택기로 색상을 선택하세요.
  2. 또는 \"수동 입력\" 필드에 특정 값을 입력하세요(#hex, rgb, 또는 hsl 형식 지원).
  3. \"미리보기\" 상자에서 선택한 색상을 실시간으로 확인하세요.
  4. 아래의 HEX, RGB, HSL, HSV 카드에서 변환된 값을 확인하세요.
  5. 카드의 \"복사\" 아이콘을 클릭하여 해당 형식을 클립보드에 저장하세요.
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "단위 변환기", @@ -1616,16 +1424,6 @@ export default { text0: "변환 공식을 보려면 단위를 선택하세요", text1: "유효한 숫자를 입력하세요", }, - edu: { - heading1: "측정 시스템 개요", - p1: "측정 시스템은 측정 단위의 모음과 그것들을 서로 연결하는 규칙입니다. 가장 일반적인 두 가지 시스템은 미터법(국제 단위계 또는 SI)과 야드-파운드법입니다. 미터법은 10의 거듭제곱을 기반으로 하여 매우 논리적이고 확장하기 쉽습니다. 주로 미국에서 사용되는 야드-파운드법은 인치, 피트, 파운드 같은 단위를 사용하며 역사적 기원과 덜 균일한 변환 계수를 가집니다. 이러한 시스템 간의 차이를 이해하는 것은 과학, 공학, 국제 무역, 요리나 여행 같은 일상적인 작업에 필수적입니다.", - heading2: "이 도구 사용 방법", - p2: "상단의 격자에서 측정 카테고리(예: 길이, 무게, 온도)를 선택합니다. 출발 드롭다운 메뉴에서 변환할 단위를 선택합니다. 입력 필드에 변환하려는 값을 입력합니다. 도착 드롭다운 메뉴에서 대상 단위를 선택합니다. 변환된 값이 변환에 사용된 수학 공식과 함께 즉시 나타납니다.", - heading3: "일반적인 사용 사례", - p3: "킬로미터를 마일로 또는 섭씨를 화씨로 변환하는 여행. 미터법(그램/밀리리터)과 야드-파운드법(온스/컵) 측정 간에 레시피를 변환하는 요리. 압력, 에너지 또는 속도의 다양한 단위 간 정밀 변환을 위한 공학 및 과학. 메가바이트, 기가바이트, 테라바이트의 차이를 이해하는 디지털 스토리지.", - heading4: "프로 팁", - p4: "선택한 단위 사이의 변환 방향을 빠르게 바꾸려면 교환 버튼을 사용하세요. 특히 볼륨과 무게의 경우 특정 단위 유형을 항상 두 번 확인하세요, 미국 대 영국 갤런처럼 이름이 서로 다른 시스템에서 유사할 수 있습니다. 일련의 여러 변환을 수행할 때는 누적 반올림 오류를 피하기 위해 최종 결과까지 가능한 많은 소수점 자리를 유지하세요.", - }, }, "yaml-toml-converter": { name: "YAML/TOML 변환기", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ TOML 변환 실패:", tpl7: "변환 대기.", }, - edu: { - heading1: "YAML vs TOML vs JSON 비교", - p1: "JSON은 단순함과 JavaScript의 네이티브 지원 덕분에 데이터 교환에 가장 널리 사용되는 형식입니다. YAML(YAML Ain't Markup Language)은 들여쓰기로 구조를 표현하는 사람 친화적인 데이터 직렬화 표준으로, 복잡한 구성 파일에서 널리 사용됩니다. TOML(Tom's Obvious, Minimal Language)은 명확한 문법 덕분에 읽고 쓰기 쉽게 설계되었으며 프로젝트 구성에 자주 사용됩니다. JSON이 엄격하고 간결한 반면, YAML과 TOML은 가독성과 수동 편집의 용이성을 우선시합니다.", - heading2: "이 도구 사용 방법", - p2: "구성 데이터(JSON, YAML, TOML)를 왼쪽의 원본 텍스트 영역에 붙여넣으세요. 도구가 원본 형식을 자동으로 감지하거나, 드롭다운에서 직접 선택할 수도 있습니다. 변환 없이 구문 오류만 확인하려면 유효성 검사만 클릭하세요. 변환 버튼(JSON으로, YAML으로, TOML으로) 중 하나를 클릭하면 데이터가 해당 형식으로 변환됩니다. 오른쪽 출력 패널에서 결과를 확인하고 복사를 클릭해 클립보드에 저장하세요.", - heading3: "일반적인 사용 사례", - p3: "Kubernetes 매니페스트, Docker Compose 파일, AWS CloudFormation 템플릿 작업 시 JSON과 YAML 사이를 변환하는 인프라 as 코드. package.json(JSON)과 pyproject.toml 또는 Cargo.toml(TOML) 사이의 설정을 마이그레이션하는 프로젝트 구성. 복잡한 데이터 구조가 다른 형식에서 어떻게 보이는지 빠르게 시각화하는 API 프로토타이핑. 데이터 무결성을 유지하면서 오래된 구성 파일을 최신 형식으로 변환하는 레거시 마이그레이션.", - heading4: "프로 팁", - p4: "복잡한 중첩 구조의 가독성이 유지보수에 필수적인 CI/CD 파이프라인에는 YAML을 사용하세요. 수동으로 편집해야 할 수도 있는 최종 사용자에게 깔끔한 인터페이스를 제공하려면 애플리케이션 수준 구성 파일에는 TOML을 선호하세요. YAML을 JSON으로 변환할 때는 YAML 타입 강제 변환 문제(예: NO가 false로 해석될 수 있음)에 유의하고 데이터 타입이 올바르게 유지되는지 확인하세요.", - }, cheatsheet: { title: "형식 비교", h0: "구문 차이", @@ -1719,16 +1507,6 @@ export default { text1: "복사", text2: "복사됨!", }, - edu: { - heading1: "htpasswd란 무엇인가요?", - p1: "

htpasswd 파일은 Apache와 Nginx 웹 서버에서 기본 인증을 위해 사용자 이름과 해시된 비밀번호를 저장하는 플랫 파일 데이터베이스입니다. 전체 데이터베이스 기반 인증 시스템 없이도 웹사이트의 특정 디렉터리나 관리자 패널을 보호하는 간단하면서도 효과적인 방법입니다.

htpasswd 파일의 각 줄은 하나의 사용자를 나타내며 username:hashed_password 형식을 따릅니다.

", - heading2: "이 도구 사용 방법", - p2: "
  1. 사용자 이름 입력: 인증에 사용할 사용자 이름을 입력하세요.
  2. 비밀번호 입력: 비밀번호를 입력하거나 강력한 비밀번호 생성을 클릭해 안전한 비밀번호를 만드세요.
  3. 알고리즘 선택: 최신 보안에는 Bcrypt (-B)를, 레거시 호환성에는 Apache MD5 (-m)를 선택하세요.
  4. 생성: 항목 생성을 클릭해 해시 문자열을 만드세요.
  5. 복사 또는 다운로드: 결과 줄을 클립보드에 복사하거나 파일로 다운로드하여 서버에 업로드하세요.
", - heading3: "일반적인 사용 사례", - p3: "", - heading4: "프로 팁", - p4: "", - }, }, "mock-data-generator": { name: "목 데이터 생성기", @@ -1762,16 +1540,6 @@ export default { text1: "복사", text2: "미리 볼 행이 없습니다.", }, - edu: { - heading1: "목 데이터란 무엇인가요?", - p1: "

목 데이터는 민감하거나 개인 식별 정보(PII)를 포함하지 않고 실제 데이터를 모방하는 합성 정보입니다. GDPR이나 CCPA 같은 개인정보 규정을 위반하거나 데이터 침해 위험 없이 애플리케이션을 구축하고 검증하기 위한 현실적인 데이터셋이 필요한 개발자와 테스터에게 필수적입니다. 목 데이터를 사용하면 표준 사용자 프로필에서 엣지 케이스까지 다양한 시나리오를 시뮬레이션하여 소프트웨어가 모든 유형의 입력을 올바르게 처리하도록 할 수 있습니다.

", - heading2: "테스트 전략", - p2: "

효과적인 테스트는 다양한 데이터셋을 필요로 합니다. 개발 데이터베이스를 시드하거나, 수천 개의 레코드로 부하 테스트를 수행하거나, 다양한 문자열 길이로 UI 레이아웃을 검증하기 위해 목 데이터를 사용하세요. 외부 API에서 예측 가능한 응답이 필요한 통합 테스트에 특히 유용합니다. 로컬에서 데이터를 생성함으로써 재설정하고 재현하기 쉬운 일관된 테스트 환경을 만들어 더 신뢰할 수 있고 빠른 개발 주기를 이끌 수 있습니다.

", - heading3: "목에서의 데이터 프라이버시", - p3: "

프라이버시는 현대 소프트웨어 개발에서 최우선 사항입니다. 개발 또는 스테이징 환경에서 실제 프로덕션 데이터를 사용하는 것은 주요 보안 위험입니다. 목 데이터 생성기는 가짜이지만 구조적으로 올바른 데이터를 생성하여 이를 해결합니다. 이 도구는 브라우저 내에서 완전히 실행되므로 구성 및 생성된 데이터는 기기를 떠나지 않습니다. 이 프라이버시 우선 접근 방식은 목 데이터 생성 과정 자체도 가장 엄격한 보안 표준에 안전하고 준수하는 것을 보장합니다.

", - heading4: "프로 팁", - p4: "", - }, cheatsheet: { title: "목 데이터 필드 유형", h0: "사용 가능한 유형", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "네이밍 컨벤션 해설 (camelCase/snake_case 등)", - heading2: "이 도구 사용 방법", - heading3: "일반적인 사용 사례", - heading4: "프로 팁", - p1: "

네이밍 컨벤션은 소스 코드와 문서에서 변수, 타입, 함수 등의 개체를 나타내는 식별자에 사용할 문자 시퀀스를 선택하는 규칙 집합입니다. camelCase(예: myVariable)는 소문자로 시작하고 이후 각 단어의 첫 글자를 대문자로 씁니다. snake_case(예: my_variable)는 밑줄로 단어를 구분합니다.

PascalCase(예: MyVariable)는 모든 단어의 첫 글자를 대문자로 쓰고, kebab-case(예: my-variable)는 하이픈으로 단어를 구분합니다. 이러한 컨벤션은 단순히 미관의 문제가 아니라 코드 가독성, 유지보수성, 그리고 다양한 프로그래밍 언어와 프레임워크의 관용적 표준을 따르는 데 매우 중요합니다.

", - p2: "
  1. 페이지 상단의 \"입력 텍스트\" 영역에 텍스트를 입력하거나 붙여넣으세요.
  2. 도구가 입력을 실시간으로 12가지 이상의 케이스 스타일로 자동 변환합니다.
  3. \"변환 결과\" 그리드를 스크롤하여 필요한 케이스 스타일을 찾으세요.
  4. 결과 옆의 \"복사\" 아이콘을 클릭하여 클립보드에 저장하세요.
  5. \"지우기\" 버튼을 사용해 모든 입력을 지우고 새로 변환을 시작하세요.
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "코드 압축기", @@ -1913,16 +1671,6 @@ export default { text2: "📋 복사", tpl3: "모든 처리는 브라우저에서 이루어집니다. 코드가 기기를 떠나지 않습니다.", }, - edu: { - heading1: "축소(Minification)란 무엇인가요?", - heading2: "이 도구 사용 방법", - heading3: "일반적인 사용 사례", - heading4: "프로 팁", - p1: "

축소(Minification)는 기능을 변경하지 않고 소스 코드에서 불필요한 문자를 모두 제거하는 과정입니다. 여기에는 공백, 줄바꿈, 주석 제거와 때로는 변수 이름 단축이 포함됩니다. 목표는 코드의 파일 크기를 줄여 네트워크를 통해 전송해야 하는 데이터양을 줄이는 것입니다.

이를 통해 페이지 로드 시간이 빨라지고 웹 애플리케이션의 성능이 향상됩니다. 축소는 프로덕션 환경에 필수적이지만 사람이 읽고 디버깅하기가 거의 불가능해집니다. 따라서 일반적으로 실제 서버에 배포하기 전 빌드 프로세스의 마지막 단계로 수행됩니다.

", - p2: "
  1. 상단 탭에서 프로그래밍 언어(JavaScript, CSS, HTML, JSON)를 선택하세요.
  2. 왼쪽의 \"입력 코드\" 텍스트 영역에 소스 코드를 붙여넣으세요.
  3. \"코드 축소\" 버튼을 클릭하여 프로덕션용으로 파일 크기를 줄이세요.
  4. 또는 \"코드 정리\"를 클릭하여 들여쓰기와 서식을 추가해 가독성을 높이세요.
  5. \"출력 코드\" 영역에서 결과를 확인하고 \"복사\" 또는 \"다운로드\"를 클릭해 최적화된 코드를 저장하세요.
", - p3: "", - p4: "", - }, }, "image-converter": { name: "이미지 변환기", @@ -1969,16 +1717,6 @@ export default { alert2: "파일 읽기 오류.", tpl3: "Canvas API를 사용한 클라이언트 측 처리 - 업로드 없음, 즉시 결과", }, - edu: { - heading1: "이미지 형식 비교 (PNG/JPEG/WebP)", - p1: "

올바른 이미지 형식을 선택하는 것은 웹 성능과 시각적 품질에 매우 중요합니다. JPEG는 손실 압축을 사용해 작은 파일 크기를 달성하므로 사진이나 색상이 많은 복잡한 이미지에 가장 적합합니다. PNG는 무손실 압축을 사용하므로 투명도가 필요하거나 선명한 윤곽과 단색(로고, 아이콘 등)이 있는 이미지에 이상적입니다.

WebP는 우수한 손실 및 무손실 압축을 제공하는 최신 형식으로, 높은 품질을 유지하면서 JPEG나 PNG보다 파일 크기를 훨씬 작게 만드는 경우가 많습니다.

", - heading2: "이 도구 사용 방법", - p2: "
  1. 이미지 업로드 영역에 파일을 드롭하거나 클릭하여 파일을 찾아 업로드하세요.
  2. 변환 형식 옵션에서 원하는 출력 형식(PNG, JPG, WebP)을 선택하세요.
  3. JPG나 WebP 같은 손실 형식을 선택했다면 품질 슬라이더로 파일 크기와 시각적 품질의 균형을 맞추세요.
  4. 선택적으로 이미지 크기 조정 설정을 사용해 비율이나 특정 크기로 이미지 크기를 조정하세요.
  5. 변환 & 크기 조정을 클릭한 후 다운로드하여 최적화된 자산을 저장하세요.
", - heading3: "일반적인 사용 사례", - p3: "", - heading4: "프로 팁", - p4: "", - }, }, "css-gradient": { name: "CSS 그라데이션 생성기", @@ -2018,16 +1756,6 @@ export default { alert2: "CSS 클립보드 복사 실패", tpl3: "로딩 화면 및 오버레이", }, - edu: { - heading1: "CSS 그라디언트란 무엇인가요?", - heading2: "선형 vs 방사형 vs 원뿔형 그라디언트", - heading3: "브라우저 지원 및 성능", - heading4: "더 나은 그라디언트를 위한 프로 팁", - p1: "

CSS 그라디언트는 지정된 두 개 이상의 색상 사이에 부드러운 전환을 표시할 수 있는 강력한 기능입니다. 전통적인 배경 이미지와 달리 그라디언트는 브라우저에서 생성되므로 무한히 확장 가능하고, 대역폭을 덜 사용하며, 코드로 쉽게 조작할 수 있습니다. 웹 디자인에 깊이감과 시각적 흥미를 더하기 위해 배경, 버튼, 장식 요소에 흔히 사용됩니다.

", - p2: "

CSS 그라디언트에는 세 가지 주요 유형이 있습니다:

", - p3: "

최신 CSS 그라디언트는 Chrome, Firefox, Safari, Edge를 포함한 모든 주요 브라우저에서 널리 지원됩니다. 브라우저 엔진이 수학적으로 렌더링하기 때문에 고해상도 이미지에 비해 성능이 매우 뛰어납니다. 다만 색상 정지점이 수십 개인 매우 복잡한 그라디언트라면 저사양 기기에서 성능을 테스트하는 것이 좋습니다. 구형 브라우저(IE9 이하 등)에서는 단색 대체값을 제공하는 것이 권장됩니다.

", - p4: "", - }, }, "curl-studio": { name: "cURL 스튜디오", @@ -2096,16 +1824,6 @@ export default { text2: "복사됨!", tpl3: "마스킹 후 로그가 여기에 표시됩니다...", }, - edu: { - heading1: "PII란 무엇인가요?", - p1: "

개인 식별 정보(PII)는 특정 개인을 식별하는 데 사용할 수 있는 모든 데이터입니다. 여기에는 이름, 이메일 주소, 전화번호 같은 직접 식별자뿐 아니라 IP 주소, 위치, 신용카드 번호 같은 간접 식별자도 포함됩니다. 서버 로그의 맥락에서 PII는 요청 매개변수, 헤더, 오류 메시지에 흔히 나타납니다.

PII를 보호하는 것은 현대 데이터 보안의 핵심 요소이며 전 세계 다양한 법적 프레임워크에서 요구하고 있습니다.

", - heading2: "규정 준수 요건 (GDPR/CCPA)", - p2: "

유럽의 일반 데이터 보호 규정(GDPR)이나 미국의 캘리포니아 소비자 개인정보 보호법(CCPA) 같은 규제는 개인 데이터 처리 방식에 엄격한 규칙을 부과합니다. 이러한 법률은 조직이 설계 단계부터 프라이버시를 고려하고 개인 데이터의 수집 및 저장을 최소화하도록 요구합니다.

PII가 포함된 원시 로그를 제3자 지원 팀이나 개발자와 공유하면 규정 위반으로 이어질 수 있습니다. 안전한 환경을 벗어나기 전에 이 데이터를 마스킹하거나 삭제하는 것은 규정 준수를 유지하는 핵심 단계입니다.

", - heading3: "마스킹 전략", - p3: "

로그의 민감한 데이터를 처리하는 방법에는 여러 가지가 있습니다:

이 도구는 패턴 매칭을 사용해 일반적인 PII 형식을 즉시 찾아 바꾸는 삭제 방식에 중점을 둡니다.

", - heading4: "프로 팁", - p4: "", - }, }, "mermaid-studio": { name: "Mermaid 스튜디오", @@ -2306,16 +2024,6 @@ export default { text51: "아직 추출된 URL이 없습니다.", text52: "아직 라우팅 정보가 없습니다.", }, - edu: { - heading1: "이메일 인증 해설", - heading2: "SPF/DKIM/DMARC", - heading3: "피싱 탐지", - heading4: "프로 팁", - p1: "

이메일 인증은 이메일 메시지의 출처에 대해 검증 가능한 정보를 제공하는 데 사용되는 기술의 모음입니다. 발신자의 신원을 검증함으로써 이 프로토콜들은 메일 서버가 정상적인 메시지와 스푸핑되거나 사기성(피싱 등) 메시지를 구분하는 데 도움을 줍니다. 현대 이메일 인증의 세 가지 축은 SPF, DKIM, DMARC입니다.

이메일이 수신되면 수신 서버가 이러한 검사를 수행하고 결과를 이메일 헤더에 기록하며, 이 도구는 그 헤더를 파싱해 보여줍니다.

", - p2: "", - p3: "

피싱 이메일은 신뢰할 수 있는 출처에서 온 것처럼 보이기 위해 \"스푸핑\"을 자주 사용합니다. 이 분석기는 \"From\" 주소(사용자가 보는 것)와 \"Return-Path\"(메일이 실제로 온 곳) 간의 불일치 같은 일반적인 위험 신호를 찾습니다. 또한 이메일 본문의 URL을 추출하고 분석하여 Punycode(유사 도메인)나 호스트명 대신 IP 주소를 사용하는 등 의심스러운 링크를 식별합니다.

\"발견 사항\" 섹션을 검토하면 이러한 신호를 빠르게 파악하고 이메일과 상호작용해도 안전한지 판단할 수 있습니다.

", - p4: "", - }, cheatsheet: { title: "이메일 인증 빠른 참조", h0: "이 검사들이 의미하는 것", @@ -2491,16 +2199,6 @@ export default { text9: "먼저 SQL을 붙여넣으세요.", text10: "✓ 복사됨", }, - edu: { - heading1: "SQL을 포맷팅해야 하는 이유", - p1: "SQL은 여러 조인, 서브쿼리, 중첩 조건을 다룰 때 특히 빠르게 복잡해지고 읽기 어려워질 수 있습니다. SQL 포맷팅에는 일관된 들여쓰기, 줄바꿈, 키워드 대문자화가 포함됩니다. 이를 통해 쿼리의 로직을 훨씬 쉽게 파악할 수 있어 디버깅, 코드 리뷰, 대규모 데이터베이스 스키마의 장기적인 유지보수에 필수적입니다. 잘 포맷된 쿼리는 수동 편집 중 논리적 오류가 발생할 가능성도 낮아집니다.", - heading2: "이 도구 사용 방법", - p2: "왼쪽의 SQL 입력 편집기에 원본 SQL 쿼리를 붙여넣으세요. 데이터베이스 방언(Postgres 또는 MySQL)과 원하는 키워드 대소문자(대문자 또는 소문자)를 선택하세요. 포맷 버튼을 클릭하여 적절한 들여쓰기와 간격으로 쿼리를 정리하세요. 검증 버튼을 사용해 닫히지 않은 따옴표나 불균형한 괄호 같은 일반적인 구조적 문제를 확인하세요. 복사를 클릭해 포맷된 SQL을 클립보드에 저장하거나 지우기로 다시 시작하세요.", - heading3: "일반적인 사용 사례", - p3: "풀 리퀘스트 제출 전 지저분한 SQL을 정리하는 코드 리뷰. ORM이 생성한 쿼리를 정리하여 데이터베이스에 실제로 실행되는 내용을 정확히 파악하는 디버깅. 기술 가이드, 위키, README 파일을 위한 명확하고 읽기 쉬운 예제를 만드는 문서화. 오래되고 정리되지 않은 스크립트를 최신의 읽기 쉬운 스타일로 빠르게 리팩터링하는 레거시 정리.", - heading4: "프로 팁", - p4: "WITH 절과 함께 공통 테이블 표현식(CTE)을 사용해 복잡한 쿼리를 더 작고 관리하기 쉬운 부분으로 나누세요. 쿼리의 의도를 명확히 하기 위해 테이블과 열에는 항상 설명적인 별칭을 사용하세요. 구성 파일이나 명령줄 도구에서 사용하기 위해 SQL을 한 줄로 압축해야 한다면 축소 버튼을 사용하세요.", - }, cheatsheet: { title: "SQL 포맷팅 팁", h0: "빠른 개선 포인트", @@ -2569,16 +2267,6 @@ export default { text15: "참고: 안전을 위해 값은 마스킹됩니다. Diff는 휴리스틱이며 주석/순서는 포함하지 않습니다.", text16: "✓ 복사됨", }, - edu: { - heading1: "환경 변수 모범 사례", - heading2: "비밀 관리", - heading3: ".env 보안", - heading4: "프로 팁", - p1: "

환경 변수는 코드와 설정을 엄격히 분리할 것을 주장하는 \"Twelve-Factor App\" 방법론의 핵심 요소입니다. 환경 변수를 사용하면 설정 값만 변경하여 동일한 코드를 여러 환경(개발, 스테이징, 프로덕션)에서 실행할 수 있습니다.

모범 사례로는 설명적인 대문자 이름 사용(예: DATABASE_URL), 중요하지 않은 설정에 대한 기본값 제공, 그리고 민감한 정보를 소스 관리에 직접 하드코딩하지 않는 것이 있습니다.

", - p2: "

비밀(Secret)은 API 키, 데이터베이스 비밀번호, 개인 인증서 같은 민감한 정보를 담는 특수한 범주의 환경 변수입니다. 이를 안전하게 관리하는 것은 데이터 유출을 방지하는 데 매우 중요합니다. 프로덕션 환경에서는 AWS Secrets Manager, HashiCorp Vault, Cloudflare Secrets 같은 전용 비밀 관리 서비스를 사용해야 합니다.

로컬 개발에서는 .env 파일이 흔히 사용되지만, git 저장소에 절대 커밋해서는 안 됩니다. .gitignore 파일에 항상 *.env를 추가하세요.

", - p3: "

디버깅을 위해 .env 파일을 팀원과 공유할 때는 프로덕션 비밀이 실수로 노출될 위험이 큽니다. 이 도구는 \"민감한 값 마스킹\" 기능을 제공하여 이러한 위험을 줄여줍니다. 휴리스틱을 사용해 SECRET, TOKEN, PASSWORD 같은 키를 식별하고 값을 마스킹된 버전(예: ab...yz (32))으로 대체합니다.

이를 통해 실제 비밀을 유출하지 않고도 환경 파일의 구조와 민감하지 않은 값을 비교할 수 있습니다.

", - p4: "", - }, cheatsheet: { title: "Dotenv 참고 사항", h0: "마스킹 전략", @@ -2638,16 +2326,6 @@ export default { text7: "아직 미리보기가 없습니다.", text8: "✓ 복사됨", }, - edu: { - heading1: "SVG란 무엇인가요?", - p1: "SVG(Scalable Vector Graphics)는 상호작용과 애니메이션을 지원하는 2차원 그래픽을 위한 XML 기반 벡터 이미지 형식입니다. JPEG나 PNG 같은 래스터 형식과 달리 SVG는 수학적 경로로 정의되므로 품질 손실 없이 어떤 크기로도 확대할 수 있습니다. 덕분에 로고, 아이콘, 일러스트에 이상적이며, 모바일 화면부터 고해상도 데스크톱 모니터까지 선명하게 유지됩니다.", - heading2: "이 도구 사용 방법", - p2: "왼쪽의 SVG 입력 텍스트 영역에 SVG 코드를 붙여넣으세요. 미리보기를 클릭해 그래픽을 확인하고 색상 팔레트를 추출하세요. 최적화 또는 축소 버튼을 사용해 마크업을 정리하고 파일 크기를 줄이세요. 선택적으로 색상 패널에 새 값을 입력하고 적용을 클릭해 특정 색상을 바꾸세요. 복사 또는 다운로드를 클릭해 정제되고 최적화된 SVG를 저장하세요.", - heading3: "일반적인 사용 사례", - p3: "Figma나 Illustrator 같은 디자인 도구에서 내보낸 SVG를 정리하는 아이콘 관리. 브랜드 팔레트에 맞게 아이콘 세트의 색상을 빠르게 변경하는 테마 설정. 신뢰할 수 없는 출처의 SVG에서 잠재적 스크립트나 외부 참조를 제거하는 보안. 인라인 그래픽의 크기를 줄이고 페이지 로드 시간을 개선하기 위해 SVG 마크업을 축소하는 성능 최적화.", - heading4: "프로 팁", - p4: "currentColor 버튼을 사용해 명시적인 fill과 stroke를 모두 currentColor로 변환하면 CSS로 SVG 스타일을 쉽게 지정할 수 있습니다. 프로덕션에서 사용하기 전에 항상 SVG를 최적화하여 가능한 한 작게 만드세요. 디자인 도구에서 SVG를 만들 때는 최적화 전에 윤곽선(Outline Stroke)과 경로 단순화(Simplify Path) 기능을 사용해 생성된 코드의 복잡도를 줄이세요.", - }, cheatsheet: { title: "SVG 보안 참고 사항", h0: "정제(Sanitization)", @@ -2801,16 +2479,6 @@ export default { text28: "스캔을 클릭해 시크릿을 찾으세요.", text29: "✓ 복사됨", }, - edu: { - heading1: "비밀 유출이란 무엇인가요?", - p1: "비밀 유출은 API 키, 비밀번호, 개인 토큰 같은 민감한 정보가 실수로 버전 관리에 커밋되거나 공개 포럼에 공유될 때 발생합니다. 이러한 유출은 무단 접근, 데이터 유출, 금전적 손실로 이어질 수 있습니다. 이 도구는 코드를 공유하거나 커밋하기 전에 브라우저에서 로컬로 일반적인 비밀 패턴을 식별하는 데 도움을 줍니다.", - heading2: "이 도구 사용 방법", - p2: "입력란에 코드, 구성, 또는 로그 파일을 붙여넣으세요. 스캔 버튼을 클릭해 텍스트에서 잠재적인 비밀을 분석하세요. 감지된 각 항목에 대한 발견 사항과 권장 사항을 검토하세요. 삭제된 내용 복사 버튼을 사용해 비밀이 마스킹된, 공유해도 안전한 텍스트 버전을 얻으세요.", - heading3: "일반적인 사용 사례", - p3: "커밋 전 코드를 스캔하여 비밀이 포함되지 않았는지 확인하는 커밋 전 검사. 지원팀이나 팀원과 공유하기 전에 로그의 민감한 토큰을 마스킹하는 로그 삭제. 하드코딩된 자격 증명이 있는지 구성 파일을 빠르게 감사하는 보안 감사.", - heading4: "프로 팁", - p4: "자격 증명이 유출된 것을 발견하면 항상 즉시 교체하세요. 소스 코드에 비밀을 하드코딩하는 대신 환경 변수나 비밀 관리자를 사용하세요. 더 철저한 스캔을 위해 낮은 심각도 패턴 포함을 활성화할 수 있지만, 오탐이 늘어날 수 있음을 감안하세요.", - }, cheatsheet: { title: "비밀을 발견했을 때 해야 할 일", h0: "즉시 취해야 할 조치", @@ -2907,16 +2575,6 @@ export default { text15: "✓ 유효한 JWKS 구조 (", text16: "JWK를 붙여넣으세요.", }, - edu: { - heading1: "JWT란 무엇인가요?", - p1: "JSON 웹 토큰(JWT)은 두 당사자 사이에 전달할 클레임을 표현하는 간결하고 URL에 안전한 방식입니다. JWT는 점으로 구분된 Base64URL로 인코딩된 세 부분, 즉 헤더(알고리즘과 타입), 페이로드(클레임), 서명으로 구성됩니다. 서명은 토큰이 변조되지 않았음을 보장합니다. JWT는 웹 API에서 인증과 정보 교환에 흔히 사용됩니다. 표준 클레임에는 sub(주체), iss(발급자), aud(대상), exp(만료), nbf(유효 시작), iat(발급 시간), jti(JWT ID)가 있습니다.", - heading2: "JWT 알고리즘", - p2: "HS256/384/512는 SHA-2와 공유 비밀을 사용하는 HMAC을 사용합니다 — 단순하지만 양쪽 모두 같은 키를 가지고 있어야 합니다. RS256/384/512는 RSA PKCS#1 v1.5 비대칭 서명을 사용합니다 — 서비스가 공개 키만 있으면 되는 마이크로서비스 아키텍처에 이상적입니다. ES256/384/512는 NIST 곡선을 사용하는 ECDSA로 동등한 보안 수준에서 RSA보다 서명 크기가 작습니다. PS256/384/512는 RSA-PSS를 사용하는 확률적 변형으로, 최신 시스템에서 RS* 계열보다 선호됩니다.", - heading3: "JWK와 JWKS", - p3: "JSON 웹 키(JWK)는 암호화 키를 나타내는 JSON 구조입니다. JWK 세트(JWKS)는 keys 속성 아래에 JWK 배열을 담은 JSON 구조입니다. 서비스는 잘 알려진 URL(예: /.well-known/jwks.json)에 JWKS를 공개하여, 클라이언트가 별도의 키 교환 없이도 JWT 검증에 필요한 공개 키를 가져올 수 있게 합니다. JWKS의 키는 JWT 헤더가 참조하는 kid(키 ID)로 식별됩니다.", - heading4: "보안 모범 사례", - p4: "exp, nbf, iss, aud 클레임은 항상 서버 측에서 검증하세요. 프로덕션에서는 절대 alg: none 알고리즘을 사용하지 마세요 — 모든 서명 보호가 사라집니다. 여러 서비스가 토큰을 검증해야 한다면 HMAC보다 비대칭 알고리즘(RS*, ES*, PS*)을 선호하세요. 키를 정기적으로 교체하고 kid를 사용해 각 토큰에 서명한 키를 식별하세요. 개인 키는 안전하게 보관하고 버전 관리에 절대 커밋하지 마세요. 수명이 긴 JWT보다는 짧은 만료 시간과 리프레시 토큰을 사용하세요.", - }, }, "encoding-workbench": { name: "인코딩 워크벤치", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "인식 가능한 인코딩 레이어를 찾지 못했습니다.", }, - edu: { - heading1: "인코딩과 해싱의 차이", - heading2: "이 도구 사용 방법", - heading3: "다층 인코딩 설명", - heading4: "해시 알고리즘 가이드", - p1: "

인코딩은 데이터를 되돌릴(디코딩할) 수 있는 다른 표현으로 변환합니다. 일반적인 형식으로는 텍스트 채널을 통해 바이너리 데이터를 전송하는 데 사용되는 Base64, URL 인코딩, HTML 엔티티 인코딩, 16진수가 있습니다. 인코딩은 암호화가 아니며 기밀성을 제공하지 않습니다.

해싱은 단방향 수학적 변환입니다. 암호화 해시 함수는 어떤 입력이든 받아 고정 길이의 지문을 생성합니다. 해시를 역산하여 원본 입력을 얻을 수 없습니다. 해시는 파일 무결성 검증, 안전한 비밀번호 저장, 디지털 서명 생성에 사용됩니다.

", - p2: "
  1. 인코딩 / 디코딩 탭: 텍스트를 붙여넣고 작업(Base64, URL, HTML, Hex)을 선택하거나, 자동 계층 감지를 클릭하여 중첩된 여러 인코딩을 자동으로 풀어보세요.
  2. 해시 탭: 텍스트를 입력하거나 파일을 선택하고 알고리즘을 선택한 후 모두 해시를 클릭하세요. HMAC 모드를 활성화하면 공유 비밀로 키드 해시를 계산할 수 있습니다.
  3. 식별 탭: 알 수 없는 해시나 인코딩된 문자열을 붙여넣고 식별을 클릭하여 신뢰도와 함께 가능성 있는 알고리즘을 확인하세요.
", - p3: "

실제 데이터는 여러 번 인코딩되는 경우가 많습니다. 예를 들어 페이로드가 URL 인코딩된 후 Base64로 인코딩되고, 다시 16진수 문자열 안에 들어갈 수 있습니다. 자동 계층 감지 기능은 입력 패턴을 검사하고 각 디코딩을 순서대로 시도하며, 각 단계를 카드로 시각화하여 데이터가 정확히 어떻게 감싸져 있었는지 확인할 수 있게 합니다.

", - p4: "", - }, }, "oauth-debugger": { name: "OAuth 디버거", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "PKCE란 무엇이며 왜 중요한가요?", - p1: "

PKCE(Proof Key for Code Exchange, RFC 7636)는 원래 클라이언트 시크릿을 안전하게 저장할 수 없는 모바일 및 네이티브 앱을 위해 설계되었습니다. 클라이언트가 무작위 code_verifier를 생성하고, 이로부터 code_challenge를 도출(SHA-256 + base64url)한 다음, 인증 요청과 함께 챌린지를 전송하는 방식으로 작동합니다. 인증 코드를 토큰으로 교환할 때 클라이언트는 원래의 code_verifier를 전송합니다. 인증 서버는 이것이 이전 챌린지와 일치하는지 검증하여, 토큰 요청이 흐름을 시작한 것과 동일한 클라이언트에서 왔음을 증명합니다.

클라이언트 시크릿을 가진 기밀 클라이언트(서버 측 앱)라도, OAuth 2.1은 이제 인증 코드 가로채기 공격에 대한 방어책으로 PKCE 사용을 권장합니다.

", - heading2: "암묵적 흐름은 왜 지원이 중단되었나요?", - p2: "

암묵적 흐름(response_type=token)은 액세스 토큰을 URL 프래그먼트에 직접 반환하는, 싱글 페이지 앱을 위한 지름길로 설계되었습니다. 이는 심각한 문제를 일으킵니다. URL의 토큰이 브라우저 기록, 서버 로그, 리퍼러 헤더에 남으며, 이 흐름은 토큰 주입 공격에도 취약합니다. OAuth 2.0 보안 모범 사례(RFC 9700)와 OAuth 2.1은 암묵적 흐름을 명시적으로 제거하고, 클라이언트 시크릿 없이도 SPA가 안전하게 사용할 수 있는 인증 코드 + PKCE를 대신 권장합니다.

", - heading3: "OAuth 2.1의 주요 변경 사항", - p3: "", - heading4: "인증 코드 흐름 단계별 설명", - p4: "
  1. PKCE 쌍 생성: 무작위 code_verifier를 만들고 code_challenge = BASE64URL(SHA256(code_verifier))를 계산합니다.
  2. 인증 엔드포인트로 리다이렉트: response_type=code, client_id, redirect_uri, scope, state, code_challenge, code_challenge_method=S256을 포함합니다.
  3. 인증 서버에서 사용자가 인증하고 동의를 부여합니다.
  4. 반환된 state와 함께 redirect_uri에서 인증 코드를 수신합니다 — state가 보낸 값과 일치하는지 확인하세요.
  5. 코드를 토큰으로 교환: 토큰 엔드포인트에 grant_type=authorization_code, code, redirect_uri, client_id, code_verifier와 함께 POST 요청을 보냅니다.
  6. 액세스 토큰을 수신하고(선택적으로 id_token과 refresh_token도) API 호출에 사용합니다.
", - }, }, "ladder-game": { name: "사다리 타기", diff --git a/src/i18n/pt.js b/src/i18n/pt.js index 890a785..7d88712 100644 --- a/src/i18n/pt.js +++ b/src/i18n/pt.js @@ -90,16 +90,6 @@ export default { text7: "✓ Copiado", tpl8: "Profundidade máxima", }, - edu: { - heading1: "O que é JSON?", - p1: "

JSON (JavaScript Object Notation) é um formato leve de troca de dados, fácil de ler e escrever para humanos e fácil de analisar e gerar para máquinas. É baseado em um subconjunto do padrão JavaScript. O JSON é um formato de texto completamente independente de linguagem, mas usa convenções familiares aos programadores das linguagens da família C.

Essas propriedades tornam o JSON ideal para troca de dados em aplicações web, APIs e arquivos de configuração. Ele se tornou o padrão de fato para troca de dados na web, substituindo amplamente o XML por seu menor tamanho e melhor desempenho.

", - heading2: "Como usar esta ferramenta", - p2: "
  1. Cole seus dados JSON brutos ou desorganizados no editor à esquerda.
  2. Clique em Format para embelezar o código com indentação adequada e destaque de sintaxe.
  3. Alternativamente, use Minify para remover todos os espaços em branco para uso em produção.
  4. Verifique o indicador de Status para garantir que seu JSON é válido; se houver um erro, a ferramenta destacará a linha exata.
  5. Clique em Copy para salvar o resultado formatado na área de transferência ou Clear para recomeçar.
", - heading3: "Casos de uso comuns", - p3: "", - heading4: "Dicas avançadas", - p4: "", - }, }, "jwt-decoder": { name: "Inspetor JWT", @@ -139,22 +129,6 @@ export default { status5: "Algoritmo: ", status6: "Falha ao decodificar", }, - edu: { - heading1: "O que é JWT?", - p1: "

JSON Web Token (JWT) é um padrão aberto (RFC 7519) que define uma forma compacta e autocontida de transmitir informações com segurança entre partes como um objeto JSON. Essa informação pode ser verificada e é confiável porque é assinada digitalmente. JWTs podem ser assinados usando um segredo (com o algoritmo HMAC) ou um par de chaves pública/privada usando RSA ou ECDSA.

Devido ao seu tamanho compacto, JWTs são comumente usados em cenários de autenticação e troca de informações, como tokens Bearer em cabeçalhos HTTP Authorization.

", - heading2: "Como usar esta ferramenta", - p2: "
  1. Cole seu token: copie seu JWT codificado (header.payload.signature) e cole-o no campo de entrada.
  2. Decodificação automática: a ferramenta detecta automaticamente o token e decodifica seus componentes em tempo real.
  3. Inspecione o Header: revise o algoritmo (alg) e o tipo de token (typ) na seção Header.
  4. Analise o Payload: examine as claims, como expiração (exp), emissor (iss) e assunto (sub) na seção Payload.
  5. Verifique as claims: confira a caixa de Análise das claims para ver datas legíveis e o status de validação.
", - heading3: "Casos de uso comuns", - p3: "", - heading4: "Dicas avançadas", - p4: "", - heading5: "Estrutura do token (header.payload.signature)", - p5: "

Um JWT normalmente consiste em três partes separadas por pontos:

", - heading6: "Considerações de segurança", - p6: "

Embora os JWTs sejam assinados para garantir integridade, eles normalmente NÃO são criptografados. Isso significa que qualquer pessoa com o token pode decodificar o header e o payload para ler as informações internas. Nunca armazene informações sensíveis, como senhas ou chaves privadas, no payload de um JWT.

Além disso, sempre verifique a claim exp (expiração) para evitar ataques de replay e garanta que seu servidor valide a assinatura antes de confiar nos dados do payload.

", - heading7: "Dicas avançadas", - p7: "", - }, cheatsheet: { title: "Referência rápida de JWT", h0: "Estrutura", @@ -193,16 +167,6 @@ export default { text0: "✓ Copiado!", tpl1: "GUID:", }, - edu: { - heading1: "O que é um UUID?", - p1: "Um Identificador Único Universal (UUID) é um número de 128 bits usado para identificar informações de forma exclusiva em sistemas computacionais. Eles são projetados para serem gerados de forma independente, sem uma autoridade central, mantendo uma probabilidade de colisão desprezível.", - heading2: "Como usar esta ferramenta", - p2: "Selecione a versão do UUID (v1 para baseado em tempo, v4 para aleatório) e a quantidade de IDs que você precisa. Clique em Generate para criar uma lista de identificadores únicos prontos para uso no seu banco de dados ou aplicação.", - heading3: "Casos de uso comuns", - p3: "Chaves primárias em bancos de dados distribuídos, identificadores de sessão, rastreamento de transações e nomeação de arquivos ou recursos temporários onde a unicidade é essencial entre múltiplos sistemas.", - heading4: "Dicas avançadas", - p4: "O UUID v4 é a escolha mais comum para IDs únicos de propósito geral, pois depende de aleatoriedade de alta qualidade. Use o v1 se precisar ordenar os IDs pela hora de criação.", - }, }, "password-generator": { name: "Gerador de Senhas", @@ -265,24 +229,6 @@ export default { status6: "Fraca", text1: "Insira um endereço de e-mail base válido.", }, - edu: { - heading1: "O que torna uma senha segura?", - p1: "

Uma senha segura é sua primeira linha de defesa contra acesso não autorizado. Na era moderna da computação de alta velocidade, segurança é definida pela entropia — a medida de aleatoriedade e imprevisibilidade de uma string. Uma senha forte deve ser longa (pelo menos 16 caracteres), única para cada conta e composta por uma combinação diversa de tipos de caracteres, incluindo maiúsculas, minúsculas, números e símbolos.

Evite usar informações pessoais como datas de aniversário, nomes de animais de estimação ou palavras comuns do dicionário. Até substituições que parecem complexas, como P@ssw0rd123, são facilmente quebradas por ferramentas modernas de força bruta que usam enormes dicionários de padrões comuns.

", - heading2: "Como usar esta ferramenta", - p2: "
  1. Selecione o modo: Escolha entre Senha, Nome de usuário, Frase-senha ou Alias de e-mail conforme sua necessidade.
  2. Ajuste o comprimento: Use o controle deslizante para definir o comprimento desejado. Para senhas, 16+ caracteres é recomendado para alta segurança.
  3. Configure as opções: Ative ou desative conjuntos de caracteres (símbolos, números, etc.) ou estilos (legível vs. seguro).
  4. Gerar: Clique no botão Gerar para criar sua credencial única.
  5. Copiar: Use o ícone de cópia para mover o resultado com segurança para sua área de transferência ou gerenciador de senhas.
", - heading3: "Casos de uso comuns", - p3: "", - heading4: "Dicas avançadas", - p4: "", - heading5: "O que torna uma senha segura?", - p5: "

Uma senha segura é sua primeira linha de defesa contra acesso não autorizado. Na era moderna da computação de alta velocidade, segurança é definida pela entropia. Uma senha forte deve ser longa, única e diversificada.

", - heading6: "Entropie explicada", - p6: "

Entropia é uma medida da aleatoriedade e imprevisibilidade de uma senha, geralmente expressa em bits. Quanto maior a entropia, mais forte a senha. Nosso gerador calcula a entropia em tempo real para oferecer uma medida objetiva da força da sua senha.

", - heading7: "Boas práticas", - p7: "", - heading8: "Dicas avançadas", - p8: "", - }, }, "hash-calculator": { name: "Calculadora de Hash", @@ -350,16 +296,6 @@ export default { tpl4: "Aguardando entrada...", text2: "Calculado: ", }, - edu: { - heading1: "O que é hashing?", - p1: "

O hashing criptográfico é um processo matemático que transforma qualquer dado de entrada (texto ou arquivos) em uma string de tamanho fixo, geralmente um número hexadecimal. Essa impressão digital é única para a entrada; até mesmo a mudança de um único bit nos dados de origem resultará em um hash completamente diferente, um fenômeno conhecido como efeito avalanche.

Diferente da criptografia, o hashing é uma função de mão única. Não é possível reverter um hash para recuperar os dados originais. Isso o torna ideal para verificar a integridade dos dados, armazenar senhas com segurança (quando combinado com salts) e identificar arquivos sem expor seu conteúdo.

", - heading2: "Como usar esta ferramenta", - p2: "
  1. Selecione o tipo de entrada: escolha a aba Text para strings ou a aba File para arquivos locais.
  2. Forneça a entrada: cole seu texto ou arraste e solte seu arquivo na área de trabalho.
  3. HMAC opcional: digite uma chave secreta no campo HMAC se precisar gerar um hash com chave para autenticação.
  4. Revise os resultados: a ferramenta calcula automaticamente múltiplas variantes de hash (SHA-256, SHA-512 etc.) em tempo real.
  5. Verifique a integridade: use a aba Verify para comparar um hash conhecido com sua entrada e detectar adulterações.
", - heading3: "Casos de uso comuns", - p3: "", - heading4: "Dicas avançadas", - p4: "", - }, cheatsheet: { title: "Referência de algoritmos de hash", h0: "Comparação de algoritmos", @@ -435,16 +371,6 @@ export default { text5: "Use pelo menos /", text6: "IPv6 /", }, - edu: { - heading1: "O que é CIDR?", - heading2: "Como usar esta ferramenta", - heading3: "Casos de uso comuns", - heading4: "Dicas avançadas", - p1: "Classless Inter-Domain Routing (CIDR) é um método para alocar endereços IP e roteamento IP. Substituiu o sistema mais antigo baseado em classes (A, B e C) para fornecer mais flexibilidade e eficiência na distribuição de endereços.", - p2: "Insira um endereço IP com um prefixo (ex.: 192.168.1.0/24) ou use o controle deslizante para ajustar o comprimento do prefixo. Clique em \"Run analysis\" para ver detalhes da rede, intervalos de hosts utilizáveis e representações binárias.", - p3: "Planejamento de sub-redes de rede para infraestrutura em nuvem (VPCs), solução de problemas de roteamento, cálculo da capacidade de hosts para um determinado prefixo e conversão entre CIDR e máscaras de sub-rede.", - p4: "Lembre-se de que no IPv4, o primeiro e o último endereço em uma sub-rede são tipicamente reservados para o ID de rede e o endereço de broadcast. No IPv6, as sub-redes são quase sempre /64 para redes locais padrão.", - }, cheatsheet: { title: "Referência rápida de sub-redes", h0: "Sub-redes comuns", @@ -619,16 +545,6 @@ export default { tpl3: "Alterar padrões:", tpl4: "Nenhuma porta encontrada para sua busca.", }, - edu: { - heading1: "Guia de categorias de portas e segurança", - p1: "Portas bem conhecidas (0-1023) são atribuídas pela IANA e exigem privilégios de root em sistemas Unix. Portas registradas (1024-49151) são usadas por aplicações. Portas dinâmicas/efêmeras (49152-65535) são usadas para conexões do lado do cliente. Entender as faixas de portas é essencial para a configuração de firewall e a segurança de rede.", - heading2: "Como usar esta ferramenta", - p2: "Busque por número de porta ou nome do serviço para encontrar detalhes do protocolo e níveis de risco de segurança. Filtre por categoria (Well-Known, Registered, Dynamic) ou protocolo (TCP/UDP) para refinar os resultados. Clique em qualquer linha para ver detalhes completos, incluindo vulnerabilidades comuns e recomendações de hardening.", - heading3: "Casos de uso comuns", - p3: "Configuração de regras de firewall, solução de problemas de rede, identificação de portas abertas inesperadas durante auditorias de segurança e referência rápida para atribuições de portas de protocolo.", - heading4: "Dicas avançadas", - p4: "Use o filtro de risco para identificar rapidamente portas de alto risco na sua rede. A seção Top 50 Most Common Ports oferece uma visão instantânea dos serviços mais usados.", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
PortaServiçoRisco
21FTPTransferências de arquivos sem criptografia
23TelnetAutenticação em texto puro
25SMTPRisco de retransmissão de spam
53DNSAtaques de amplificação DDoS
445SMBPropagação de ransomware
3389RDPAtaques de força bruta
", @@ -872,16 +788,6 @@ export default { text4: "Avisos", alert0: "Gere uma configuração primeiro", }, - edu: { - heading1: "Sobre o WireGuard", - p1: "O WireGuard é um protocolo VPN moderno e de alto desempenho que usa criptografia de última geração. Ele foi projetado para ser mais simples e rápido que protocolos mais antigos como OpenVPN e IPsec, com uma superfície de ataque muito menor devido à sua base de código mínima. O WireGuard agora faz parte do kernel do Linux e é suportado nativamente no Windows, macOS, iOS e Android.", - heading2: "Como usar esta ferramenta", - p2: "Selecione um template de topologia (Point-to-Point, Hub-and-Spoke, Site-to-Site ou Road Warrior) para pré-preencher uma configuração. Clique em Generate Keys para criar um novo par de chaves localmente no seu navegador. Preencha os campos obrigatórios e clique em Generate Config para gerar o arquivo de configuração do WireGuard. Use Download .conf para salvar o arquivo ou Generate QR para criar um código QR para importação móvel.", - heading3: "Casos de uso comuns", - p3: "VPN de acesso remoto para funcionários que se conectam às redes da empresa. VPN site a site para conectar redes de filiais. Servidor VPN pessoal para navegação segura em Wi-Fi público. Tunelamento de dispositivos IoT para comunicação segura entre dispositivos embarcados.", - heading4: "Dicas avançadas", - p4: "Use PersistentKeepalive = 25 em clientes atrás de NAT para manter o túnel ativo quando não há tráfego. PresharedKey adiciona uma camada extra de criptografia simétrica para resistência pós-quântica. AllowedIPs = 0.0.0.0/0 roteia todo o tráfego pelo túnel (túnel completo), enquanto CIDRs específicos criam um túnel dividido.", - }, cheatsheet: { title: "Referência rápida do WireGuard", h0: "Campos da interface", @@ -1025,14 +931,6 @@ export default { tpl6: "Exemplo:", tpl7: "Clique em qualquer campo do diagrama para ver detalhes.", }, - edu: { - heading1: "O que são cabeçalhos de protocolo?", - p1: "Cabeçalhos de protocolo são dados estruturados que precedem o payload nos pacotes de rede. Eles contêm informações de controle, como endereços de origem e destino, tipos de protocolo, números de sequência e checksums. Entender a estrutura dos cabeçalhos é essencial para depuração de rede, análise de pacotes e implementação de protocolos.", - heading2: "Como usar esta ferramenta", - p2: "Selecione um protocolo nas abas para ver a estrutura do seu cabeçalho. Cada bloco colorido representa um campo com seu tamanho indicado. Clique em qualquer campo para ver informações detalhadas, incluindo o nome e a descrição do campo, o deslocamento em bits/bytes, valores comuns e seus significados, e a referência da RFC. Use o analisador de hex dump para analisar capturas de pacotes reais colando a saída em hex de ferramentas como tcpdump ou Wireshark.", - heading3: "Casos de uso comuns", - p3: "Análise de pacotes para entender a estrutura do tráfego de rede capturado, aprendizado de protocolos como auxílio visual para estudar protocolos de rede, depuração para identificar cabeçalhos malformados ou valores de campo incorretos, e referência de desenvolvimento ao implementar protocolos de rede.", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
ValorProtocolo
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
CampoTamanhoDescrição
Source Port2 bytesNúmero da porta do remetente
Dest Port2 bytesNúmero da porta do destinatário
Seq Number4 bytesNúmero de sequência
Ack Number4 bytesNúmero de confirmação
Data Offset4 bitsComprimento do cabeçalho / 4
Flags9 bitsNS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 bytesTamanho da janela de recepção
", @@ -1108,16 +1006,6 @@ export default { tpl0: "Diferenças", tpl1: "Nenhuma diferença encontrada (ou entrada vazia)", }, - edu: { - heading1: "O que é comparação de textos (diff)?", - p1: "A comparação de textos (diffing) é o processo de comparar duas sequências de dados para identificar as diferenças entre elas. Ela destaca o que foi adicionado, removido ou modificado. Essa é uma operação fundamental no desenvolvimento de software, na análise de dados e na gestão de conteúdo, permitindo que os usuários acompanhem mudanças ao longo do tempo ou comparem versões diferentes de um documento.", - heading2: "Algoritmos de diff", - p2: "A maioria das ferramentas de diff de texto usa algoritmos baseados no problema da Maior Subsequência Comum (LCS). O objetivo é encontrar a maior sequência de elementos que aparecem em ambos os textos na mesma ordem relativa. Implementações comuns incluem o algoritmo de diff de Myers, que é altamente eficiente e usado pelo Git, e o algoritmo Hunt-McIlroy. Esses algoritmos calculam o número mínimo de edições necessárias para transformar um texto em outro.", - heading3: "Casos de uso", - p3: "Revisões de código para que desenvolvedores vejam exatamente o que mudou em um pull request. Sistemas de controle de versão como o Git armazenam o histórico como uma série de diffs para economizar espaço. Auditoria de conteúdo para redatores e editores que comparam rascunhos para garantir que todas as alterações solicitadas foram feitas. Validação de dados para comparar arquivos de configuração ou exportações de banco de dados em busca de discrepâncias.", - heading4: "Dicas avançadas", - p4: "Muitas ferramentas de diff têm opções para ignorar mudanças em indentação ou espaços no final das linhas, o que pode reduzir o ruído ao comparar código. Inclua algumas linhas de texto inalterado ao redor das diferenças (linhas de contexto) para entender o impacto das mudanças. Diffs no nível de palavra costumam ser mais úteis para prosa e documentos em linguagem natural, enquanto diffs no nível de linha são o padrão para código.", - }, }, "regex-visualizer": { name: "Visualizador de Regex", @@ -1168,16 +1056,6 @@ export default { tpl5: "Sem grupos", tpl6: "Expressão regular inválida", }, - edu: { - heading1: "O que são expressões regulares?", - p1: "Expressões regulares (regex) são padrões poderosos usados para casar combinações de caracteres em strings. São ferramentas essenciais para processamento de texto, validação e extração de dados em diversas linguagens de programação. Padrões regex consistem em caracteres literais e metacaracteres especiais que definem regras de busca. São usados em validação de formulários, análise de logs, operações de busca e substituição, e tarefas de limpeza de dados.", - heading2: "Como usar esta ferramenta", - p2: "Digite seu padrão regex no campo de entrada. A ferramenta gerará automaticamente um diagrama railroad visualizando a estrutura do padrão. Adicione um texto de teste para ver o destaque de correspondências e explicações em tempo real. Use o cheatsheet para consulta rápida de padrões e sintaxe comuns. Gere trechos de código para sua linguagem de programação preferida.", - heading3: "Casos de uso comuns", - p3: "Validação de e-mail para garantir que a entrada do usuário corresponda ao formato correto antes do processamento, análise de logs para extrair timestamps e endereços IP de logs de servidor, limpeza de dados para remover caracteres indesejados ou formatar números de telefone de forma consistente, e busca e substituição para transformações de texto em massa com correspondência de padrões.", - heading4: "Dicas avançadas", - p4: "Comece simples e construa padrões complexos incrementalmente. Use grupos não capturantes (?:) quando não precisar referenciar a correspondência. Teste casos extremos, como strings vazias e caracteres especiais. Considere a legibilidade da regex — padrões complexos podem ser documentados com comentários.", - }, cheatsheet: { title: "Referência rápida de regex", h0: "Classes de caracteres", @@ -1323,16 +1201,6 @@ export default { text1: "Copiar", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "O que é um Cron Job?", - p1: "Um cron job é um agendador de tarefas baseado em tempo em sistemas operacionais do tipo Unix. É usado para executar comandos ou scripts automaticamente em tempos ou intervalos programados. O nome deriva de Chronos, o deus grego do tempo. Cron jobs são essenciais para automação de sistemas, como agendar backups, enviar relatórios por e-mail ou limpar arquivos temporários.", - heading2: "Como usar esta ferramenta", - p2: "Selecione a aba apropriada (Minuto, Hora, Dia, Mês, Semana) para configurar cada parte da expressão. Escolha 'Cada' para o wildcard (*) ou insira valores específicos. A expressão cron é atualizada em tempo real na parte superior. Use a visualização 'Próximas execuções' para verificar se seu agendamento funcionará como esperado. Copie a expressão finalizada para a área de transferência com um clique.", - heading3: "Casos de uso comuns", - p3: "Backups de banco de dados agendados diariamente à meia-noite. Gerar relatórios toda segunda-feira de manhã. Limpar arquivos de log a cada hora. Enviar notificações de verificação de saúde a cada 5 minutos. Atualizar caches diariamente em horários específicos.", - heading4: "Dicas avançadas", - p4: "Sempre teste sua expressão cron com uma ferramenta como esta antes de implantá-la em produção. Lembre-se de que os cron jobs são executados no fuso horário local do servidor, o que pode causar problemas em sistemas distribuídos. Sempre documente seus cron jobs com comentários no crontab para deixar claro seu propósito para referência futura.", - }, cheatsheet: { title: "Referência rápida de chaves SSH", h0: "Tipos de chave", @@ -1372,16 +1240,6 @@ export default { tpl2: "Nenhum nome alternativo do titular presente.", tpl3: "Nenhuma extensão analisada.", }, - edu: { - heading1: "O que são certificados X.509?", - heading2: "Como usar esta ferramenta", - heading3: "Casos de uso comuns", - heading4: "Dicas avançadas", - p1: "

X.509 é um formato padrão para certificados de chave pública, que são documentos digitais que vinculam com segurança uma chave pública a uma identidade (como um site, organização ou indivíduo). Esses certificados são a base da Infraestrutura de Chave Pública (PKI) usada para proteger a internet via HTTPS, além de assinar e-mails e softwares.

Um certificado X.509 contém a chave pública, a identidade do titular do certificado e a assinatura digital da Autoridade Certificadora (CA) que emitiu o certificado, comprovando sua autenticidade.

", - p2: "
  1. Cole seu certificado: copie seu certificado codificado em PEM (incluindo os cabeçalhos BEGIN e END) e cole-o no campo de entrada.
  2. Analise: clique em \"Parse Certificate\" para extrair e analisar os dados.
  3. Revise o resumo: confira os cartões superiores para o Common Name (CN), o Issuer e as datas de validade.
  4. Inspecione os detalhes: expanda as seções abaixo para ver o Subject, o Issuer, os SANs e as extensões técnicas completos.
  5. Verifique o status: observe o selo de status para ver se o certificado está atualmente válido ou expirado.
", - p3: "", - p4: "", - }, cheatsheet: { title: "Referência de certificados X.509", h0: "Campos do certificado", @@ -1424,16 +1282,6 @@ export default { text1: "Copiar JSON", text2: "Copiar XML", }, - edu: { - heading1: "O que é SAML?", - p1: "Security Assertion Markup Language (SAML) é um padrão aberto baseado em XML para troca de dados de autenticação e autorização entre partes, em especial entre um Identity Provider (IdP) e um Service Provider (SP). O SAML é a espinha dorsal de muitas soluções corporativas de Single Sign-On (SSO), permitindo que os usuários acessem múltiplas aplicações com um único conjunto de credenciais. A versão mais comum é o SAML 2.0, que usa tokens de segurança contendo assertions para transmitir informações sobre um principal entre o IdP e o SP.", - heading2: "Como usar esta ferramenta", - p2: "Cole o SAMLResponse codificado em Base64 ou o XML bruto no campo de entrada. Ative Attempt to inflate se estiver decodificando um payload de binding Redirect. Clique em Decode response para analisar a mensagem. Confira o Resumo rápido para ver o Issuer, o Subject e o status de validade. Veja os atributos do usuário decodificados na tabela Attributes. Use as abas para ver o Pretty XML, os detalhes da assertion ou uma representação em JSON das claims.", - heading3: "Casos de uso comuns", - p3: "Solução de problemas de SSO diagnosticando por que um usuário não consegue fazer login, verificando assertions expiradas ou incompatibilidades de audience. Testes de integração para verificar se seu Identity Provider está enviando os atributos corretos. Auditoria de segurança para inspecionar o XML bruto e garantir que as assertions estejam corretamente assinadas. Desenvolvimento para visualizar rapidamente o conteúdo de uma mensagem SAML durante a integração do Service Provider.", - heading4: "Dicas avançadas", - p4: "Mensagens SAML enviadas via HTTP-Redirect geralmente são comprimidas (deflate) antes de serem codificadas em Base64 — se a decodificação falhar, tente ativar a opção Attempt to inflate. Garanta que o AudienceRestriction corresponda ao Entity ID do seu SP. Se uma resposta for marcada como inválida, verifique os horários NotBefore e NotOnOrAfter em busca de diferença de relógio entre o IdP e o SP.", - }, cheatsheet: { title: "Referência rápida de SAML", h0: "Fluxo SAML", @@ -1476,16 +1324,6 @@ export default { alert1: "Digite uma string User-Agent", tpl2: "Saída bruta da análise", }, - edu: { - heading1: "O que é um User-Agent?", - p1: "Um User-Agent é uma string enviada pelo seu navegador para todo site que você visita. Ela identifica a versão do navegador, o sistema operacional e o tipo de dispositivo, permitindo que os servidores otimizem o conteúdo para seu ambiente específico.", - heading2: "Como usar esta ferramenta", - p2: "Cole uma string User-Agent na caixa de entrada ou clique em Use This para analisar a string do seu navegador atual. A ferramenta detalha o engine do navegador, a versão do SO e as características do dispositivo.", - heading3: "Casos de uso comuns", - p3: "Depuração de problemas de compatibilidade de sites, análise de logs de servidor web para identificar tráfego de bots, verificação de spoofing de navegador, e entendimento da distribuição de dispositivos no seu público.", - heading4: "Dicas avançadas", - p4: "Muitos navegadores modernos congelam ou simplificam suas strings User-Agent para evitar fingerprinting. Sempre procure pelos tokens Version ou Chrome para obter a informação de versão mais precisa.", - }, }, "qr-code": { name: "Gerador de Código QR", @@ -1524,16 +1362,6 @@ export default { alert3: "Copiado!", tpl4: "Envie uma imagem para decodificar", }, - edu: { - heading1: "O que são códigos QR?", - p1: "Códigos QR (Quick Response) são códigos de barras bidimensionais capazes de armazenar diversos tipos de dados, mais comumente URLs. Eles podem ser escaneados por smartphones e leitores especializados para acessar rapidamente informações ou disparar ações.", - heading2: "Como usar esta ferramenta", - p2: "Digite o texto ou URL que deseja codificar. Ajuste o tamanho e o nível de correção de erros conforme necessário. O código QR é atualizado em tempo real e pode ser baixado como imagem para uso impresso ou digital.", - heading3: "Casos de uso comuns", - p3: "Compartilhamento de links de sites, fornecimento de credenciais de Wi-Fi, cartões de visita digitais (vCards), emissão de ingressos para eventos, e fluxos de pagamento móvel ou autenticação.", - heading4: "Dicas avançadas", - p4: "Níveis mais altos de correção de erros (H ou Q) permitem que o código QR continue legível mesmo se parcialmente danificado ou obstruído, o que é ideal para sinalização física ou branding.", - }, }, "timestamp-converter": { name: "Conversor de Timestamp", @@ -1564,16 +1392,6 @@ export default { text0: "Timestamp inválido", tpl1: "Unix (milissegundos)", }, - edu: { - heading1: "O que é Unix Time?", - p1: "Unix time (também conhecido como Epoch time, POSIX time ou Unix timestamp) é um sistema para descrever um ponto no tempo. É o número de segundos decorridos desde o Unix Epoch, menos segundos intercalares; o Unix Epoch é 00:00:00 UTC em 1 de janeiro de 1970. É amplamente usado em sistemas operacionais e formatos de arquivo porque é um único inteiro, facilitando o armazenamento e manipulação pelos computadores. Esse padrão permite que diferentes sistemas comuniquem o tempo com precisão, independentemente das configurações de fuso horário local.", - heading2: "Como usar esta ferramenta", - p2: "Para converter Unix em data legível: insira o timestamp no campo Unix Timestamp e selecione se está em segundos ou milissegundos. Para converter data legível em Unix: selecione a data e hora usando os seletores, depois escolha o fuso horário desejado. Use o botão Now para capturar rapidamente o timestamp atual. Visualize os resultados em tempo real, incluindo ISO 8601, Hora local, UTC e tempo relativo. Clique em Copy ao lado de qualquer resultado para salvá-lo na área de transferência.", - heading3: "Casos de uso comuns", - p3: "Análise de logs para converter timestamps enigmáticos em logs de servidor ou entradas de banco de dados em datas legíveis para depuração. Desenvolvimento de API para verificar se seu backend está enviando os valores epoch corretos. Migração de dados para garantir que dados baseados em tempo permaneçam consistentes ao mover entre sistemas. Agendamento para calcular timestamps futuros ou passados para cron jobs, datas de expiração ou gatilhos de eventos.", - heading4: "Dicas avançadas", - p4: "Ao trabalhar com JavaScript, lembre-se de que Date.now() retorna milissegundos, enquanto os Unix timestamps padrão estão em segundos — divida por 1000 para converter. Sempre use o formato ISO 8601 para troca de dados entre sistemas para garantir máxima compatibilidade. Esteja ciente do problema do Ano 2038, onde inteiros de 32 bits com sinal transbordarão; sistemas modernos usam inteiros de 64 bits, o que resolve isso para o futuro previsível.", - }, }, "color-converter": { name: "Conversor de Cores", @@ -1589,16 +1407,6 @@ export default { badge7: "Somente no cliente", badge8: "Privacidade em primeiro lugar", }, - edu: { - heading1: "Modelos de cor explicados (HEX/RGB/HSL)", - heading2: "Como usar esta ferramenta", - heading3: "Casos de uso comuns", - heading4: "Dicas avançadas", - p1: "

Modelos de cor são sistemas matemáticos para representar cores. HEX (Hexadecimal) é um código de 6 dígitos usado em HTML e CSS, representando componentes Vermelho, Verde e Azul. RGB (Vermelho, Verde, Azul) usa valores decimais de 0 a 255 para cada canal, frequentemente usado em imagens digitais.

HSL (Matiz, Saturação, Luminosidade) é mais intuitivo para humanos, pois descreve a cor em termos de seu pigmento base (Matiz), intensidade (Saturação) e brilho (Luminosidade). Entender esses modelos ajuda a escolher o formato certo para suas necessidades de design e desenvolvimento, garantindo consistência em diferentes plataformas e dispositivos.

", - p2: "
  1. Use o seletor visual de cores para selecionar uma cor arrastando o cursor no quadrado de saturação/brilho e no controle deslizante de matiz.
  2. Como alternativa, insira um valor específico no campo «Entrada Manual» (suporta formatos #hex, rgb ou hsl).
  3. Observe a caixa de «Visualização» para ver a cor selecionada em tempo real.
  4. Veja os valores convertidos nos cartões HEX, RGB, HSL e HSV abaixo.
  5. Clique no ícone «Copiar» em qualquer cartão para salvar esse formato específico na área de transferência.
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "Conversor de Unidades", @@ -1616,16 +1424,6 @@ export default { text0: "Selecione as unidades para ver a fórmula de conversão", text1: "Digite um número válido", }, - edu: { - heading1: "Visão geral dos sistemas de medição", - p1: "Sistemas de medição são coleções de unidades de medida e regras que as relacionam entre si. Os dois sistemas mais comuns são o Sistema Métrico (Sistema Internacional de Unidades ou SI) e o Sistema Imperial. O sistema métrico é baseado em potências de dez, tornando-o altamente lógico e fácil de escalar. O sistema imperial, usado principalmente nos Estados Unidos, usa unidades como polegadas, pés e libras com origens históricas. Compreender as diferenças entre esses sistemas é essencial para ciência, engenharia, comércio internacional e tarefas do dia a dia como cozinhar ou viajar.", - heading2: "Como usar esta ferramenta", - p2: "Selecione a categoria de medição (por exemplo, Comprimento, Peso, Temperatura) na grade no topo. Escolha a unidade a partir da qual deseja converter no menu suspenso De. Insira o valor que deseja converter no campo de entrada. Selecione a unidade de destino no menu suspenso Para. O valor convertido aparecerá instantaneamente junto com a fórmula matemática usada para a conversão.", - heading3: "Casos de uso comuns", - p3: "Viagens para converter distâncias de quilômetros para milhas ou temperaturas de Celsius para Fahrenheit. Culinária para traduzir receitas entre métricas (gramas/mililitros) e imperiais (onças/xícaras). Engenharia e ciência para conversões precisas entre diferentes unidades de pressão, energia ou velocidade. Armazenamento digital para entender a diferença entre Megabytes, Gigabytes e Terabytes.", - heading4: "Dicas avançadas", - p4: "Use o botão Trocar para inverter rapidamente a direção da conversão entre suas unidades selecionadas. Verifique sempre o tipo de unidade específico, especialmente para volume e peso, pois os nomes podem ser semelhantes em diferentes sistemas como galões dos EUA vs. do Reino Unido. Ao realizar múltiplas conversões em sequência, mantenha o maior número possível de casas decimais até o resultado final para evitar erros de arredondamento cumulativos.", - }, }, "yaml-toml-converter": { name: "Conversor YAML/TOML", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ Falha na conversão de TOML:", tpl7: "Aguardando conversão.", }, - edu: { - heading1: "YAML vs. TOML vs. JSON comparados", - p1: "JSON é o formato mais usado para troca de dados devido à sua simplicidade e suporte nativo em JavaScript. YAML (YAML Ain't Markup Language) é um padrão de serialização de dados amigável para humanos que usa indentação para representar a estrutura, tornando-o popular para arquivos de configuração complexos. TOML (Tom's Obvious, Minimal Language) foi projetado para ser fácil de ler e escrever devido à sua semântica óbvia e é frequentemente usado para configuração de projetos. Enquanto o JSON é rígido e compacto, YAML e TOML priorizam a legibilidade humana e a facilidade de edição manual.", - heading2: "Como usar esta ferramenta", - p2: "Cole seus dados de configuração (JSON, YAML ou TOML) na área de texto de origem à esquerda. A ferramenta detecta automaticamente o formato de origem, ou você pode selecioná-lo manualmente no menu suspenso. Clique em Validate only para verificar erros de sintaxe sem realizar uma conversão. Clique em um dos botões de conversão (to JSON, to YAML, to TOML) para traduzir seus dados para esse formato. Veja os resultados nos painéis de saída à direita e clique em Copy para salvá-los na sua área de transferência.", - heading3: "Casos de uso comuns", - p3: "Infraestrutura como código para converter entre JSON e YAML ao trabalhar com manifestos Kubernetes, arquivos Docker Compose ou templates AWS CloudFormation. Configuração de projetos para migrar definições entre package.json (JSON) e pyproject.toml ou Cargo.toml (TOML). Prototipagem de API para visualizar rapidamente como uma estrutura de dados complexa aparece em diferentes formatos. Migração de sistemas legados para traduzir arquivos de configuração antigos para formatos modernos garantindo a integridade dos dados.", - heading4: "Dicas avançadas", - p4: "Use YAML para pipelines de CI/CD onde a legibilidade de estruturas aninhadas complexas é essencial para a manutenção. Prefira TOML para arquivos de configuração no nível da aplicação, oferecendo uma interface limpa para usuários finais que talvez precisem editá-los manualmente. Ao converter de YAML para JSON, esteja atento a problemas de coerção de tipos do YAML (onde NO pode ser interpretado como false) e garanta que seus tipos de dados sejam preservados corretamente.", - }, cheatsheet: { title: "Comparação de formatos", h0: "Diferenças de sintaxe", @@ -1719,16 +1507,6 @@ export default { text1: "Copiar", text2: "Copiado!", }, - edu: { - heading1: "O que é htpasswd?", - p1: "

O arquivo htpasswd é um banco de dados de arquivo simples usado para armazenar nomes de usuário e senhas com hash para autenticação básica em servidores web Apache e Nginx. É uma forma simples, porém eficaz, de proteger diretórios específicos ou painéis administrativos de um site sem precisar de um sistema completo de autenticação baseado em banco de dados.

Cada linha de um arquivo htpasswd representa um único usuário e segue o formato username:hashed_password.

", - heading2: "Como usar esta ferramenta", - p2: "
  1. Digite o nome de usuário: informe o nome de usuário que deseja usar para autenticação.
  2. Forneça a senha: digite uma senha ou clique em Generate strong para criar uma senha segura.
  3. Selecione o algoritmo: escolha Bcrypt (-B) para segurança moderna ou Apache MD5 (-m) para compatibilidade legada.
  4. Gere: clique em Generate entry para criar a string com hash.
  5. Copie ou baixe: copie a linha resultante para sua área de transferência ou baixe-a como arquivo para enviar ao seu servidor.
", - heading3: "Casos de uso comuns", - p3: "", - heading4: "Dicas avançadas", - p4: "", - }, }, "mock-data-generator": { name: "Gerador de Dados de Teste", @@ -1762,16 +1540,6 @@ export default { text1: "Copiar", text2: "Nenhuma linha para pré-visualizar.", }, - edu: { - heading1: "O que são dados mock?", - p1: "

Dados mock são informações sintéticas que imitam dados reais sem conter informações sensíveis ou pessoalmente identificáveis (PII). São essenciais para desenvolvedores e testadores que precisam de conjuntos de dados realistas para construir e validar aplicações sem arriscar violações de dados ou violar regulamentos de privacidade como GDPR ou CCPA. Ao usar dados mock, você pode simular vários cenários, garantindo que seu software trate todos os tipos de entrada adequadamente.

", - heading2: "Estratégias de teste", - p2: "

Testes eficazes requerem conjuntos de dados diversificados. Use dados mock para popular seus bancos de dados de desenvolvimento, realizar testes de carga com milhares de registros ou verificar layouts de UI com comprimentos de string variados. É particularmente útil para testes de integração onde você precisa de respostas previsíveis de APIs externas. Ao gerar dados localmente, você pode criar ambientes de teste consistentes que são fáceis de redefinir e reproduzir.

", - heading3: "Privacidade de dados em mocks", - p3: "

Privacidade é uma prioridade máxima no desenvolvimento de software moderno. Usar dados reais de produção em ambientes de desenvolvimento ou staging é um grande risco de segurança. Geradores de dados mock resolvem isso produzindo dados falsos mas estruturalmente corretos. Nossa ferramenta roda inteiramente no seu navegador, o que significa que sua configuração e os dados gerados permanecem no seu navegador e não são enviados aos nossos servidores.

", - heading4: "Dicas avançadas", - p4: "", - }, cheatsheet: { title: "Tipos de campos de dados mock", h0: "Tipos disponíveis", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaNdO:", }, - edu: { - heading1: "Convenções de nomenclatura explicadas (camelCase/snake_case/etc)", - heading2: "Como usar esta ferramenta", - heading3: "Casos de uso comuns", - heading4: "Dicas avançadas", - p1: "

Convenções de nomenclatura são conjuntos de regras para escolher a sequência de caracteres usada em identificadores que denotam variáveis, tipos, funções e outras entidades no código-fonte e na documentação. camelCase (ex.: myVariable) começa com uma letra minúscula e capitaliza a primeira letra de cada palavra subsequente. snake_case (ex.: my_variable) usa underscores para separar palavras.

PascalCase (ex.: MyVariable) capitaliza a primeira letra de cada palavra, enquanto kebab-case (ex.: my-variable) usa hífens para separar palavras. Essas convenções não são apenas estéticas; são fundamentais para a legibilidade e manutenção do código, além de seguir os padrões idiomáticos de diferentes linguagens de programação e frameworks.

", - p2: "
  1. Digite ou cole seu texto na área \"Input Text\" no topo da página.
  2. A ferramenta converterá automaticamente sua entrada para mais de uma dezena de estilos de caixa diferentes em tempo real.
  3. Percorra a grade \"Conversion Results\" para encontrar o estilo de caixa específico que você precisa.
  4. Clique no ícone \"Copy\" ao lado de qualquer resultado para salvá-lo na sua área de transferência.
  5. Use o botão \"Clear\" para remover toda a entrada e começar uma nova conversão.
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "Minificador de Código", @@ -1913,16 +1671,6 @@ export default { text2: "📋 Copiar", tpl3: "Todo o processamento acontece no seu navegador. Seu código é processado localmente e não é enviado aos nossos servidores.", }, - edu: { - heading1: "O que é minificação?", - heading2: "Como usar esta ferramenta", - heading3: "Casos de uso comuns", - heading4: "Dicas avançadas", - p1: "

Minificação é o processo de remover todos os caracteres desnecessários do código-fonte sem alterar sua funcionalidade. Isso inclui remover espaços em branco, quebras de linha, comentários e, às vezes, encurtar nomes de variáveis. O objetivo é reduzir o tamanho do arquivo do código, o que por sua vez reduz a quantidade de dados que precisam ser transferidos pela rede.

Isso resulta em tempos de carregamento de página mais rápidos e melhor desempenho para aplicações web. Embora a minificação seja essencial para ambientes de produção, ela torna o código quase impossível de ler e depurar para humanos. Por isso, geralmente é realizada como uma etapa final do processo de build antes da implantação em um servidor ativo.

", - p2: "
  1. Selecione a linguagem de programação (JavaScript, CSS, HTML ou JSON) nas abas no topo.
  2. Cole seu código-fonte na área de texto \"Input Code\" à esquerda.
  3. Clique no botão \"Minify Code\" para reduzir o tamanho do arquivo para uso em produção.
  4. Alternativamente, clique em \"Beautify Code\" para adicionar indentação e formatação para melhor legibilidade.
  5. Veja os resultados na área \"Output Code\" e clique em \"Copy\" ou \"Download\" para salvar seu código otimizado.
", - p3: "", - p4: "", - }, }, "image-converter": { name: "Conversor de Imagens", @@ -1969,16 +1717,6 @@ export default { alert2: "Erro ao ler o arquivo.", tpl3: "Processamento no cliente usando a Canvas API — sem envios, resultados instantâneos", }, - edu: { - heading1: "Formatos de imagem comparados (PNG/JPEG/WebP)", - p1: "

Escolher o formato de imagem certo é fundamental para o desempenho web e a qualidade visual. JPEG é ideal para fotografias e imagens complexas com muitas cores, pois usa compressão com perdas para obter arquivos pequenos. PNG é ideal para imagens que exigem transparência ou têm bordas nítidas e cores sólidas (como logotipos e ícones), pois usa compressão sem perdas.

WebP é um formato moderno que oferece compressão com e sem perdas superior, frequentemente resultando em arquivos significativamente menores do que JPEG ou PNG, mantendo alta qualidade.

", - heading2: "Como usar esta ferramenta", - p2: "
  1. Envie sua imagem soltando-a na zona Upload Image ou clicando para procurar seus arquivos.
  2. Selecione o formato de saída desejado (PNG, JPG ou WebP) nas opções Convert Format.
  3. Se você selecionou um formato com perdas como JPG ou WebP, use o controle deslizante de qualidade para equilibrar tamanho do arquivo e fidelidade visual.
  4. Opcionalmente, use as configurações Resize Image para redimensionar sua imagem por porcentagem ou dimensões específicas.
  5. Clique em Convert & Resize Image e depois em Download para salvar seu ativo otimizado.
", - heading3: "Casos de uso comuns", - p3: "", - heading4: "Dicas avançadas", - p4: "", - }, }, "css-gradient": { name: "Gerador de Gradientes CSS", @@ -2018,16 +1756,6 @@ export default { alert2: "Falha ao copiar o CSS para a área de transferência", tpl3: "Telas de carregamento e sobreposições", }, - edu: { - heading1: "O que são gradientes CSS?", - heading2: "Gradientes lineares vs. radiais vs. cônicos", - heading3: "Suporte de navegadores e desempenho", - heading4: "Dicas avançadas para gradientes melhores", - p1: "

Gradientes CSS são um recurso poderoso que permite exibir transições suaves entre duas ou mais cores especificadas. Diferente das imagens de fundo tradicionais, os gradientes são gerados pelo navegador, o que significa que são infinitamente escaláveis, consomem menos largura de banda e podem ser facilmente manipulados com código. São comumente usados em fundos, botões e elementos decorativos para adicionar profundidade e interesse visual aos designs web.

", - p2: "

Existem três tipos principais de gradientes CSS:

", - p3: "

Os gradientes CSS modernos têm amplo suporte em todos os principais navegadores, incluindo Chrome, Firefox, Safari e Edge. Como são renderizados matematicamente pelo engine do navegador, são extremamente eficientes em comparação com imagens de alta resolução. No entanto, para gradientes muito complexos com dezenas de pontos de cor, é sempre uma boa prática testar o desempenho em dispositivos mais fracos. Para navegadores mais antigos (como o IE9 e anteriores), é recomendável fornecer uma cor sólida como fallback.

", - p4: "", - }, }, "curl-studio": { name: "Estúdio cURL", @@ -2096,16 +1824,6 @@ export default { text2: "Copiado!", tpl3: "Os logs aparecerão aqui após o mascaramento...", }, - edu: { - heading1: "O que é PII?", - p1: "

Informação de Identificação Pessoal (PII) é qualquer dado que possa ser usado para identificar um indivíduo específico. Isso inclui identificadores diretos, como nomes, endereços de e-mail e números de telefone, bem como identificadores indiretos, como endereços IP, localizações físicas e números de cartão de crédito. No contexto de logs de servidor, a PII costuma aparecer em parâmetros de requisição, headers ou mensagens de erro.

Proteger a PII é uma parte crítica da segurança de dados moderna e é exigida por diversas estruturas legais ao redor do mundo.

", - heading2: "Requisitos de conformidade (GDPR/CCPA)", - p2: "

Regulamentações como o Regulamento Geral de Proteção de Dados (GDPR) na Europa e o California Consumer Privacy Act (CCPA) nos Estados Unidos impõem regras rígidas sobre como os dados pessoais são tratados. Essas leis exigem que as organizações implementem privacidade por design e minimizem a coleta e o armazenamento de dados pessoais.

Compartilhar logs brutos contendo PII com equipes de suporte terceirizadas ou desenvolvedores pode gerar violações de conformidade. Mascarar ou redigir esses dados antes que saiam do seu ambiente seguro é uma etapa fundamental para manter a conformidade regulatória.

", - heading3: "Estratégias de mascaramento", - p3: "

Existem várias formas de lidar com dados sensíveis em logs:

Nossa ferramenta foca na redação, usando correspondência de padrões para encontrar e substituir formatos comuns de PII instantaneamente.

", - heading4: "Dicas avançadas", - p4: "", - }, }, "mermaid-studio": { name: "Estúdio Mermaid", @@ -2306,16 +2024,6 @@ export default { text51: "Nenhuma URL extraída ainda.", text52: "Nenhum dado de roteamento ainda.", }, - edu: { - heading1: "Autenticação de e-mail explicada", - heading2: "SPF/DKIM/DMARC", - heading3: "Detecção de phishing", - heading4: "Dicas avançadas", - p1: "

A autenticação de e-mail é um conjunto de técnicas usadas para fornecer informações verificáveis sobre a origem de uma mensagem de e-mail. Ao validar a identidade do remetente, esses protocolos ajudam os servidores de e-mail a distinguir entre mensagens legítimas e mensagens falsificadas ou fraudulentas (como phishing). Os três pilares da autenticação de e-mail moderna são SPF, DKIM e DMARC.

Quando um e-mail é recebido, o servidor receptor realiza essas verificações e registra os resultados nos cabeçalhos do e-mail, que esta ferramenta analisa para você.

", - p2: "", - p3: "

E-mails de phishing costumam usar \"spoofing\" para parecer que vêm de uma fonte confiável. Nosso analisador procura sinais de alerta comuns, como uma incompatibilidade entre o endereço \"From\" (o que o usuário vê) e o \"Return-Path\" (de onde o e-mail realmente veio). Também extraímos e analisamos URLs no corpo do e-mail para identificar links suspeitos, como aqueles que usam Punycode (domínios parecidos) ou endereços IP em vez de nomes de host.

Ao revisar a seção \"Findings\", você pode identificar rapidamente esses sinais e determinar se um e-mail é seguro para interagir.

", - p4: "", - }, cheatsheet: { title: "Referência rápida de autenticação de e-mail", h0: "O que essas verificações significam", @@ -2491,16 +2199,6 @@ export default { text9: "Cole o SQL primeiro.", text10: "✓ Copiado", }, - edu: { - heading1: "Por que formatar SQL?", - p1: "O SQL pode rapidamente se tornar complexo e difícil de ler, especialmente ao lidar com múltiplos joins, subconsultas e condições aninhadas. Formatar SQL envolve adicionar indentação consistente, quebras de linha e capitalização de palavras-chave. Isso torna a lógica da consulta muito mais fácil de acompanhar, o que é essencial para depuração, revisões de código e manutenção de grandes esquemas de banco de dados ao longo do tempo. Uma consulta bem formatada também é menos propensa a erros lógicos durante edições manuais.", - heading2: "Como usar esta ferramenta", - p2: "Cole sua consulta SQL bruta no editor Input SQL à esquerda. Selecione o dialeto do banco de dados (Postgres ou MySQL) e a caixa de palavras-chave preferida (UPPER ou lower). Clique no botão Format para embelezar sua consulta com indentação e espaçamento adequados. Use o botão Validate para verificar problemas estruturais comuns, como aspas não fechadas ou parênteses desbalanceados. Clique em Copy para salvar o SQL formatado na sua área de transferência ou em Clear para recomeçar.", - heading3: "Casos de uso comuns", - p3: "Revisões de código para formatar SQL bagunçado antes de enviar um pull request. Depuração para limpar consultas geradas por ORMs e entender exatamente o que está sendo executado no seu banco de dados. Documentação para criar exemplos claros e legíveis para guias técnicos, wikis ou arquivos README. Limpeza de sistemas legados para refatorar rapidamente scripts antigos e não formatados em um estilo moderno e legível.", - heading4: "Dicas avançadas", - p4: "Use Common Table Expressions (CTEs) com a cláusula WITH para dividir consultas complexas em partes menores e mais gerenciáveis. Sempre use aliases descritivos para tabelas e colunas para deixar clara a intenção da sua consulta. Use o botão Minify se precisar comprimir seu SQL em uma única linha para uso em arquivos de configuração ou ferramentas de linha de comando.", - }, cheatsheet: { title: "Dicas de formatação SQL", h0: "Ganhos rápidos", @@ -2569,16 +2267,6 @@ export default { text15: "Nota: os valores são mascarados por segurança. O diff é heurístico e não inclui comentários/ordem.", text16: "✓ Copiado", }, - edu: { - heading1: "Boas práticas para variáveis de ambiente", - heading2: "Gestão de segredos", - heading3: "Segurança do .env", - heading4: "Dicas avançadas", - p1: "

Variáveis de ambiente são uma parte fundamental da metodologia \"Twelve-Factor App\", que defende uma separação rígida entre configuração e código. Ao usar variáveis de ambiente, você pode executar o mesmo código em diferentes ambientes (desenvolvimento, staging, produção) apenas alterando os valores de configuração.

As boas práticas incluem usar nomes descritivos em maiúsculas (ex.: DATABASE_URL), fornecer valores padrão para configurações não críticas e nunca fixar informações sensíveis diretamente no controle de versão.

", - p2: "

Segredos são uma categoria especial de variáveis de ambiente que contêm informações sensíveis, como chaves de API, senhas de banco de dados e certificados privados. Gerenciá-los com segurança é fundamental para evitar vazamentos de dados. Você deve usar um serviço dedicado de gestão de segredos (como AWS Secrets Manager, HashiCorp Vault ou Cloudflare Secrets) para ambientes de produção.

Para desenvolvimento local, arquivos .env são comumente usados, mas nunca devem ser enviados ao seu repositório Git. Sempre adicione *.env ao seu arquivo .gitignore.

", - p3: "

Ao compartilhar arquivos .env com colegas de equipe para depuração, há um alto risco de expor acidentalmente segredos de produção. Nosso gerenciador ajuda a mitigar esse risco fornecendo um recurso \"Mask sensitive values\". Ele usa heurísticas para identificar chaves como SECRET, TOKEN ou PASSWORD e substitui seus valores por uma versão mascarada (ex.: ab...yz (32)).

Isso permite que você compare a estrutura e os valores não sensíveis dos seus arquivos de ambiente sem vazar os segredos reais.

", - p4: "", - }, cheatsheet: { title: "Notas sobre dotenv", h0: "Estratégia de mascaramento", @@ -2638,16 +2326,6 @@ export default { text7: "Nenhuma pré-visualização ainda.", text8: "✓ Copiado", }, - edu: { - heading1: "O que é SVG?", - p1: "SVG (Scalable Vector Graphics) é um formato de imagem vetorial baseado em XML para gráficos bidimensionais, com suporte a interatividade e animação. Diferente de formatos raster como JPEG ou PNG, os SVGs são definidos por caminhos matemáticos, o que significa que podem ser redimensionados para qualquer tamanho sem perder qualidade. Isso os torna perfeitos para logotipos, ícones e ilustrações na web, onde permanecem nítidos em qualquer dispositivo, de telas de celular a monitores de desktop de alta resolução.", - heading2: "Como usar esta ferramenta", - p2: "Cole seu código SVG na área de texto SVG Input à esquerda. Clique em Preview para ver o gráfico e extrair sua paleta de cores. Use os botões Optimize ou Minify para limpar o markup e reduzir o tamanho do arquivo. Opcionalmente, substitua cores específicas informando novos valores no painel Colors e clicando em Apply. Clique em Copy ou Download para salvar seu SVG higienizado e otimizado.", - heading3: "Casos de uso comuns", - p3: "Gerenciamento de ícones para limpar SVGs exportados de ferramentas de design como Figma ou Illustrator. Temas para alterar rapidamente as cores de um conjunto de ícones e combinar com a paleta da sua marca. Segurança para higienizar SVGs de fontes não confiáveis e remover possíveis scripts ou referências externas. Desempenho para minificar o markup SVG, reduzindo o tamanho de gráficos inline e melhorando os tempos de carregamento da página.", - heading4: "Dicas avançadas", - p4: "Use o botão currentColor para converter todos os fills e strokes explícitos para currentColor, tornando seu SVG facilmente estilizável via CSS. Sempre otimize seus SVGs antes de usá-los em produção para garantir que fiquem o menor possível. Ao criar SVGs em ferramentas de design, use os recursos Outline Stroke e Simplify Path para reduzir a complexidade do código gerado antes da otimização.", - }, cheatsheet: { title: "Notas de segurança do SVG", h0: "Higienização", @@ -2801,16 +2479,6 @@ export default { text28: "Clique em Scan para encontrar segredos.", text29: "✓ Copiado", }, - edu: { - heading1: "O que são vazamentos de segredos?", - p1: "Vazamentos de segredos ocorrem quando informações sensíveis, como chaves de API, senhas ou tokens privados, são acidentalmente enviadas ao controle de versão ou compartilhadas em fóruns públicos. Esses vazamentos podem levar a acesso não autorizado, violações de dados e perdas financeiras. Esta ferramenta ajuda a identificar padrões comuns de segredos localmente no seu navegador antes de você compartilhar ou fazer commit do seu código.", - heading2: "Como usar esta ferramenta", - p2: "Cole seu código, configuração ou arquivos de log na área de entrada. Clique no botão Scan para analisar o texto em busca de possíveis segredos. Revise os achados e as recomendações para cada item detectado. Use o botão Copy Redacted para obter uma versão compartilhável do seu texto com os segredos mascarados.", - heading3: "Casos de uso comuns", - p3: "Verificações pre-commit para escanear seu código antes de fazer commit e garantir que nenhum segredo seja incluído. Redação de logs para mascarar tokens sensíveis em logs antes de compartilhá-los com o suporte ou colegas de equipe. Auditoria de segurança para auditar rapidamente arquivos de configuração em busca de credenciais fixas no código.", - heading4: "Dicas avançadas", - p4: "Sempre rotacione suas credenciais imediatamente se descobrir que vazaram. Use variáveis de ambiente ou gerenciadores de segredos em vez de fixar segredos no seu código-fonte. Ative Include low severity patterns para um escaneamento mais completo, mas esteja preparado para mais falsos positivos.", - }, cheatsheet: { title: "O que fazer se você encontrar um segredo", h0: "Passos imediatos", @@ -2907,16 +2575,6 @@ export default { text15: "✓ Estrutura JWKS válida (", text16: "Cole um JWK.", }, - edu: { - heading1: "O que é um JWT?", - p1: "Um JSON Web Token (JWT) é um meio compacto e seguro para URLs de representar claims transferidas entre duas partes. Um JWT consiste em três partes codificadas em Base64URL separadas por pontos: o Header (algoritmo e tipo), o Payload (claims) e a Signature. A assinatura garante que o token não foi adulterado. JWTs são comumente usados para autenticação e troca de informações em APIs web. As claims padrão incluem sub (subject), iss (issuer), aud (audience), exp (expiration), nbf (not before), iat (issued at) e jti (JWT ID).", - heading2: "Algoritmos JWT", - p2: "HS256/384/512 usa HMAC com SHA-2 e um segredo compartilhado — simples, mas ambas as partes precisam ter a mesma chave. RS256/384/512 usa assinaturas assimétricas RSA PKCS#1 v1.5 — ideal para arquiteturas de microsserviços onde os serviços só precisam da chave pública. ES256/384/512 usa ECDSA com curvas NIST para assinaturas menores que RSA com segurança equivalente. PS256/384/512 usa RSA-PSS, uma variante probabilística preferida em vez de RS* em sistemas modernos.", - heading3: "JWK e JWKS", - p3: "Um JSON Web Key (JWK) é uma estrutura JSON que representa uma chave criptográfica. Um JWK Set (JWKS) é uma estrutura JSON contendo um array de JWKs na propriedade keys. Os serviços publicam seu JWKS em uma URL bem conhecida (ex.: /.well-known/jwks.json), permitindo que os clientes obtenham chaves públicas para verificação de JWT sem troca de chaves fora de banda. As chaves em um JWKS são identificadas pelo seu kid (Key ID), que os headers do JWT referenciam.", - heading4: "Boas práticas de segurança", - p4: "Sempre valide as claims exp, nbf, iss e aud no lado do servidor. Nunca use o algoritmo alg: none em produção — ele remove toda a proteção da assinatura. Prefira algoritmos assimétricos (RS*, ES*, PS*) em vez de HMAC quando múltiplos serviços precisarem verificar tokens. Rotacione as chaves regularmente e use o kid para identificar qual chave foi usada para assinar cada token. Armazene chaves privadas com segurança — nunca as envie para o controle de versão. Use tempos de expiração curtos e refresh tokens em vez de JWTs de longa duração.", - }, }, "encoding-workbench": { name: "Bancada de Codificação", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "Nenhuma camada de codificação reconhecível detectada.", }, - edu: { - heading1: "O que é codificação vs. hashing?", - heading2: "Como usar esta ferramenta", - heading3: "Codificação em camadas explicada", - heading4: "Guia de algoritmos de hash", - p1: "

Codificação transforma dados em uma representação diferente que pode ser revertida (decodificada). Formatos comuns incluem Base64 — usado para transmitir dados binários por canais de texto —, codificação URL, codificação de entidades HTML e hexadecimal. Codificação não é criptografia; ela não oferece confidencialidade.

Hashing é uma transformação matemática de mão única. Uma função de hash criptográfica recebe qualquer entrada e produz uma impressão digital de tamanho fixo. Não é possível reverter um hash para recuperar a entrada original. Hashes são usados para verificar a integridade de arquivos, armazenar senhas com segurança e gerar assinaturas digitais.

", - p2: "
  1. Aba Encode / Decode: cole um texto e escolha uma operação (Base64, URL, HTML, Hex), ou clique em Auto-Detect Layers para desfazer automaticamente múltiplas codificações aninhadas.
  2. Aba Hash: digite um texto ou selecione um arquivo, escolha algoritmos e clique em Hash All. Ative o modo HMAC para calcular hashes com chave usando um segredo compartilhado.
  3. Aba Identify: cole um hash ou string codificada desconhecida e clique em Identify para ver algoritmos prováveis com níveis de confiança.
", - p3: "

Dados do mundo real costumam ser codificados várias vezes. Por exemplo, um payload pode ser codificado em URL, depois em Base64, e então colocado dentro de uma string hex. O recurso Auto-Detect Layers inspeciona o padrão da entrada, tenta cada decodificação em sequência e visualiza cada etapa como um cartão, para que você veja exatamente como os dados foram envolvidos.

", - p4: "", - }, }, "oauth-debugger": { name: "Depurador OAuth", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "O que é PKCE e por que isso importa?", - p1: "

Proof Key for Code Exchange (PKCE, RFC 7636) foi originalmente projetado para apps móveis e nativos que não conseguem armazenar um client secret com segurança. Funciona fazendo o cliente gerar um code_verifier aleatório, derivar dele um code_challenge (SHA-256 + base64url) e enviar o challenge junto com a requisição de autorização. Ao trocar o código de autorização por tokens, o cliente envia o code_verifier original. O servidor de autorização verifica se ele corresponde ao challenge anterior — provando que a requisição de token veio do mesmo cliente que iniciou o fluxo.

Mesmo para clientes confidenciais (aplicações server-side com um client secret), o PKCE agora é recomendado pelo OAuth 2.1 como defesa contra ataques de interceptação de código de autorização.

", - heading2: "Por que o fluxo Implicit está obsoleto?", - p2: "

O fluxo implícito (response_type=token) foi projetado como um atalho para single-page apps, retornando o access token diretamente no fragmento da URL. Isso cria problemas sérios: tokens em URLs aparecem no histórico do navegador, logs de servidor e headers de referrer, e o fluxo é vulnerável a ataques de injeção de token. O OAuth 2.0 Security Best Current Practice (RFC 9700) e o OAuth 2.1 removem explicitamente o fluxo implícito em favor do Authorization Code + PKCE, que SPAs podem usar com segurança sem um client secret.

", - heading3: "Principais mudanças do OAuth 2.1", - p3: "", - heading4: "Fluxo Authorization Code passo a passo", - p4: "
  1. Gere o par PKCE: crie um code_verifier aleatório e calcule code_challenge = BASE64URL(SHA256(code_verifier)).
  2. Redirecione para o endpoint de autorização: inclua response_type=code, client_id, redirect_uri, scope, state, code_challenge e code_challenge_method=S256.
  3. O usuário se autentica no servidor de autorização e concede o consentimento.
  4. Receba o código de autorização no seu redirect_uri junto com o state ecoado — verifique se o state corresponde ao que você enviou.
  5. Troque o código por tokens: faça um POST para o endpoint de token com grant_type=authorization_code, code, redirect_uri, client_id e code_verifier.
  6. Receba o access token (e, opcionalmente, id_token e refresh_token) e use-os para chamar APIs.
", - }, }, "ladder-game": { name: "Jogo da Escada", diff --git a/src/i18n/vi.js b/src/i18n/vi.js index 9b8f880..392a2af 100644 --- a/src/i18n/vi.js +++ b/src/i18n/vi.js @@ -90,16 +90,6 @@ export default { text7: "✓ Đã sao chép", tpl8: "Độ sâu tối đa", }, - edu: { - heading1: "JSON là gì?", - p1: "

JSON (JavaScript Object Notation) là định dạng trao đổi dữ liệu nhẹ, dễ đọc và viết cho người dùng, đồng thời dễ phân tích và tạo ra cho máy tính. Nó dựa trên một tập hợp con của Chuẩn ngôn ngữ lập trình JavaScript. JSON là định dạng văn bản hoàn toàn độc lập với ngôn ngữ nhưng sử dụng các quy ước quen thuộc với lập trình viên các ngôn ngữ họ C.

Những đặc tính này khiến JSON trở thành ngôn ngữ trao đổi dữ liệu lý tưởng cho ứng dụng web, API và tệp cấu hình. Nó đã trở thành tiêu chuẩn thực tế cho trao đổi dữ liệu trên web, thay thế rộng rãi XML nhờ kích thước nhỏ hơn và hiệu suất tốt hơn.

", - heading2: "Cách sử dụng công cụ này", - p2: "
  1. Dán dữ liệu JSON thô hoặc lộn xộn của bạn vào trình soạn thảo bên trái.
  2. Nhấp Format để làm đẹp mã với thụt lề đúng và tô sáng cú pháp.
  3. Hoặc dùng Minify để xóa tất cả khoảng trắng cho mục đích sản xuất.
  4. Kiểm tra chỉ báo Trạng thái để đảm bảo JSON của bạn hợp lệ; nếu có lỗi, công cụ sẽ làm nổi bật đúng dòng đó.
  5. Nhấp Copy để lưu kết quả đã định dạng vào clipboard hoặc Clear để bắt đầu lại.
", - heading3: "Các trường hợp sử dụng phổ biến", - p3: "", - heading4: "Mẹo chuyên nghiệp", - p4: "", - }, }, "jwt-decoder": { name: "Trình Kiểm Tra JWT", @@ -139,22 +129,6 @@ export default { status5: "Thuật toán: ", status6: "Giải mã thất bại", }, - edu: { - heading1: "JWT là gì?", - p1: "

JSON Web Token (JWT) là một chuẩn mở (RFC 7519) định nghĩa cách thức gọn nhẹ và độc lập để truyền tải thông tin an toàn giữa các bên dưới dạng đối tượng JSON. Thông tin này có thể được xác minh và tin cậy vì nó được ký số. JWT có thể được ký bằng khóa bí mật (dùng thuật toán HMAC) hoặc cặp khóa công khai/riêng tư dùng RSA hoặc ECDSA.

Nhờ kích thước gọn nhẹ, JWT thường được dùng trong các kịch bản xác thực và trao đổi thông tin, chẳng hạn như Bearer token trong header HTTP Authorization.

", - heading2: "Cách sử dụng công cụ này", - p2: "
  1. Dán token của bạn: Sao chép JWT đã mã hóa (header.payload.signature) và dán vào ô nhập liệu.
  2. Tự động giải mã: Công cụ sẽ tự động nhận diện token và giải mã các thành phần theo thời gian thực.
  3. Kiểm tra Header: Xem thuật toán (alg) và loại token (typ) trong phần Header.
  4. Phân tích Payload: Xem xét các claim, chẳng hạn như thời gian hết hạn (exp), nhà phát hành (iss), và chủ thể (sub) trong phần Payload.
  5. Xác minh Claim: Kiểm tra ô Phân tích Claim để xem ngày tháng dễ đọc và trạng thái xác thực.
", - heading3: "Trường hợp sử dụng phổ biến", - p3: "", - heading4: "Mẹo hay", - p4: "", - heading5: "Cấu trúc Token (header.payload.signature)", - p5: "

Một JWT thường gồm ba phần ngăn cách bởi dấu chấm:

", - heading6: "Lưu ý về bảo mật", - p6: "

Mặc dù JWT được ký để đảm bảo tính toàn vẹn, chúng thường KHÔNG được mã hóa. Điều này có nghĩa là bất kỳ ai có token đều có thể giải mã header và payload để đọc thông tin bên trong. Không bao giờ lưu thông tin nhạy cảm như mật khẩu hoặc khóa riêng tư trong payload của JWT.

Ngoài ra, luôn xác minh claim exp (thời gian hết hạn) để ngăn chặn tấn công replay, và đảm bảo máy chủ của bạn xác thực chữ ký trước khi tin tưởng dữ liệu trong payload.

", - heading7: "Mẹo hay", - p7: "", - }, cheatsheet: { title: "Tham khảo nhanh JWT", h0: "Cấu trúc", @@ -193,16 +167,6 @@ export default { text0: "✓ Đã sao chép!", tpl1: "GUID:", }, - edu: { - heading1: "UUID là gì?", - p1: "Universally Unique Identifier (UUID) là một số 128-bit dùng để định danh duy nhất thông tin trong các hệ thống máy tính. Chúng được thiết kế để tạo ra độc lập mà không cần một cơ quan trung tâm, trong khi vẫn duy trì xác suất trùng lặp gần như bằng không.", - heading2: "Cách sử dụng công cụ này", - p2: "Chọn phiên bản UUID (v1 cho dạng dựa trên thời gian, v4 cho ngẫu nhiên) và số lượng ID bạn cần. Nhấp Tạo để tạo danh sách mã định danh duy nhất, sẵn sàng sử dụng trong cơ sở dữ liệu hoặc ứng dụng của bạn.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Khóa chính trong cơ sở dữ liệu phân tán, mã định danh phiên, theo dõi giao dịch, và đặt tên cho tệp tạm hoặc tài nguyên khi tính duy nhất là yếu tố quan trọng trên nhiều hệ thống.", - heading4: "Mẹo hay", - p4: "UUID v4 là lựa chọn phổ biến nhất cho mã định danh duy nhất dùng chung vì nó dựa vào tính ngẫu nhiên chất lượng cao. Sử dụng v1 nếu bạn cần sắp xếp ID theo thời gian tạo.", - }, }, "password-generator": { name: "Trình Tạo Mật Khẩu", @@ -265,24 +229,6 @@ export default { status6: "Yếu", text1: "Vui lòng nhập địa chỉ email gốc hợp lệ.", }, - edu: { - heading1: "Điều gì làm cho mật khẩu trở nên an toàn?", - p1: "

Mật khẩu an toàn là tuyến phòng thủ đầu tiên của bạn chống lại truy cập trái phép. Trong thời đại tính toán tốc độ cao hiện nay, bảo mật được định nghĩa bởi entropy — thước đo tính ngẫu nhiên và khó đoán của một chuỗi ký tự. Mật khẩu mạnh phải dài (ít nhất 16 ký tự), duy nhất cho mỗi tài khoản và bao gồm nhiều loại ký tự khác nhau như chữ hoa, chữ thường, số và ký tự đặc biệt.

Tránh sử dụng thông tin cá nhân như ngày sinh, tên thú cưng hoặc các từ thông thường trong từ điển. Ngay cả những thay thế có vẻ phức tạp như P@ssw0rd123 cũng dễ dàng bị phá vỡ bởi các công cụ brute-force hiện đại sử dụng từ điển khổng lồ các mẫu phổ biến.

", - heading2: "Cách sử dụng công cụ này", - p2: "
  1. Chọn chế độ: Chọn giữa Mật khẩu, Tên đăng nhập, Cụm mật khẩu hoặc Bí danh email tùy theo nhu cầu.
  2. Điều chỉnh độ dài: Dùng thanh trượt để đặt độ dài mong muốn. Với mật khẩu, 16+ ký tự được khuyến nghị cho bảo mật cao.
  3. Cấu hình tùy chọn: Bật/tắt các bộ ký tự (ký tự đặc biệt, số, v.v.) hoặc kiểu (dễ đọc vs. an toàn).
  4. Tạo: Nhấp nút Tạo để tạo thông tin đăng nhập độc đáo của bạn.
  5. Sao chép: Dùng biểu tượng sao chép để chuyển kết quả an toàn vào clipboard hoặc trình quản lý mật khẩu.
", - heading3: "Các trường hợp sử dụng phổ biến", - p3: "", - heading4: "Mẹo chuyên nghiệp", - p4: "", - heading5: "Điều gì làm cho mật khẩu trở nên an toàn?", - p5: "

Mật khẩu an toàn là tuyến phòng thủ đầu tiên của bạn. Entropy là thước đo tính ngẫu nhiên của mật khẩu. Mật khẩu mạnh phải dài, độc đáo và đa dạng ký tự.

", - heading6: "Giải thích về Entropy", - p6: "

Entropy là thước đo tính ngẫu nhiên và khó đoán của mật khẩu, thường được biểu thị bằng bit. Entropy càng cao, mật khẩu càng mạnh. Bộ tạo của chúng tôi tính toán entropy theo thời gian thực để cung cấp đánh giá khách quan về độ mạnh mật khẩu của bạn.

", - heading7: "Thực hành tốt nhất", - p7: "", - heading8: "Mẹo chuyên nghiệp", - p8: "", - }, }, "hash-calculator": { name: "Máy Tính Hash", @@ -350,16 +296,6 @@ export default { tpl4: "Đang chờ dữ liệu đầu vào...", text2: "Đã tính: ", }, - edu: { - heading1: "Hashing là gì?", - p1: "

Hashing mật mã học là một quá trình toán học biến đổi bất kỳ dữ liệu đầu vào nào (văn bản hoặc tệp) thành một chuỗi ký tự có độ dài cố định, thường là một số thập lục phân. Dấu vân tay này là duy nhất đối với dữ liệu đầu vào; chỉ cần thay đổi một bit trong dữ liệu gốc cũng sẽ tạo ra một hash hoàn toàn khác, hiện tượng này được gọi là hiệu ứng tuyết lở.

Khác với mã hóa, hashing là một hàm một chiều. Bạn không thể đảo ngược hash để lấy lại dữ liệu gốc. Điều này khiến nó trở nên lý tưởng để xác minh tính toàn vẹn dữ liệu, lưu trữ mật khẩu an toàn (khi kết hợp với salt), và nhận diện tệp mà không cần để lộ nội dung của chúng.

", - heading2: "Cách sử dụng công cụ này", - p2: "
  1. Chọn loại dữ liệu đầu vào: Chọn tab Văn bản cho chuỗi ký tự hoặc tab Tệp cho tệp cục bộ.
  2. Cung cấp dữ liệu: Dán văn bản hoặc kéo thả tệp vào khu vực làm việc.
  3. HMAC tùy chọn: Nhập khóa bí mật vào ô HMAC nếu bạn cần tạo hash có khóa để xác thực.
  4. Xem kết quả: Công cụ tự động tính nhiều biến thể hash (SHA-256, SHA-512, v.v.) theo thời gian thực.
  5. Xác minh tính toàn vẹn: Dùng tab Xác minh để so sánh một hash đã biết với dữ liệu đầu vào của bạn nhằm kiểm tra sự can thiệp.
", - heading3: "Trường hợp sử dụng phổ biến", - p3: "", - heading4: "Mẹo hay", - p4: "", - }, cheatsheet: { title: "Tham khảo thuật toán Hash", h0: "So sánh thuật toán", @@ -435,16 +371,6 @@ export default { text5: "Sử dụng ít nhất /", text6: "IPv6 /", }, - edu: { - heading1: "CIDR là gì?", - heading2: "Cách sử dụng công cụ này", - heading3: "Các trường hợp sử dụng phổ biến", - heading4: "Mẹo chuyên nghiệp", - p1: "Classless Inter-Domain Routing (CIDR) là phương pháp phân bổ địa chỉ IP và định tuyến IP. Nó thay thế hệ thống cũ dựa trên lớp (A, B và C) để cung cấp tính linh hoạt và hiệu quả hơn trong phân phối địa chỉ.", - p2: "Nhập địa chỉ IP với tiền tố (vd: 192.168.1.0/24) hoặc dùng thanh trượt để điều chỉnh độ dài tiền tố. Nhấp \"Run analysis\" để xem chi tiết mạng, dải host khả dụng và biểu diễn nhị phân.", - p3: "Lập kế hoạch subnet mạng cho hạ tầng đám mây (VPC), khắc phục sự cố định tuyến, tính toán dung lượng host cho một tiền tố nhất định và chuyển đổi giữa CIDR và mặt nạ subnet.", - p4: "Hãy nhớ rằng trong IPv4, địa chỉ đầu tiên và cuối cùng trong một subnet thường được dành cho ID mạng và địa chỉ broadcast. Trong IPv6, các subnet hầu như luôn là /64 cho mạng cục bộ chuẩn.", - }, cheatsheet: { title: "Tham chiếu nhanh về subnet", h0: "Các subnet phổ biến", @@ -619,16 +545,6 @@ export default { tpl3: "Đổi mặc định:", tpl4: "Không tìm thấy cổng nào khớp với tìm kiếm của bạn.", }, - edu: { - heading1: "Danh mục cổng & Hướng dẫn bảo mật", - p1: "Cổng well-known (0-1023) được IANA cấp và yêu cầu quyền root trên hệ thống Unix. Cổng registered (1024-49151) được ứng dụng sử dụng. Cổng dynamic/ephemeral (49152-65535) được dùng cho kết nối phía client. Hiểu rõ các dải cổng là điều cần thiết để cấu hình tường lửa và bảo mật mạng.", - heading2: "Cách sử dụng công cụ này", - p2: "Tìm theo số cổng hoặc tên dịch vụ để xem chi tiết giao thức và mức độ rủi ro bảo mật. Lọc theo danh mục (Well-Known, Registered, Dynamic) hoặc giao thức (TCP/UDP) để thu hẹp kết quả. Nhấp vào bất kỳ hàng nào để xem chi tiết đầy đủ bao gồm các lỗ hổng phổ biến và khuyến nghị tăng cường bảo mật.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Cấu hình quy tắc tường lửa, khắc phục sự cố mạng, xác định các cổng mở bất thường trong quá trình kiểm toán bảo mật, và tham khảo nhanh về việc gán cổng giao thức.", - heading4: "Mẹo hay", - p4: "Sử dụng bộ lọc rủi ro để nhanh chóng xác định các cổng rủi ro cao trong mạng của bạn. Phần 50 cổng phổ biến nhất cho bạn cái nhìn tổng quan tức thì về các dịch vụ được sử dụng thường xuyên nhất.", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
CổngDịch vụRủi ro
21FTPTruyền tệp không được mã hoá
23TelnetXác thực bằng văn bản thuần
25SMTPRủi ro chuyển tiếp thư rác
53DNSTấn công khuếch đại DDoS
445SMBLây lan mã độc tống tiền
3389RDPTấn công dò mật khẩu
", @@ -872,16 +788,6 @@ export default { text4: "Cảnh báo", alert0: "Vui lòng tạo cấu hình trước", }, - edu: { - heading1: "Về WireGuard", - p1: "WireGuard là một giao thức VPN hiện đại, hiệu năng cao sử dụng mật mã học tiên tiến. Nó được thiết kế để đơn giản và nhanh hơn các giao thức cũ như OpenVPN và IPsec, với bề mặt tấn công nhỏ hơn nhiều nhờ codebase tối giản. WireGuard hiện đã là một phần của nhân Linux và được hỗ trợ gốc trên Windows, macOS, iOS và Android.", - heading2: "Cách sử dụng công cụ này", - p2: "Chọn một mẫu cấu trúc liên kết (Point-to-Point, Hub-and-Spoke, Site-to-Site, hoặc Road Warrior) để điền sẵn cấu hình. Nhấp Tạo khóa để tạo cặp khóa mới cục bộ trong trình duyệt của bạn. Điền các trường bắt buộc và nhấp Tạo cấu hình để tạo tệp cấu hình WireGuard. Dùng Tải xuống .conf để lưu tệp hoặc Tạo mã QR để tạo mã QR nhập trên di động.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "VPN truy cập từ xa cho nhân viên kết nối vào mạng công ty. VPN site-to-site để kết nối mạng các văn phòng chi nhánh. Máy chủ VPN cá nhân để duyệt web an toàn trên Wi-Fi công cộng. Tunneling thiết bị IoT để giao tiếp an toàn giữa các thiết bị nhúng.", - heading4: "Mẹo hay", - p4: "Sử dụng PersistentKeepalive = 25 trên các client sau NAT để duy trì tunnel khi không có lưu lượng đi qua. PresharedKey thêm một lớp mã hóa đối xứng bổ sung để chống lại tấn công hậu lượng tử. AllowedIPs = 0.0.0.0/0 định tuyến toàn bộ lưu lượng qua tunnel (full tunnel), trong khi các CIDR cụ thể tạo ra split tunnel.", - }, cheatsheet: { title: "Tham khảo nhanh WireGuard", h0: "Trường Interface", @@ -1025,14 +931,6 @@ export default { tpl6: "Ví dụ:", tpl7: "Nhấp vào bất kỳ trường nào trong sơ đồ để xem chi tiết.", }, - edu: { - heading1: "Header giao thức là gì?", - p1: "Header giao thức là dữ liệu có cấu trúc đứng trước payload trong các gói tin mạng. Chúng chứa thông tin điều khiển như địa chỉ nguồn và đích, loại giao thức, số thứ tự, và checksum. Hiểu rõ cấu trúc header là điều cần thiết để gỡ lỗi mạng, phân tích gói tin, và triển khai giao thức.", - heading2: "Cách sử dụng công cụ này", - p2: "Chọn một giao thức từ các tab để xem cấu trúc header của nó. Mỗi khối màu đại diện cho một trường với kích thước được hiển thị. Nhấp vào bất kỳ trường nào để xem thông tin chi tiết bao gồm tên trường và mô tả, offset bit/byte, các giá trị phổ biến và ý nghĩa của chúng, và tham chiếu RFC. Dùng trình phân tích hex dump để phân tích các gói tin thực tế bằng cách dán kết quả hex từ các công cụ như tcpdump hoặc Wireshark.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Phân tích gói tin để hiểu cấu trúc của lưu lượng mạng đã bắt được, học giao thức như một công cụ hỗ trợ trực quan để nghiên cứu các giao thức mạng, gỡ lỗi để xác định header bị lỗi hoặc giá trị trường không chính xác, và tham khảo phát triển khi triển khai các giao thức mạng.", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
Giá trịGiao thức
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
TrườngKích thướcMô tả
Source Port2 byteSố cổng bên gửi
Dest Port2 byteSố cổng bên nhận
Seq Number4 byteSố thứ tự
Ack Number4 byteSố xác nhận
Data Offset4 bitĐộ dài tiêu đề / 4
Flags9 bitNS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 byteKích thước cửa sổ nhận
", @@ -1108,16 +1006,6 @@ export default { tpl0: "Khác biệt", tpl1: "Không tìm thấy khác biệt (hoặc dữ liệu đầu vào trống)", }, - edu: { - heading1: "So sánh văn bản (Text Diffing) là gì?", - p1: "So sánh văn bản là quá trình so sánh hai chuỗi dữ liệu để xác định sự khác biệt giữa chúng. Nó làm nổi bật những gì đã được thêm vào, xóa bỏ, hoặc sửa đổi. Đây là một thao tác cơ bản trong phát triển phần mềm, phân tích dữ liệu, và quản lý nội dung, cho phép người dùng theo dõi thay đổi theo thời gian hoặc so sánh các phiên bản khác nhau của một tài liệu.", - heading2: "Thuật toán Diff", - p2: "Hầu hết các công cụ so sánh văn bản đều sử dụng thuật toán dựa trên bài toán Dãy con chung dài nhất (Longest Common Subsequence - LCS). Mục tiêu là tìm dãy phần tử dài nhất xuất hiện trong cả hai văn bản theo cùng thứ tự tương đối. Các triển khai phổ biến bao gồm thuật toán Myers diff, rất hiệu quả và được Git sử dụng, và thuật toán Hunt-McIlroy. Các thuật toán này tính toán số lượng chỉnh sửa tối thiểu cần thiết để biến đổi văn bản này thành văn bản khác.", - heading3: "Trường hợp sử dụng", - p3: "Code review để nhà phát triển có thể xem chính xác những gì đã thay đổi trong một pull request. Hệ thống quản lý phiên bản như Git lưu trữ lịch sử dưới dạng chuỗi các diff để tiết kiệm dung lượng. Kiểm toán nội dung cho người viết và biên tập viên so sánh các bản nháp để đảm bảo tất cả các thay đổi yêu cầu đã được thực hiện. Xác thực dữ liệu để so sánh tệp cấu hình hoặc dữ liệu xuất từ cơ sở dữ liệu nhằm tìm ra sự khác biệt.", - heading4: "Mẹo hay", - p4: "Nhiều công cụ diff có tùy chọn bỏ qua các thay đổi về thụt lề hoặc khoảng trắng cuối dòng, giúp giảm nhiễu khi so sánh mã. Bao gồm một vài dòng văn bản không thay đổi xung quanh các khác biệt (dòng ngữ cảnh) để hiểu tác động của các thay đổi. Diff cấp từ thường hữu ích hơn cho văn xuôi và tài liệu ngôn ngữ tự nhiên, trong khi diff cấp dòng là tiêu chuẩn cho mã nguồn.", - }, }, "regex-visualizer": { name: "Trực Quan Hóa Regex", @@ -1168,16 +1056,6 @@ export default { tpl5: "Không có nhóm", tpl6: "Biểu thức chính quy không hợp lệ", }, - edu: { - heading1: "Biểu thức chính quy là gì?", - p1: "Biểu thức chính quy (regex) là các mẫu mạnh mẽ dùng để khớp các tổ hợp ký tự trong chuỗi. Chúng là công cụ thiết yếu để xử lý văn bản, xác thực, và trích xuất dữ liệu trên nhiều ngôn ngữ lập trình. Mẫu regex bao gồm các ký tự chữ và các siêu ký tự đặc biệt định nghĩa quy tắc tìm kiếm. Chúng được dùng trong xác thực biểu mẫu, phân tích log, thao tác tìm và thay thế, và các tác vụ làm sạch dữ liệu.", - heading2: "Cách sử dụng công cụ này", - p2: "Nhập mẫu regex của bạn vào ô nhập liệu. Công cụ sẽ tự động tạo sơ đồ railroad trực quan hóa cấu trúc mẫu. Thêm văn bản kiểm tra để xem việc tô sáng kết quả khớp và giải thích theo thời gian thực. Dùng bảng tham khảo nhanh để tra cứu các mẫu và cú pháp phổ biến. Tạo đoạn mã cho ngôn ngữ lập trình bạn ưa thích.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Xác thực email để đảm bảo dữ liệu người dùng nhập khớp đúng định dạng email trước khi xử lý, phân tích log để trích xuất dấu thời gian và địa chỉ IP từ nhật ký máy chủ, làm sạch dữ liệu để loại bỏ ký tự không mong muốn hoặc định dạng số điện thoại nhất quán, và tìm và thay thế cho các phép biến đổi văn bản hàng loạt bằng khớp mẫu.", - heading4: "Mẹo hay", - p4: "Bắt đầu đơn giản và xây dựng các mẫu phức tạp dần dần. Sử dụng nhóm không bắt (?:) khi bạn không cần tham chiếu đến kết quả khớp. Kiểm tra các trường hợp biên như chuỗi rỗng và ký tự đặc biệt. Cân nhắc khả năng đọc của regex — các mẫu phức tạp có thể được ghi chú bằng comment.", - }, cheatsheet: { title: "Tham khảo nhanh Regex", h0: "Lớp ký tự", @@ -1323,16 +1201,6 @@ export default { text1: "Sao chép", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "Cron Job là gì?", - p1: "Cron job là trình lập lịch tác vụ dựa trên thời gian trong các hệ điều hành giống Unix. Nó được dùng để chạy lệnh hoặc script tự động vào các thời điểm hoặc khoảng thời gian đã lên lịch. Tên xuất phát từ Chronos, thần thời gian trong thần thoại Hy Lạp. Cron job rất cần thiết cho tự động hóa hệ thống, như lập lịch sao lưu, gửi báo cáo qua email hoặc dọn dẹp tệp tạm thời.", - heading2: "Cách sử dụng công cụ này", - p2: "Chọn tab thích hợp (Phút, Giờ, Ngày, Tháng, Tuần) để cấu hình từng phần của biểu thức. Chọn 'Mỗi' cho ký tự đại diện (*) hoặc nhập các giá trị cụ thể. Biểu thức cron được cập nhật theo thời gian thực ở trên cùng. Dùng bản xem trước 'Lần chạy tiếp theo' để xác minh lịch trình của bạn hoạt động như mong đợi. Sao chép biểu thức đã hoàn thiện vào clipboard chỉ bằng một cú nhấp.", - heading3: "Các trường hợp sử dụng phổ biến", - p3: "Sao lưu cơ sở dữ liệu theo lịch mỗi ngày vào lúc nửa đêm. Tạo báo cáo mỗi sáng thứ Hai. Dọn dẹp tệp log mỗi giờ. Gửi thông báo kiểm tra sức khỏe mỗi 5 phút. Làm mới bộ nhớ đệm hàng ngày vào các thời điểm cụ thể.", - heading4: "Mẹo chuyên nghiệp", - p4: "Luôn kiểm tra biểu thức cron của bạn với một công cụ như thế này trước khi triển khai vào sản xuất. Hãy nhớ rằng cron job chạy theo múi giờ địa phương của máy chủ, điều này có thể gây vấn đề trong các hệ thống phân tán. Luôn ghi lại cron job của bạn bằng comment trong crontab để làm rõ mục đích của chúng cho tham khảo sau này.", - }, cheatsheet: { title: "Tham khảo nhanh khóa SSH", h0: "Loại khóa", @@ -1372,16 +1240,6 @@ export default { tpl2: "Không có Tên thay thế của chủ thể.", tpl3: "Không có phần mở rộng nào được phân tích.", }, - edu: { - heading1: "Chứng chỉ X.509 là gì?", - heading2: "Cách sử dụng công cụ này", - heading3: "Trường hợp sử dụng phổ biến", - heading4: "Mẹo hay", - p1: "

X.509 là định dạng chuẩn cho chứng chỉ khóa công khai, là các tài liệu số liên kết an toàn một khóa công khai với một danh tính (như website, tổ chức, hoặc cá nhân). Các chứng chỉ này là nền tảng của Hạ tầng khóa công khai (PKI) được dùng để bảo mật internet qua HTTPS, cũng như để ký email và phần mềm.

Một chứng chỉ X.509 chứa khóa công khai, danh tính của chủ sở hữu chứng chỉ, và chữ ký số của Tổ chức chứng thực (CA) đã cấp chứng chỉ, chứng minh tính xác thực của nó.

", - p2: "
  1. Dán chứng chỉ của bạn: Sao chép chứng chỉ mã hóa PEM (bao gồm cả header BEGIN và END) và dán vào ô nhập liệu.
  2. Phân tích: Nhấp \"Phân tích chứng chỉ\" để trích xuất và phân tích dữ liệu.
  3. Xem tóm tắt: Kiểm tra các thẻ ở trên cùng để xem Tên thông thường (CN), Nhà phát hành, và ngày hiệu lực.
  4. Kiểm tra chi tiết: Mở rộng các phần bên dưới để xem đầy đủ Chủ thể, Nhà phát hành, SAN, và các phần mở rộng kỹ thuật.
  5. Kiểm tra trạng thái: Xem huy hiệu trạng thái để biết chứng chỉ hiện đang hợp lệ hay đã hết hạn.
", - p3: "", - p4: "", - }, cheatsheet: { title: "Tham khảo chứng chỉ X.509", h0: "Trường chứng chỉ", @@ -1424,16 +1282,6 @@ export default { text1: "Sao chép JSON", text2: "Sao chép XML", }, - edu: { - heading1: "SAML là gì?", - p1: "Security Assertion Markup Language (SAML) là một chuẩn mở dựa trên XML dùng để trao đổi dữ liệu xác thực và ủy quyền giữa các bên, đặc biệt là giữa Nhà cung cấp danh tính (IdP) và Nhà cung cấp dịch vụ (SP). SAML là nền tảng của nhiều giải pháp Single Sign-On (SSO) doanh nghiệp, cho phép người dùng truy cập nhiều ứng dụng chỉ với một bộ thông tin đăng nhập. Phiên bản phổ biến nhất là SAML 2.0, sử dụng token bảo mật chứa các assertion để truyền thông tin về một principal giữa IdP và SP.", - heading2: "Cách sử dụng công cụ này", - p2: "Dán SAMLResponse mã hóa Base64 hoặc XML thô vào ô nhập liệu. Bật tùy chọn Thử giải nén nếu bạn đang giải mã payload theo binding Redirect. Nhấp Giải mã phản hồi để phân tích thông điệp. Kiểm tra Tóm tắt nhanh để xem Nhà phát hành, Chủ thể, và trạng thái hiệu lực. Xem các thuộc tính người dùng đã giải mã trong bảng Thuộc tính. Dùng các tab để xem XML định dạng đẹp, Chi tiết Assertion, hoặc biểu diễn JSON của các claim.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Khắc phục sự cố SSO bằng cách chẩn đoán lý do người dùng không thể đăng nhập, kiểm tra assertion hết hạn hoặc không khớp audience. Kiểm thử tích hợp để xác minh Nhà cung cấp danh tính của bạn đang gửi đúng thuộc tính. Kiểm toán bảo mật để kiểm tra XML thô và đảm bảo các assertion được ký đúng cách. Phát triển để nhanh chóng xem nội dung của một thông điệp SAML trong quá trình tích hợp Nhà cung cấp dịch vụ.", - heading4: "Mẹo hay", - p4: "Các thông điệp SAML gửi qua HTTP-Redirect thường được nén (deflate) trước khi mã hóa Base64 — nếu việc giải mã của bạn thất bại, hãy thử bật ô Thử giải nén. Đảm bảo AudienceRestriction khớp với SP Entity ID của bạn. Nếu một phản hồi bị đánh dấu không hợp lệ, hãy kiểm tra thời gian NotBefore và NotOnOrAfter để xem có lệch đồng hồ giữa IdP và SP hay không.", - }, cheatsheet: { title: "Tham khảo nhanh SAML", h0: "Luồng SAML", @@ -1476,16 +1324,6 @@ export default { alert1: "Vui lòng nhập chuỗi User-Agent", tpl2: "Kết quả phân tích thô", }, - edu: { - heading1: "User-Agent là gì?", - p1: "User-Agent là một chuỗi được trình duyệt của bạn gửi đến mọi website bạn truy cập. Nó xác định phiên bản trình duyệt, hệ điều hành, và loại thiết bị, cho phép máy chủ tối ưu hóa nội dung cho môi trường cụ thể của bạn.", - heading2: "Cách sử dụng công cụ này", - p2: "Dán một chuỗi User-Agent vào ô nhập liệu hoặc nhấp Dùng cái này để phân tích chuỗi trình duyệt hiện tại của bạn. Công cụ sẽ phân tích chi tiết engine trình duyệt, phiên bản hệ điều hành, và đặc điểm thiết bị.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Gỡ lỗi các vấn đề tương thích website, phân tích nhật ký máy chủ web để xác định lưu lượng bot, xác minh giả mạo trình duyệt, và hiểu phân bố thiết bị của đối tượng người dùng.", - heading4: "Mẹo hay", - p4: "Nhiều trình duyệt hiện đại đóng băng hoặc đơn giản hóa chuỗi User-Agent của họ để ngăn chặn fingerprinting. Luôn tìm token Version hoặc Chrome để có thông tin phiên bản chính xác nhất.", - }, }, "qr-code": { name: "Trình Tạo Mã QR", @@ -1524,16 +1362,6 @@ export default { alert3: "Đã sao chép!", tpl4: "Tải ảnh lên để giải mã", }, - edu: { - heading1: "Mã QR là gì?", - p1: "Mã Quick Response (QR) là mã vạch hai chiều có thể lưu trữ nhiều loại dữ liệu khác nhau, phổ biến nhất là URL. Chúng có thể được quét bằng điện thoại thông minh và các đầu đọc chuyên dụng để truy cập thông tin nhanh chóng hoặc kích hoạt các hành động.", - heading2: "Cách sử dụng công cụ này", - p2: "Nhập văn bản hoặc URL bạn muốn mã hóa. Điều chỉnh kích thước và mức sửa lỗi nếu cần. Mã QR cập nhật theo thời gian thực và có thể tải xuống dưới dạng ảnh để in hoặc sử dụng kỹ thuật số.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Chia sẻ liên kết website, cung cấp thông tin đăng nhập Wi-Fi, danh thiếp số (vCard), vé sự kiện, và các luồng thanh toán di động hoặc xác thực.", - heading4: "Mẹo hay", - p4: "Mức sửa lỗi cao hơn (H hoặc Q) cho phép mã QR vẫn quét được ngay cả khi bị hỏng một phần hoặc bị che khuất, lý tưởng cho biển hiệu vật lý hoặc thương hiệu.", - }, }, "timestamp-converter": { name: "Chuyển Đổi Dấu Thời Gian", @@ -1564,16 +1392,6 @@ export default { text0: "Dấu thời gian không hợp lệ", tpl1: "Unix (mili giây)", }, - edu: { - heading1: "Unix Time là gì?", - p1: "Unix time (còn gọi là Epoch time, POSIX time hoặc Unix timestamp) là hệ thống mô tả một thời điểm cụ thể. Đây là số giây đã trôi qua kể từ Unix Epoch, trừ giây nhuận; Unix Epoch là 00:00:00 UTC ngày 1 tháng 1 năm 1970. Nó được sử dụng rộng rãi trong hệ điều hành và định dạng tệp vì là một số nguyên đơn, giúp máy tính dễ dàng lưu trữ và xử lý. Tiêu chuẩn này cho phép các hệ thống khác nhau truyền đạt thời gian chính xác bất kể cài đặt múi giờ địa phương.", - heading2: "Cách sử dụng công cụ này", - p2: "Để chuyển đổi Unix sang ngày đọc được: Nhập timestamp vào trường Unix Timestamp và chọn đơn vị là giây hay mili giây. Để chuyển đổi ngày đọc được sang Unix: Chọn ngày và giờ bằng bộ chọn, sau đó chọn múi giờ mong muốn. Dùng nút Now để nhanh chóng lấy timestamp hiện tại. Xem kết quả theo thời gian thực, bao gồm ISO 8601, Giờ địa phương, UTC và thời gian tương đối. Nhấp Copy bên cạnh bất kỳ kết quả nào để lưu vào clipboard.", - heading3: "Các trường hợp sử dụng phổ biến", - p3: "Phân tích log để chuyển đổi timestamp khó hiểu trong log máy chủ hoặc mục cơ sở dữ liệu thành ngày có thể đọc được để gỡ lỗi. Phát triển API để xác minh rằng backend của bạn đang gửi giá trị epoch chính xác. Di chuyển dữ liệu để đảm bảo dữ liệu dựa trên thời gian nhất quán khi di chuyển giữa các hệ thống. Lập lịch để tính toán timestamp trong tương lai hoặc quá khứ cho cron job, ngày hết hạn hoặc trình kích hoạt sự kiện.", - heading4: "Mẹo chuyên nghiệp", - p4: "Khi làm việc với JavaScript, hãy nhớ rằng Date.now() trả về mili giây, trong khi Unix timestamp chuẩn tính bằng giây — chia cho 1000 để chuyển đổi. Luôn dùng định dạng ISO 8601 cho trao đổi dữ liệu giữa các hệ thống để đảm bảo tương thích tối đa. Hãy lưu ý vấn đề Năm 2038 khi các số nguyên có dấu 32-bit sẽ tràn số; các hệ thống hiện đại dùng số nguyên 64-bit giải quyết vấn đề này trong tương lai gần.", - }, }, "color-converter": { name: "Chuyển Đổi Màu Sắc", @@ -1589,16 +1407,6 @@ export default { badge7: "Chỉ phía trình duyệt", badge8: "Ưu tiên quyền riêng tư", }, - edu: { - heading1: "Các mô hình màu sắc (HEX/RGB/HSL)", - heading2: "Cách sử dụng công cụ này", - heading3: "Các trường hợp sử dụng phổ biến", - heading4: "Mẹo chuyên nghiệp", - p1: "

Mô hình màu sắc là các hệ thống toán học để biểu diễn màu sắc. HEX (Thập lục phân) là mã 6 chữ số dùng trong HTML và CSS, đại diện cho các thành phần Đỏ, Xanh lá và Xanh dương. RGB (Đỏ, Xanh lá, Xanh dương) sử dụng giá trị thập phân từ 0 đến 255 cho mỗi kênh, thường dùng trong hình ảnh kỹ thuật số.

HSL (Sắc độ, Độ bão hòa, Độ sáng) trực quan hơn với con người, vì nó mô tả màu sắc theo màu cơ bản (Hue), cường độ (Saturation) và độ sáng (Lightness). Hiểu các mô hình này giúp chọn đúng định dạng cho nhu cầu thiết kế và phát triển, đảm bảo tính nhất quán trên các nền tảng và thiết bị khác nhau.

", - p2: "
  1. Dùng bộ chọn màu trực quan để chọn màu bằng cách kéo con trỏ trong ô vuông độ bão hòa/độ sáng và thanh trượt sắc độ.
  2. Hoặc nhập giá trị cụ thể vào trường «Nhập thủ công» (hỗ trợ định dạng #hex, rgb hoặc hsl).
  3. Quan sát hộp «Xem trước» để thấy màu đã chọn theo thời gian thực.
  4. Xem các giá trị đã chuyển đổi trong các thẻ HEX, RGB, HSL và HSV bên dưới.
  5. Nhấp vào biểu tượng «Sao chép» trên bất kỳ thẻ nào để lưu định dạng đó vào clipboard.
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "Chuyển Đổi Đơn Vị", @@ -1616,16 +1424,6 @@ export default { text0: "Chọn đơn vị để xem công thức chuyển đổi", text1: "Nhập một số hợp lệ", }, - edu: { - heading1: "Tổng quan về hệ thống đo lường", - p1: "Hệ thống đo lường là tập hợp các đơn vị đo lường và các quy tắc liên kết chúng với nhau. Hai hệ thống phổ biến nhất là Hệ Mét (Hệ Đơn vị Quốc tế hay SI) và Hệ Anh. Hệ Mét dựa trên lũy thừa của mười, khiến nó rất logic và dễ dàng mở rộng. Hệ Anh, chủ yếu dùng ở Hoa Kỳ, sử dụng các đơn vị như inch, feet và pound có nguồn gốc lịch sử. Hiểu sự khác biệt giữa các hệ thống này rất cần thiết cho khoa học, kỹ thuật, thương mại quốc tế và các công việc hàng ngày như nấu ăn hay du lịch.", - heading2: "Cách sử dụng công cụ này", - p2: "Chọn danh mục đo lường (vd: Độ dài, Trọng lượng, Nhiệt độ) từ lưới ở trên cùng. Chọn đơn vị muốn chuyển đổi từ menu Từ. Nhập giá trị cần chuyển đổi vào trường nhập liệu. Chọn đơn vị đích trong menu Sang. Giá trị đã chuyển đổi sẽ xuất hiện ngay lập tức cùng với công thức toán học được sử dụng.", - heading3: "Các trường hợp sử dụng phổ biến", - p3: "Du lịch để chuyển đổi khoảng cách từ km sang dặm hoặc nhiệt độ từ Celsius sang Fahrenheit. Nấu ăn để dịch công thức giữa đơn vị mét (gam/mililit) và Anh (ounce/cup). Kỹ thuật và khoa học để chuyển đổi chính xác giữa các đơn vị áp suất, năng lượng hoặc tốc độ khác nhau. Lưu trữ kỹ thuật số để hiểu sự khác biệt giữa Megabyte, Gigabyte và Terabyte.", - heading4: "Mẹo chuyên nghiệp", - p4: "Dùng nút Đổi để nhanh chóng đảo ngược hướng chuyển đổi giữa các đơn vị đã chọn. Luôn kiểm tra loại đơn vị cụ thể, đặc biệt cho thể tích và trọng lượng, vì tên có thể giống nhau ở các hệ thống khác nhau như gallon Mỹ vs. gallon Anh. Khi thực hiện nhiều lần chuyển đổi liên tiếp, hãy giữ nhiều chữ số thập phân nhất có thể cho đến kết quả cuối cùng để tránh lỗi làm tròn tích lũy.", - }, }, "yaml-toml-converter": { name: "Chuyển Đổi YAML/TOML", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ Chuyển đổi TOML thất bại:", tpl7: "Đang chờ chuyển đổi.", }, - edu: { - heading1: "So sánh YAML vs TOML vs JSON", - p1: "JSON là định dạng được sử dụng rộng rãi nhất để trao đổi dữ liệu nhờ tính đơn giản và được hỗ trợ gốc trong JavaScript. YAML (YAML Ain't Markup Language) là một chuẩn serialization dữ liệu thân thiện với con người, sử dụng thụt lề để biểu diễn cấu trúc, khiến nó phổ biến cho các tệp cấu hình phức tạp. TOML (Tom's Obvious, Minimal Language) được thiết kế để dễ đọc và viết nhờ ngữ nghĩa rõ ràng, và thường được dùng cho cấu hình dự án. Trong khi JSON nghiêm ngặt và gọn nhẹ, YAML và TOML ưu tiên khả năng đọc của con người và dễ chỉnh sửa thủ công.", - heading2: "Cách sử dụng công cụ này", - p2: "Dán dữ liệu cấu hình của bạn (JSON, YAML, hoặc TOML) vào ô văn bản nguồn bên trái. Công cụ sẽ tự động phát hiện định dạng nguồn, hoặc bạn có thể chọn thủ công từ menu thả xuống. Nhấp Chỉ xác thực để kiểm tra lỗi cú pháp mà không thực hiện chuyển đổi. Nhấp vào một trong các nút chuyển đổi (→ JSON, → YAML, → TOML) để chuyển đổi dữ liệu của bạn sang định dạng đó. Xem kết quả trong các bảng đầu ra bên phải và nhấp Sao chép để lưu vào clipboard.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Infrastructure as Code để chuyển đổi giữa JSON và YAML khi làm việc với Kubernetes manifest, tệp Docker Compose, hoặc mẫu AWS CloudFormation. Cấu hình dự án để di chuyển thiết lập giữa package.json (JSON) và pyproject.toml hoặc Cargo.toml (TOML). Tạo prototype API để nhanh chóng hình dung cấu trúc dữ liệu phức tạp trông như thế nào ở các định dạng khác nhau. Di chuyển hệ thống cũ để chuyển đổi các tệp cấu hình cũ sang định dạng hiện đại trong khi vẫn đảm bảo tính toàn vẹn dữ liệu.", - heading4: "Mẹo hay", - p4: "Sử dụng YAML cho các pipeline CI/CD nơi khả năng đọc của các cấu trúc lồng nhau phức tạp là điều cần thiết để dễ bảo trì. Ưu tiên TOML cho các tệp cấu hình cấp ứng dụng để cung cấp giao diện gọn gàng cho người dùng cuối, những người có thể cần chỉnh sửa thủ công. Khi chuyển đổi từ YAML sang JSON, hãy lưu ý các vấn đề ép kiểu của YAML (nơi NO có thể được hiểu là false) và đảm bảo các kiểu dữ liệu của bạn được giữ nguyên chính xác.", - }, cheatsheet: { title: "So sánh định dạng", h0: "Khác biệt cú pháp", @@ -1719,16 +1507,6 @@ export default { text1: "Sao chép", text2: "Đã sao chép!", }, - edu: { - heading1: "htpasswd là gì?", - p1: "

Tệp htpasswd là một cơ sở dữ liệu dạng flat-file dùng để lưu trữ tên người dùng và mật khẩu đã băm cho xác thực cơ bản trên máy chủ web Apache và Nginx. Đây là cách đơn giản nhưng hiệu quả để bảo vệ các thư mục cụ thể hoặc bảng quản trị trên một website mà không cần một hệ thống xác thực đầy đủ dựa trên cơ sở dữ liệu.

Mỗi dòng trong tệp htpasswd đại diện cho một người dùng và tuân theo định dạng username:hashed_password.

", - heading2: "Cách sử dụng công cụ này", - p2: "
  1. Nhập tên người dùng: Gõ tên người dùng bạn muốn dùng để xác thực.
  2. Cung cấp mật khẩu: Nhập một mật khẩu hoặc nhấp Tạo mật khẩu mạnh để tạo một mật khẩu an toàn.
  3. Chọn thuật toán: Chọn Bcrypt (-B) cho bảo mật hiện đại hoặc Apache MD5 (-m) để tương thích với hệ thống cũ.
  4. Tạo: Nhấp Tạo bản ghi để tạo chuỗi đã băm.
  5. Sao chép hoặc Tải xuống: Sao chép dòng kết quả vào clipboard hoặc tải xuống dưới dạng tệp để tải lên máy chủ của bạn.
", - heading3: "Trường hợp sử dụng phổ biến", - p3: "", - heading4: "Mẹo hay", - p4: "", - }, }, "mock-data-generator": { name: "Trình Tạo Dữ Liệu Mẫu", @@ -1762,16 +1540,6 @@ export default { text1: "Sao chép", text2: "Không có hàng để xem trước.", }, - edu: { - heading1: "Dữ liệu giả lập là gì?", - p1: "

Dữ liệu giả lập là thông tin tổng hợp bắt chước dữ liệu thực mà không chứa bất kỳ thông tin nhạy cảm hoặc thông tin cá nhân có thể nhận dạng (PII). Nó rất quan trọng với các nhà phát triển và kiểm thử viên cần tập dữ liệu thực tế để xây dựng và xác thực ứng dụng mà không gây rủi ro vi phạm dữ liệu hay vi phạm quy định quyền riêng tư như GDPR hay CCPA. Bằng cách sử dụng dữ liệu giả lập, bạn có thể mô phỏng nhiều tình huống khác nhau, đảm bảo phần mềm xử lý mọi loại đầu vào đúng cách.

", - heading2: "Chiến lược kiểm thử", - p2: "

Kiểm thử hiệu quả đòi hỏi tập dữ liệu đa dạng. Dùng dữ liệu giả lập để điền vào cơ sở dữ liệu phát triển, thực hiện kiểm thử tải với hàng nghìn bản ghi, hoặc xác minh bố cục UI với độ dài chuỗi khác nhau. Đặc biệt hữu ích cho kiểm thử tích hợp khi bạn cần phản hồi có thể dự đoán từ các API bên ngoài. Bằng cách tạo dữ liệu cục bộ, bạn có thể tạo môi trường kiểm thử nhất quán, dễ đặt lại và tái tạo.

", - heading3: "Quyền riêng tư dữ liệu trong mock", - p3: "

Quyền riêng tư là ưu tiên hàng đầu trong phát triển phần mềm hiện đại. Sử dụng dữ liệu sản xuất thực trong môi trường phát triển hoặc staging là rủi ro bảo mật lớn. Các bộ tạo dữ liệu giả lập giải quyết vấn đề này bằng cách tạo ra dữ liệu giả nhưng đúng cấu trúc. Công cụ của chúng tôi chạy hoàn toàn trong trình duyệt, nghĩa là cấu hình và dữ liệu được tạo ra vẫn nằm trong trình duyệt của bạn và không được gửi đến máy chủ của chúng tôi.

", - heading4: "Mẹo chuyên nghiệp", - p4: "", - }, cheatsheet: { title: "Các loại trường dữ liệu giả lập", h0: "Các loại có sẵn", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "Giải thích quy ước đặt tên (camelCase/snake_case/v.v.)", - heading2: "Cách sử dụng công cụ này", - heading3: "Trường hợp sử dụng phổ biến", - heading4: "Mẹo hay", - p1: "

Quy ước đặt tên là tập hợp các quy tắc để chọn chuỗi ký tự dùng làm định danh biểu thị biến, kiểu dữ liệu, hàm, và các thực thể khác trong mã nguồn và tài liệu. camelCase (vd: myVariable) bắt đầu bằng chữ thường và viết hoa chữ cái đầu của mỗi từ tiếp theo. snake_case (vd: my_variable) dùng dấu gạch dưới để phân cách các từ.

PascalCase (vd: MyVariable) viết hoa chữ cái đầu của mọi từ, trong khi kebab-case (vd: my-variable) dùng dấu gạch nối để phân cách các từ. Các quy ước này không chỉ về mặt thẩm mỹ; chúng rất quan trọng đối với khả năng đọc mã, khả năng bảo trì, và tuân theo các tiêu chuẩn thông dụng của các ngôn ngữ lập trình và framework khác nhau.

", - p2: "
  1. Gõ hoặc dán văn bản của bạn vào ô \"Văn bản đầu vào\" ở đầu trang.
  2. Công cụ sẽ tự động chuyển đổi dữ liệu nhập của bạn thành hơn chục kiểu chữ khác nhau theo thời gian thực.
  3. Cuộn qua lưới \"Kết quả chuyển đổi\" để tìm kiểu chữ cụ thể bạn cần.
  4. Nhấp vào biểu tượng \"Sao chép\" bên cạnh bất kỳ kết quả nào để lưu vào clipboard.
  5. Dùng nút \"Xóa\" để xóa toàn bộ dữ liệu nhập và bắt đầu chuyển đổi mới.
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "Nén Mã Nguồn", @@ -1913,16 +1671,6 @@ export default { text2: "📋 Sao chép", tpl3: "Toàn bộ quá trình xử lý diễn ra trong trình duyệt của bạn. Mã của bạn được xử lý cục bộ và không gửi đến máy chủ của chúng tôi.", }, - edu: { - heading1: "Rút gọn mã (Minification) là gì?", - heading2: "Cách sử dụng công cụ này", - heading3: "Trường hợp sử dụng phổ biến", - heading4: "Mẹo hay", - p1: "

Rút gọn mã là quá trình loại bỏ tất cả các ký tự không cần thiết khỏi mã nguồn mà không làm thay đổi chức năng của nó. Điều này bao gồm loại bỏ khoảng trắng, ký tự xuống dòng, comment, và đôi khi rút ngắn tên biến. Mục tiêu là giảm kích thước tệp của mã, từ đó giảm lượng dữ liệu cần truyền qua mạng.

Điều này giúp tăng tốc độ tải trang và cải thiện hiệu năng cho các ứng dụng web. Trong khi rút gọn mã là điều cần thiết cho môi trường production, nó khiến mã gần như không thể đọc và gỡ lỗi được đối với con người. Do đó, nó thường được thực hiện như bước cuối cùng trong quy trình build trước khi triển khai lên máy chủ thực tế.

", - p2: "
  1. Chọn ngôn ngữ lập trình (JavaScript, CSS, HTML, hoặc JSON) từ các tab ở trên cùng.
  2. Dán mã nguồn của bạn vào ô văn bản \"Mã đầu vào\" bên trái.
  3. Nhấp nút \"Rút gọn mã\" để giảm kích thước tệp cho việc sử dụng production.
  4. Ngoài ra, nhấp \"Làm đẹp mã\" để thêm thụt lề và định dạng giúp dễ đọc hơn.
  5. Xem kết quả trong ô \"Mã đầu ra\" và nhấp \"Sao chép\" hoặc \"Tải xuống\" để lưu mã đã tối ưu của bạn.
", - p3: "", - p4: "", - }, }, "image-converter": { name: "Chuyển Đổi Hình Ảnh", @@ -1969,16 +1717,6 @@ export default { alert2: "Lỗi khi đọc tệp.", tpl3: "Xử lý phía trình duyệt bằng Canvas API - không tải lên máy chủ, kết quả tức thì", }, - edu: { - heading1: "So sánh định dạng ảnh (PNG/JPEG/WebP)", - p1: "

Chọn đúng định dạng ảnh là điều quan trọng đối với hiệu năng web và chất lượng hình ảnh. JPEG tốt nhất cho ảnh chụp và hình ảnh phức tạp có nhiều màu sắc, vì nó sử dụng nén mất dữ liệu để đạt kích thước tệp nhỏ. PNG lý tưởng cho ảnh cần độ trong suốt hoặc có cạnh sắc nét và màu đặc (như logo và biểu tượng), vì nó sử dụng nén không mất dữ liệu.

WebP là một định dạng hiện đại cung cấp khả năng nén mất dữ liệu và không mất dữ liệu vượt trội, thường cho kích thước tệp nhỏ hơn đáng kể so với JPEG hoặc PNG trong khi vẫn giữ chất lượng cao.

", - heading2: "Cách sử dụng công cụ này", - p2: "
  1. Tải ảnh của bạn lên bằng cách thả vào vùng Tải ảnh lên hoặc nhấp để duyệt tệp.
  2. Chọn định dạng đầu ra mong muốn (PNG, JPG, hoặc WebP) từ tùy chọn Chuyển đổi định dạng.
  3. Nếu bạn đã chọn định dạng mất dữ liệu như JPG hoặc WebP, dùng thanh trượt chất lượng để cân bằng giữa kích thước tệp và độ trung thực hình ảnh.
  4. Tùy chọn, dùng cài đặt Thay đổi kích thước ảnh để phóng to/thu nhỏ ảnh theo phần trăm hoặc kích thước cụ thể.
  5. Nhấp Chuyển đổi & Thay đổi kích thước ảnh rồi Tải xuống để lưu tệp đã tối ưu của bạn.
", - heading3: "Trường hợp sử dụng phổ biến", - p3: "", - heading4: "Mẹo hay", - p4: "", - }, }, "css-gradient": { name: "Tạo Gradient CSS", @@ -2018,16 +1756,6 @@ export default { alert2: "Sao chép CSS vào clipboard thất bại", tpl3: "Màn hình tải và lớp phủ", }, - edu: { - heading1: "CSS Gradient là gì?", - heading2: "Gradient tuyến tính vs xuyên tâm vs hình nón", - heading3: "Hỗ trợ trình duyệt và hiệu năng", - heading4: "Mẹo hay để có Gradient đẹp hơn", - p1: "

CSS gradient là một tính năng mạnh mẽ cho phép bạn hiển thị các chuyển màu mượt mà giữa hai hoặc nhiều màu được chỉ định. Khác với ảnh nền truyền thống, gradient được tạo ra bởi trình duyệt, nghĩa là chúng có thể mở rộng vô hạn, tiêu tốn ít băng thông hơn, và có thể dễ dàng thao tác bằng mã. Chúng thường được dùng cho nền, nút bấm, và các yếu tố trang trí để tăng chiều sâu và sự thú vị về mặt hình ảnh cho thiết kế web.

", - p2: "

Có ba loại CSS gradient chính:

", - p3: "

CSS gradient hiện đại được hỗ trợ rộng rãi trên tất cả các trình duyệt lớn, bao gồm Chrome, Firefox, Safari, và Edge. Vì chúng được render bằng toán học bởi engine của trình duyệt, chúng có hiệu năng cực kỳ tốt so với ảnh độ phân giải cao. Tuy nhiên, đối với các gradient rất phức tạp với hàng chục điểm dừng màu, luôn nên kiểm tra hiệu năng trên các thiết bị cấu hình thấp. Đối với các trình duyệt cũ (như IE9 trở xuống), nên cung cấp một màu đặc dự phòng.

", - p4: "", - }, }, "curl-studio": { name: "Xưởng cURL", @@ -2096,16 +1824,6 @@ export default { text2: "Đã sao chép!", tpl3: "Log sẽ xuất hiện ở đây sau khi che dấu...", }, - edu: { - heading1: "PII là gì?", - p1: "

Thông tin định danh cá nhân (PII) là bất kỳ dữ liệu nào có thể dùng để nhận diện một cá nhân cụ thể. Điều này bao gồm các định danh trực tiếp như tên, địa chỉ email, và số điện thoại, cũng như các định danh gián tiếp như địa chỉ IP, vị trí vật lý, và số thẻ tín dụng. Trong bối cảnh log máy chủ, PII thường xuất hiện trong tham số yêu cầu, header, hoặc thông báo lỗi.

Bảo vệ PII là một phần quan trọng của bảo mật dữ liệu hiện đại và được yêu cầu bởi nhiều khung pháp lý trên khắp thế giới.

", - heading2: "Yêu cầu tuân thủ (GDPR/CCPA)", - p2: "

Các quy định như General Data Protection Regulation (GDPR) tại châu Âu và California Consumer Privacy Act (CCPA) tại Hoa Kỳ áp đặt các quy tắc nghiêm ngặt về cách xử lý dữ liệu cá nhân. Các luật này yêu cầu các tổ chức triển khai privacy by design và giảm thiểu việc thu thập và lưu trữ dữ liệu cá nhân.

Chia sẻ log thô chứa PII với các nhóm hỗ trợ bên thứ ba hoặc nhà phát triển có thể dẫn đến vi phạm tuân thủ. Che dấu hoặc ẩn dữ liệu này trước khi nó rời khỏi môi trường an toàn của bạn là một bước quan trọng để duy trì tuân thủ quy định.

", - heading3: "Chiến lược che dấu", - p3: "

Có một số cách để xử lý dữ liệu nhạy cảm trong log:

Công cụ của chúng tôi tập trung vào che dấu, sử dụng khớp mẫu để tìm và thay thế các định dạng PII phổ biến ngay lập tức.

", - heading4: "Mẹo hay", - p4: "", - }, }, "mermaid-studio": { name: "Xưởng Mermaid", @@ -2306,16 +2024,6 @@ export default { text51: "Chưa trích xuất URL nào.", text52: "Chưa có dữ liệu định tuyến.", }, - edu: { - heading1: "Giải thích xác thực Email", - heading2: "SPF/DKIM/DMARC", - heading3: "Phát hiện Phishing", - heading4: "Mẹo hay", - p1: "

Xác thực email là tập hợp các kỹ thuật dùng để cung cấp thông tin có thể xác minh về nguồn gốc của một thông điệp email. Bằng cách xác thực danh tính người gửi, các giao thức này giúp máy chủ thư phân biệt giữa thông điệp hợp lệ và thông điệp giả mạo hoặc gian lận (như phishing). Ba trụ cột của xác thực email hiện đại là SPF, DKIM, và DMARC.

Khi một email được nhận, máy chủ nhận thực hiện các kiểm tra này và ghi lại kết quả trong header của email, mà công cụ này phân tích giúp bạn.

", - p2: "", - p3: "

Email phishing thường sử dụng \"giả mạo\" để trông như đến từ một nguồn đáng tin cậy. Công cụ phân tích của chúng tôi tìm kiếm các dấu hiệu bất thường phổ biến, chẳng hạn như sự không khớp giữa địa chỉ \"From\" (những gì người dùng thấy) và \"Return-Path\" (nơi thư thực sự đến từ). Chúng tôi cũng trích xuất và phân tích URL trong nội dung email để xác định các liên kết đáng ngờ, chẳng hạn như những liên kết sử dụng Punycode (tên miền giả mạo giống thật) hoặc địa chỉ IP thay vì tên host.

Bằng cách xem xét phần \"Phát hiện\", bạn có thể nhanh chóng nhận diện các tín hiệu này và xác định liệu một email có an toàn để tương tác hay không.

", - p4: "", - }, cheatsheet: { title: "Tham khảo nhanh xác thực Email", h0: "Ý nghĩa của các kiểm tra này", @@ -2491,16 +2199,6 @@ export default { text9: "Vui lòng dán SQL trước.", text10: "✓ Đã sao chép", }, - edu: { - heading1: "Tại sao nên định dạng SQL?", - p1: "SQL có thể nhanh chóng trở nên phức tạp và khó đọc, đặc biệt khi xử lý nhiều join, subquery, và điều kiện lồng nhau. Định dạng SQL bao gồm thêm thụt lề nhất quán, ngắt dòng, và viết hoa từ khóa. Điều này giúp logic của câu truy vấn dễ theo dõi hơn nhiều, điều cần thiết cho việc gỡ lỗi, code review, và bảo trì schema cơ sở dữ liệu lớn theo thời gian. Một câu truy vấn được định dạng tốt cũng ít gặp lỗi logic hơn khi chỉnh sửa thủ công.", - heading2: "Cách sử dụng công cụ này", - p2: "Dán câu truy vấn SQL thô của bạn vào trình soạn thảo SQL đầu vào bên trái. Chọn phương ngữ cơ sở dữ liệu của bạn (Postgres hoặc MySQL) và kiểu chữ từ khóa ưa thích (CHỮ HOA hoặc chữ thường). Nhấp nút Định dạng để làm đẹp câu truy vấn của bạn với thụt lề và khoảng cách hợp lý. Dùng nút Xác thực để kiểm tra các vấn đề cấu trúc phổ biến như dấu ngoặc kép chưa đóng hoặc dấu ngoặc không cân bằng. Nhấp Sao chép để lưu SQL đã định dạng vào clipboard hoặc Xóa để bắt đầu lại.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Code review để định dạng SQL lộn xộn trước khi gửi pull request. Gỡ lỗi để dọn dẹp các câu truy vấn được tạo bởi ORM nhằm hiểu chính xác những gì đang được thực thi trên cơ sở dữ liệu của bạn. Tài liệu để tạo các ví dụ rõ ràng và dễ đọc cho hướng dẫn kỹ thuật, wiki, hoặc tệp README. Dọn dẹp hệ thống cũ để nhanh chóng tái cấu trúc các script cũ, chưa định dạng thành phong cách hiện đại, dễ đọc.", - heading4: "Mẹo hay", - p4: "Sử dụng Common Table Expression (CTE) với mệnh đề WITH để chia nhỏ các câu truy vấn phức tạp thành các phần nhỏ hơn, dễ quản lý hơn. Luôn sử dụng alias mô tả cho bảng và cột để làm rõ ý định của câu truy vấn. Sử dụng nút Rút gọn nếu bạn cần nén SQL của mình thành một dòng duy nhất để dùng trong tệp cấu hình hoặc công cụ dòng lệnh.", - }, cheatsheet: { title: "Mẹo định dạng SQL", h0: "Cải thiện nhanh", @@ -2569,16 +2267,6 @@ export default { text15: "Lưu ý: Giá trị được che dấu vì lý do an toàn. So sánh dựa trên heuristic và không bao gồm comment/thứ tự.", text16: "✓ Đã sao chép", }, - edu: { - heading1: "Thực hành tốt nhất cho biến môi trường", - heading2: "Quản lý bí mật", - heading3: "Bảo mật .env", - heading4: "Mẹo hay", - p1: "

Biến môi trường là một phần cơ bản của phương pháp luận \"Twelve-Factor App\", vốn ủng hộ việc tách biệt nghiêm ngặt cấu hình khỏi mã nguồn. Bằng cách sử dụng biến môi trường, bạn có thể chạy cùng một mã trong các môi trường khác nhau (phát triển, staging, production) chỉ bằng cách thay đổi giá trị cấu hình.

Thực hành tốt nhất bao gồm sử dụng tên mô tả, viết hoa (vd: DATABASE_URL), cung cấp giá trị mặc định cho các cài đặt không quan trọng, và không bao giờ hardcode thông tin nhạy cảm trực tiếp vào source control.

", - p2: "

Secret là một loại đặc biệt của biến môi trường chứa thông tin nhạy cảm như API key, mật khẩu cơ sở dữ liệu, và chứng chỉ riêng tư. Việc quản lý an toàn các thông tin này là điều quan trọng để ngăn ngừa rò rỉ dữ liệu. Bạn nên sử dụng một dịch vụ quản lý secret chuyên dụng (như AWS Secrets Manager, HashiCorp Vault, hoặc Cloudflare Secrets) cho môi trường production.

Đối với phát triển cục bộ, tệp .env thường được sử dụng, nhưng chúng không bao giờ nên được commit vào kho git của bạn. Luôn thêm *.env vào tệp .gitignore của bạn.

", - p3: "

Khi chia sẻ tệp .env với đồng đội để gỡ lỗi, có rủi ro cao là vô tình để lộ secret của production. Công cụ quản lý của chúng tôi giúp giảm thiểu rủi ro này bằng tính năng \"Che dấu giá trị nhạy cảm\". Nó sử dụng heuristic để xác định các khóa như SECRET, TOKEN, hoặc PASSWORD và thay thế giá trị của chúng bằng phiên bản đã che dấu (vd: ab...yz (32)).

Điều này cho phép bạn so sánh cấu trúc và các giá trị không nhạy cảm trong tệp môi trường của mình mà không làm lộ các secret thực tế.

", - p4: "", - }, cheatsheet: { title: "Ghi chú Dotenv", h0: "Chiến lược che dấu", @@ -2638,16 +2326,6 @@ export default { text7: "Chưa có bản xem trước.", text8: "✓ Đã sao chép", }, - edu: { - heading1: "SVG là gì?", - p1: "SVG (Scalable Vector Graphics) là một định dạng ảnh vector dựa trên XML dành cho đồ họa hai chiều, có hỗ trợ tương tác và hoạt ảnh. Khác với các định dạng raster như JPEG hoặc PNG, SVG được định nghĩa bằng các đường dẫn toán học, nghĩa là chúng có thể được phóng to đến bất kỳ kích thước nào mà không mất chất lượng. Điều này khiến chúng hoàn hảo cho logo, biểu tượng, và minh họa trên web, nơi chúng vẫn sắc nét trên mọi thứ từ màn hình di động đến màn hình desktop độ phân giải cao.", - heading2: "Cách sử dụng công cụ này", - p2: "Dán mã SVG của bạn vào ô văn bản SVG đầu vào bên trái. Nhấp Xem trước để xem đồ họa và trích xuất bảng màu của nó. Dùng nút Tối ưu hóa hoặc Rút gọn để dọn dẹp mã đánh dấu và giảm kích thước tệp. Tùy chọn, thay thế các màu cụ thể bằng cách nhập giá trị mới vào bảng Màu sắc và nhấp Áp dụng. Nhấp Sao chép hoặc Tải xuống để lưu SVG đã làm sạch và tối ưu của bạn.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Quản lý biểu tượng để dọn dẹp SVG xuất từ các công cụ thiết kế như Figma hoặc Illustrator. Tùy chỉnh giao diện để nhanh chóng thay đổi màu sắc của bộ biểu tượng cho khớp với bảng màu thương hiệu của bạn. Bảo mật để làm sạch SVG từ các nguồn không đáng tin cậy nhằm loại bỏ các script tiềm ẩn hoặc tham chiếu bên ngoài. Hiệu năng để rút gọn mã đánh dấu SVG nhằm giảm kích thước đồ họa inline và cải thiện thời gian tải trang.", - heading4: "Mẹo hay", - p4: "Sử dụng nút currentColor để chuyển đổi tất cả các fill và stroke rõ ràng thành currentColor, giúp SVG của bạn dễ dàng tạo kiểu qua CSS. Luôn tối ưu hóa SVG của bạn trước khi sử dụng trong production để đảm bảo chúng nhỏ nhất có thể. Khi tạo SVG trong các công cụ thiết kế, sử dụng tính năng Outline Stroke và Simplify Path để giảm độ phức tạp của mã được tạo ra trước khi tối ưu hóa.", - }, cheatsheet: { title: "Lưu ý an toàn SVG", h0: "Làm sạch", @@ -2801,16 +2479,6 @@ export default { text28: "Nhấp Quét để tìm secret.", text29: "✓ Đã sao chép", }, - edu: { - heading1: "Rò rỉ Secret là gì?", - p1: "Rò rỉ secret xảy ra khi thông tin nhạy cảm như API key, mật khẩu, hoặc token riêng tư vô tình được commit vào hệ thống quản lý phiên bản hoặc chia sẻ trên các diễn đàn công khai. Những rò rỉ này có thể dẫn đến truy cập trái phép, rò rỉ dữ liệu, và tổn thất tài chính. Công cụ này giúp xác định các mẫu secret phổ biến cục bộ trong trình duyệt của bạn trước khi bạn chia sẻ hoặc commit mã của mình.", - heading2: "Cách sử dụng công cụ này", - p2: "Dán mã, cấu hình, hoặc tệp log của bạn vào ô nhập liệu. Nhấp nút Quét để phân tích văn bản tìm các secret tiềm ẩn. Xem lại các phát hiện và lời khuyên cho từng mục được phát hiện. Dùng nút Sao chép bản đã che dấu để lấy phiên bản văn bản an toàn để chia sẻ với các secret đã được che.", - heading3: "Trường hợp sử dụng phổ biến", - p3: "Kiểm tra pre-commit để quét mã của bạn trước khi commit nhằm đảm bảo không có secret nào bị đưa vào. Che dấu log để che các token nhạy cảm trong log trước khi chia sẻ với bộ phận hỗ trợ hoặc đồng đội. Kiểm toán bảo mật để nhanh chóng kiểm toán các tệp cấu hình tìm thông tin xác thực hardcode.", - heading4: "Mẹo hay", - p4: "Luôn xoay vòng thông tin xác thực của bạn ngay lập tức nếu bạn phát hiện chúng đã bị rò rỉ. Sử dụng biến môi trường hoặc trình quản lý secret thay vì hardcode secret trong mã nguồn của bạn. Bật Bao gồm các mẫu mức độ nghiêm trọng thấp để quét kỹ lưỡng hơn, nhưng hãy chuẩn bị cho nhiều kết quả dương tính giả hơn.", - }, cheatsheet: { title: "Phải làm gì nếu bạn tìm thấy một secret", h0: "Các bước ngay lập tức", @@ -2907,16 +2575,6 @@ export default { text15: "✓ Cấu trúc JWKS hợp lệ (", text16: "Vui lòng dán một JWK.", }, - edu: { - heading1: "JWT là gì?", - p1: "JSON Web Token (JWT) là một cách gọn nhẹ, an toàn với URL để biểu diễn các claim được truyền giữa hai bên. Một JWT gồm ba phần mã hóa Base64URL ngăn cách bởi dấu chấm: Header (thuật toán và loại), Payload (claim), và Signature. Chữ ký đảm bảo token không bị can thiệp. JWT thường được dùng để xác thực và trao đổi thông tin trong các API web. Các claim chuẩn bao gồm sub (subject), iss (issuer), aud (audience), exp (expiration), nbf (not before), iat (issued at), và jti (JWT ID).", - heading2: "Thuật toán JWT", - p2: "HS256/384/512 sử dụng HMAC với SHA-2 và một khóa bí mật dùng chung — đơn giản nhưng cả hai bên phải giữ cùng một khóa. RS256/384/512 sử dụng chữ ký bất đối xứng RSA PKCS#1 v1.5 — lý tưởng cho kiến trúc microservice nơi các dịch vụ chỉ cần khóa công khai. ES256/384/512 sử dụng ECDSA với các đường cong NIST cho chữ ký nhỏ hơn RSA với mức bảo mật tương đương. PS256/384/512 sử dụng RSA-PSS, một biến thể xác suất được ưu tiên hơn RS* trong các hệ thống hiện đại.", - heading3: "JWK và JWKS", - p3: "JSON Web Key (JWK) là một cấu trúc JSON đại diện cho một khóa mật mã. JWK Set (JWKS) là một cấu trúc JSON chứa một mảng các JWK dưới thuộc tính keys. Các dịch vụ công bố JWKS của họ tại một URL nổi tiếng (vd: /.well-known/jwks.json), cho phép client lấy khóa công khai để xác minh JWT mà không cần trao đổi khóa ngoài băng thông. Các khóa trong JWKS được xác định bằng kid (Key ID) của chúng, mà header JWT tham chiếu đến.", - heading4: "Thực hành bảo mật tốt nhất", - p4: "Luôn xác thực các claim exp, nbf, iss, và aud ở phía máy chủ. Không bao giờ sử dụng thuật toán alg: none trong production — nó loại bỏ toàn bộ bảo vệ chữ ký. Ưu tiên các thuật toán bất đối xứng (RS*, ES*, PS*) hơn HMAC khi nhiều dịch vụ cần xác minh token. Xoay vòng khóa thường xuyên và sử dụng kid để xác định khóa nào được dùng để ký từng token. Lưu trữ khóa riêng tư an toàn — không bao giờ commit chúng vào hệ thống quản lý phiên bản. Sử dụng thời gian hết hạn ngắn và refresh token thay vì JWT tồn tại lâu.", - }, }, "encoding-workbench": { name: "Bàn Mã Hóa", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "Không phát hiện lớp mã hóa nào có thể nhận diện.", }, - edu: { - heading1: "Mã hóa (Encoding) so với Hashing là gì?", - heading2: "Cách sử dụng công cụ này", - heading3: "Giải thích mã hóa nhiều lớp", - heading4: "Hướng dẫn thuật toán Hash", - p1: "

Mã hóa (Encoding) biến đổi dữ liệu thành một biểu diễn khác có thể đảo ngược (giải mã). Các định dạng phổ biến bao gồm Base64 — dùng để truyền dữ liệu nhị phân qua các kênh văn bản — mã hóa URL, mã hóa thực thể HTML, và thập lục phân. Mã hóa không phải là mã hóa bảo mật (encryption); nó không cung cấp tính bảo mật.

Hashing là một phép biến đổi toán học một chiều. Một hàm hash mật mã học nhận bất kỳ đầu vào nào và tạo ra một dấu vân tay có độ dài cố định. Bạn không thể đảo ngược hash để lấy lại đầu vào gốc. Hash được dùng để xác minh tính toàn vẹn tệp, lưu trữ mật khẩu an toàn, và tạo chữ ký số.

", - p2: "
  1. Tab Mã hóa / Giải mã: Dán văn bản và chọn một thao tác (Base64, URL, HTML, Hex), hoặc nhấp Tự động phát hiện lớp để tự động bóc tách nhiều lớp mã hóa lồng nhau.
  2. Tab Hash: Nhập văn bản hoặc chọn một tệp, chọn thuật toán, và nhấp Băm tất cả. Bật chế độ HMAC để tính hash có khóa với một khóa bí mật dùng chung.
  3. Tab Nhận diện: Dán một hash hoặc chuỗi mã hóa chưa xác định và nhấp Nhận diện để xem các thuật toán khả dĩ kèm mức độ tin cậy.
", - p3: "

Dữ liệu thực tế thường được mã hóa nhiều lần. Ví dụ, một payload có thể được mã hóa URL, sau đó mã hóa Base64, rồi đặt vào bên trong một chuỗi hex. Tính năng Tự động phát hiện lớp kiểm tra mẫu dữ liệu đầu vào, thử từng cách giải mã theo trình tự, và trực quan hóa mỗi bước dưới dạng một thẻ để bạn có thể thấy chính xác cách dữ liệu đã được bọc.

", - p4: "", - }, }, "oauth-debugger": { name: "Trình Gỡ Lỗi OAuth", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "PKCE là gì và tại sao nó quan trọng?", - p1: "

Proof Key for Code Exchange (PKCE, RFC 7636) ban đầu được thiết kế cho các ứng dụng di động và ứng dụng gốc không thể lưu trữ client secret một cách an toàn. Nó hoạt động bằng cách để client tạo một code_verifier ngẫu nhiên, suy ra một code_challenge từ đó (SHA-256 + base64url), và gửi challenge cùng với yêu cầu ủy quyền. Khi đổi mã ủy quyền lấy token, client gửi code_verifier gốc. Máy chủ ủy quyền xác minh nó khớp với challenge trước đó — chứng minh yêu cầu token đến từ cùng một client đã bắt đầu luồng.

Ngay cả với các client bảo mật (ứng dụng phía máy chủ có client secret), PKCE hiện được OAuth 2.1 khuyến nghị như một biện pháp phòng thủ chống lại tấn công đánh chặn mã ủy quyền.

", - heading2: "Tại sao luồng Implicit không còn được khuyến nghị?", - p2: "

Luồng implicit (response_type=token) được thiết kế như một cách rút gọn cho các ứng dụng single-page, trả về access token trực tiếp trong đoạn URL. Điều này tạo ra các vấn đề nghiêm trọng: token trong URL xuất hiện trong lịch sử trình duyệt, log máy chủ, và header referrer, và luồng này dễ bị tấn công token injection. OAuth 2.0 Security Best Current Practice (RFC 9700) và OAuth 2.1 loại bỏ hoàn toàn luồng implicit để ưu tiên Authorization Code + PKCE, mà các SPA có thể sử dụng an toàn mà không cần client secret.

", - heading3: "Các thay đổi chính trong OAuth 2.1", - p3: "", - heading4: "Luồng Authorization Code từng bước", - p4: "
  1. Tạo cặp PKCE: Tạo một code_verifier ngẫu nhiên và tính code_challenge = BASE64URL(SHA256(code_verifier)).
  2. Chuyển hướng đến endpoint ủy quyền: Bao gồm response_type=code, client_id, redirect_uri, scope, state, code_challenge, và code_challenge_method=S256.
  3. Người dùng xác thực tại máy chủ ủy quyền và cấp sự đồng ý.
  4. Nhận mã ủy quyền tại redirect_uri của bạn cùng với state được phản hồi lại — xác minh state khớp với những gì bạn đã gửi.
  5. Đổi mã lấy token: POST đến endpoint token với grant_type=authorization_code, code, redirect_uri, client_id, và code_verifier.
  6. Nhận access token (và tùy chọn id_token và refresh_token) và sử dụng chúng để gọi API.
", - }, }, "ladder-game": { name: "Trò Chơi Thang", diff --git a/src/i18n/zh-CN.js b/src/i18n/zh-CN.js index 4d70178..08fb2d3 100644 --- a/src/i18n/zh-CN.js +++ b/src/i18n/zh-CN.js @@ -90,16 +90,6 @@ export default { text7: "✓ 已复制", tpl8: "最大深度", }, - edu: { - heading1: "什么是JSON?", - p1: "

JSON(JavaScript对象表示法)是一种轻量级数据交换格式,易于人类读写,也易于机器解析和生成。它基于JavaScript编程语言标准的子集。JSON是一种完全独立于语言的文本格式,但使用了C系列语言程序员熟悉的约定。

这些特性使JSON成为Web应用程序、API和配置文件的理想数据交换语言。由于其更小的体积和更好的性能,它已成为Web数据交换的事实标准,很大程度上取代了XML。

", - heading2: "如何使用此工具", - p2: "
  1. 将原始或混乱的JSON数据粘贴到左侧的输入JSON编辑器中。
  2. 点击格式化按钮,使用适当的缩进和语法高亮美化代码。
  3. 或者,使用最小化按钮删除所有空白字符以供生产使用。
  4. 检查状态指示器以确保您的JSON有效;如果有错误,工具将高亮显示确切的行。
  5. 点击复制将格式化结果保存到剪贴板,或点击清除重新开始。
", - heading3: "常见使用场景", - p3: "", - heading4: "专业技巧", - p4: "", - }, }, "jwt-decoder": { name: "JWT 检查器", @@ -139,22 +129,6 @@ export default { status5: "算法: ", status6: "解码失败", }, - edu: { - heading1: "什么是 JWT?", - p1: "

JSON Web Token(JWT)是一种开放标准(RFC 7519),定义了一种紧凑且自包含的方式,用于在各方之间以 JSON 对象的形式安全地传输信息。由于该信息经过数字签名,因此可以被验证和信任。JWT 可以使用密钥(采用 HMAC 算法)签名,也可以使用 RSA 或 ECDSA 的公钥/私钥对进行签名。

由于体积紧凑,JWT 常用于身份验证和信息交换场景,例如 HTTP Authorization 头中的 Bearer 令牌。

", - heading2: "如何使用此工具", - p2: "
  1. 粘贴令牌:复制您编码后的 JWT(header.payload.signature),并粘贴到输入框中。
  2. 自动解码:工具会自动检测令牌并实时解码其各个部分。
  3. 查看头部:在头部部分查看算法(alg)和令牌类型(typ)。
  4. 分析载荷:在载荷部分查看声明,例如过期时间(exp)、签发者(iss)和主题(sub)。
  5. 验证声明:在声明分析框中查看易读的日期和验证状态。
", - heading3: "常见使用场景", - p3: "", - heading4: "专业提示", - p4: "", - heading5: "令牌结构(header.payload.signature)", - p5: "

JWT 通常由三部分组成,以点号分隔:

", - heading6: "安全注意事项", - p6: "

虽然 JWT 经过签名以确保完整性,但通常并未加密。这意味着任何持有该令牌的人都可以解码头部和载荷以读取其中的信息。切勿在 JWT 载荷中存储密码或私钥等敏感信息。

此外,请始终验证 exp(过期时间)声明以防止重放攻击,并确保服务器在信任载荷中的数据之前验证签名。

", - heading7: "专业提示", - p7: "", - }, cheatsheet: { title: "JWT 快速参考", h0: "结构", @@ -193,16 +167,6 @@ export default { text0: "✓ 已复制!", tpl1: "GUID:", }, - edu: { - heading1: "什么是 UUID?", - p1: "通用唯一标识符(UUID)是一个 128 位的数字,用于在计算机系统中唯一标识信息。它们的设计目标是可以在没有中央权威机构的情况下独立生成,同时将冲突概率降至可忽略不计的水平。", - heading2: "如何使用此工具", - p2: "选择 UUID 版本(v1 为基于时间,v4 为随机)以及所需的 ID 数量。点击生成即可创建一份可直接用于数据库或应用程序的唯一标识符列表。", - heading3: "常见使用场景", - p3: "分布式数据库中的主键、会话标识符、事务跟踪,以及在多个系统间唯一性至关重要的临时文件或资源命名。", - heading4: "专业提示", - p4: "UUID v4 是通用唯一 ID 最常见的选择,因为它依赖高质量的随机性。如果需要按创建时间对 ID 排序,请使用 v1。", - }, }, "password-generator": { name: "密码生成器", @@ -265,24 +229,6 @@ export default { status6: "弱", text1: "请输入有效的基础邮箱地址。", }, - edu: { - heading1: "什么样的密码才是安全的?", - p1: "

安全的密码是抵御未授权访问的第一道防线。在高速计算的现代,安全性由熵来定义——字符串随机性和不可预测性的度量。强密码应该足够长(至少16个字符),在每个账户中唯一,并由多种字符类型组成,包括大写字母、小写字母、数字和符号。

避免使用生日、宠物名或常见字典词汇等个人信息。即使是像P@ssw0rd123这样看起来复杂的替换,也很容易被使用大量常见模式词典的现代暴力破解工具破解。

", - heading2: "如何使用此工具", - p2: "
  1. 选择模式:根据需求选择密码、用户名、密码短语或邮件别名。
  2. 调整长度:使用滑块设置所需长度。对于密码,建议16个字符以上以获得高安全性。
  3. 配置选项:切换字符集(符号、数字等)或样式(可读性 vs 安全性)。
  4. 生成:点击生成按钮创建您的唯一凭据。
  5. 复制:使用复制图标将结果安全地移动到剪贴板或密码管理器。
", - heading3: "常见使用场景", - p3: "", - heading4: "专业技巧", - p4: "", - heading5: "什么样的密码才是安全的?", - p5: "

安全的密码是抵御未授权访问的第一道防线。在高速计算的现代,安全性由熵来定义——字符串随机性和不可预测性的度量。强密码应该足够长(至少16个字符),在每个账户中唯一,并由多种字符类型组成,包括大写字母、小写字母、数字和符号。

避免使用生日、宠物名或常见字典词汇等个人信息。即使是像P@ssw0rd123这样看起来复杂的替换,也很容易被使用大量常见模式词典的现代暴力破解工具破解。

", - heading6: "熵的解释", - p6: "

熵是密码随机性和不可预测性的度量,通常以比特表示。熵越高,密码越强。例如,仅使用小写字母的10字符密码的熵远低于使用完整字母数字和特殊字符集的10字符密码。

我们的生成器实时计算熵,为您提供密码强度的客观衡量标准。超过100比特熵的密码被认为是异常强大的,能抵御现代破解技术。

", - heading7: "最佳实践", - p7: "", - heading8: "专业技巧", - p8: "", - }, }, "hash-calculator": { name: "哈希计算器", @@ -350,16 +296,6 @@ export default { tpl4: "等待输入...", text2: "计算结果: ", }, - edu: { - heading1: "什么是哈希?", - p1: "

密码学哈希是一种数学过程,可将任意输入数据(文本或文件)转换为固定长度的字符串,通常是一个十六进制数。这个指纹对输入是唯一的;即使源数据中只有一位发生变化,也会产生完全不同的哈希值,这种现象被称为雪崩效应。

与加密不同,哈希是一种单向函数。您无法通过哈希值反推出原始数据。这使其非常适合用于验证数据完整性、安全存储密码(结合加盐使用时)以及在不暴露内容的情况下识别文件。

", - heading2: "如何使用此工具", - p2: "
  1. 选择输入类型:字符串请选择文本标签页,本地文件请选择文件标签页。
  2. 提供输入:将文本粘贴或将文件拖放到工作区中。
  3. 可选 HMAC:如果需要生成用于身份验证的密钥哈希,请在 HMAC 字段中输入密钥。
  4. 查看结果:工具会实时自动计算多种哈希变体(SHA-256、SHA-512 等)。
  5. 验证完整性:使用验证标签页,将已知哈希值与您的输入进行比对,以检查是否被篡改。
", - heading3: "常见使用场景", - p3: "", - heading4: "专业提示", - p4: "", - }, cheatsheet: { title: "哈希算法参考", h0: "算法对比", @@ -435,16 +371,6 @@ export default { text5: "至少使用 /", text6: "IPv6 /", }, - edu: { - heading1: "什么是CIDR?", - heading2: "如何使用此工具", - heading3: "常见使用场景", - heading4: "专业技巧", - p1: "无类域间路由(CIDR)是一种分配IP地址和IP路由的方法。它取代了基于类(A、B和C)的旧系统,以在地址分配中提供更多的灵活性和效率。", - p2: "输入带有前缀的IP地址(如192.168.1.0/24)或使用滑块调整前缀长度。点击\"运行分析\"查看网络详情、可用主机范围和二进制表示。", - p3: "为云基础设施(VPC)规划网络子网、排查路由问题、计算给定前缀的主机容量,以及在CIDR和子网掩码之间转换。", - p4: "请记住,在IPv4中,子网中的第一个和最后一个地址通常为网络ID和广播地址保留。在IPv6中,标准本地网络的子网几乎总是/64。", - }, cheatsheet: { title: "子网快速参考", h0: "常见子网", @@ -619,16 +545,6 @@ export default { tpl3: "更改默认值:", tpl4: "未找到与您的搜索匹配的端口。", }, - edu: { - heading1: "端口类别与安全指南", - p1: "知名端口(0-1023)由 IANA 分配,在 Unix 系统上需要 root 权限。注册端口(1024-49151)由应用程序使用。动态/临时端口(49152-65535)用于客户端连接。了解端口范围对防火墙配置和网络安全至关重要。", - heading2: "如何使用此工具", - p2: "按端口号或服务名称搜索,可查找协议详情和安全风险等级。按类别(知名、注册、动态)或协议(TCP/UDP)筛选以缩小结果范围。点击任意一行可查看完整详情,包括常见漏洞和加固建议。", - heading3: "常见使用场景", - p3: "防火墙规则配置、网络故障排查、在安全审计中识别意外开放的端口,以及协议端口分配的快速参考。", - heading4: "专业提示", - p4: "使用风险筛选器可快速识别网络中的高风险端口。“最常用的 50 个端口”部分可让您即时了解最常用的服务。", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
端口服务风险
21FTP未加密的文件传输
23Telnet明文身份验证
25SMTP邮件垃圾中继风险
53DNSDDoS 放大攻击
445SMB勒索软件传播
3389RDP暴力破解攻击
", @@ -872,16 +788,6 @@ export default { text4: "警告", alert0: "请先生成配置", }, - edu: { - heading1: "关于 WireGuard", - p1: "WireGuard 是一种现代、高性能的 VPN 协议,采用最先进的密码学技术。与 OpenVPN、IPsec 等旧协议相比,它的设计更简单、更快速,由于代码库极小,攻击面也小得多。WireGuard 现已成为 Linux 内核的一部分,并在 Windows、macOS、iOS 和 Android 上原生支持。", - heading2: "如何使用此工具", - p2: "选择拓扑模板(点对点、中心辐射型、站点到站点或移动办公)以预填充配置。点击生成密钥可在浏览器本地创建新的密钥对。填写必填字段后,点击生成配置即可生成 WireGuard 配置文件。使用下载 .conf 保存文件,或使用生成二维码创建可供移动端导入的二维码。", - heading3: "常见使用场景", - p3: "供员工连接公司网络的远程接入 VPN。用于连接分支机构网络的站点到站点 VPN。用于在公共 Wi-Fi 上安全浏览的个人 VPN 服务器。用于嵌入式设备之间安全通信的物联网设备隧道。", - heading4: "专业提示", - p4: "对于 NAT 后的客户端,使用 PersistentKeepalive = 25 可在无流量时保持隧道连接。PresharedKey 添加了一层额外的对称加密,以增强抗量子能力。AllowedIPs = 0.0.0.0/0 会将所有流量路由通过隧道(全隧道模式),而指定的 CIDR 则会创建分离隧道。", - }, cheatsheet: { title: "WireGuard 快速参考", h0: "接口字段", @@ -1025,14 +931,6 @@ export default { tpl6: "示例:", tpl7: "点击图中任意字段以查看详情。", }, - edu: { - heading1: "什么是协议头部?", - p1: "协议头部是位于网络数据包载荷之前的结构化数据。它们包含源地址和目标地址、协议类型、序列号、校验和等控制信息。了解头部结构对于网络调试、数据包分析和协议实现至关重要。", - heading2: "如何使用此工具", - p2: "从标签页中选择一个协议以查看其头部结构。每个彩色区块代表一个字段,并标注其大小。点击任意字段可查看详细信息,包括字段名称与描述、位/字节偏移、常见值及其含义,以及 RFC 参考。使用十六进制转储解析器,粘贴来自 tcpdump 或 Wireshark 等工具的十六进制输出,即可分析真实的数据包抓包。", - heading3: "常见使用场景", - p3: "数据包分析,用于理解捕获的网络流量结构;协议学习,作为研究网络协议的可视化辅助工具;调试,用于识别格式错误的头部或不正确的字段值;以及在实现网络协议时作为开发参考。", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
值协议
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
字段大小说明
Source Port2 字节源端口号
Dest Port2 字节目标端口号
Seq Number4 字节序列号
Ack Number4 字节确认号
Data Offset4 位首部长度 / 4
Flags9 位NS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 字节接收窗口大小
", @@ -1108,16 +1006,6 @@ export default { tpl0: "差异", tpl1: "未发现差异(或输入为空)", }, - edu: { - heading1: "什么是文本差异比较?", - p1: "文本差异比较是指对比两段数据序列以找出其间差异的过程。它会突出显示新增、删除或修改的内容。这是软件开发、数据分析和内容管理中的一项基本操作,可让用户随时间跟踪变更,或比较文档的不同版本。", - heading2: "差异比较算法", - p2: "大多数文本差异比较工具都基于最长公共子序列(LCS)问题的算法。其目标是找到在两段文本中以相同相对顺序出现的最长元素序列。常见实现包括高效且被 Git 使用的 Myers 差异算法,以及 Hunt-McIlroy 算法。这些算法用于计算将一段文本转换为另一段文本所需的最少编辑次数。", - heading3: "使用场景", - p3: "代码审查,让开发者能够准确看到某个拉取请求中发生了哪些变化。像 Git 这样的版本控制系统将历史记录存储为一系列差异,以节省空间。内容审核,供作者和编辑比较草稿,以确保所有要求的修改都已完成。数据验证,用于比较配置文件或数据库导出内容以发现差异。", - heading4: "专业提示", - p4: "许多差异比较工具都提供忽略缩进或行尾空格变化的选项,这可以在比较代码时减少干扰。在差异内容周围保留几行未更改的文本(上下文行),有助于理解变更的影响范围。对于散文和自然语言文档,词级差异通常更有用,而对代码来说,行级差异则是标准做法。", - }, }, "regex-visualizer": { name: "正则表达式可视化工具", @@ -1168,16 +1056,6 @@ export default { tpl5: "无分组", tpl6: "无效的正则表达式", }, - edu: { - heading1: "什么是正则表达式?", - p1: "正则表达式(regex)是用于匹配字符串中字符组合的强大模式。它们是各种编程语言中进行文本处理、验证和数据提取的重要工具。正则表达式模式由字面字符和定义搜索规则的特殊元字符组成。它们被用于表单验证、日志解析、查找替换操作以及数据清洗任务。", - heading2: "如何使用此工具", - p2: "在输入框中输入您的正则表达式模式。工具会自动生成铁路图(railroad diagram)以可视化模式结构。添加测试文本即可实时查看匹配高亮和说明。使用速查表快速参考常见模式和语法。为您偏好的编程语言生成代码片段。", - heading3: "常见使用场景", - p3: "邮箱验证,在处理之前确保用户输入符合正确的邮箱格式;日志解析,从服务器日志中提取时间戳和 IP 地址;数据清洗,去除不需要的字符或统一格式化电话号码;以及使用模式匹配进行批量文本转换的查找替换。", - heading4: "专业提示", - p4: "从简单开始,逐步构建复杂的模式。当您不需要引用匹配内容时,请使用非捕获分组 (?:)。测试空字符串和特殊字符等边界情况。注意正则表达式的可读性——复杂的模式可以用注释加以说明。", - }, cheatsheet: { title: "正则表达式快速参考", h0: "字符类", @@ -1323,16 +1201,6 @@ export default { text1: "复制", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "关于 SSH 密钥", - p1: "SSH 密钥是一对用于对远程系统进行安全身份验证的密码学密钥。私钥保留在您的本机上,而公钥则放置在服务器上。这种非对称方式远比密码验证更安全,是服务器访问、Git 托管和自动化部署的行业标准。", - heading2: "如何使用此工具", - p2: "选择您偏好的密钥类型(RSA 或 ECDSA),如果选择 RSA,还需选择密钥长度。添加一个可选的注释以标识该密钥(通常为 user@host)。点击生成即可创建密钥对。将公钥复制并添加到您的服务器,并在本地机器上妥善保管私钥。", - heading3: "常见使用场景", - p3: "服务器身份验证,实现远程服务器的免密码 SSH 登录。Git 托管,无需密码即可通过 GitHub、GitLab 或 Bitbucket 进行身份验证。CI/CD 流水线,用于需要连接服务器的自动化部署脚本。堡垒机访问,用于安全的跳板机配置。", - heading4: "专业提示", - p4: "对于新部署,建议使用 Ed25519 密钥——它们比 RSA 更快、更安全。始终使用强密码短语来保护您的私钥。使用 ssh-agent 可避免在一次会话中反复输入密码短语。将密钥存储在 ~/.ssh/ 中,并将权限设置为 600。", - }, cheatsheet: { title: "SSH 密钥快速参考", h0: "密钥类型", @@ -1372,16 +1240,6 @@ export default { tpl2: "无使用者备用名称。", tpl3: "未解析到扩展。", }, - edu: { - heading1: "什么是 X.509 证书?", - heading2: "如何使用此工具", - heading3: "常见使用场景", - heading4: "专业提示", - p1: "

X.509 是公钥证书的标准格式,这类数字文档能够将公钥安全地绑定到某个身份(例如网站、组织或个人)。这些证书是公钥基础设施(PKI)的基石,用于通过 HTTPS 保护互联网安全,也用于对电子邮件和软件进行签名。

X.509 证书包含公钥、证书持有者的身份,以及签发该证书的证书颁发机构(CA)的数字签名,用以证明其真实性。

", - p2: "
  1. 粘贴您的证书:复制 PEM 编码的证书(包括 BEGIN 和 END 头部),并粘贴到输入框中。
  2. 解析:点击“解析证书”以提取并分析数据。
  3. 查看摘要:在顶部卡片中查看通用名称(CN)、签发者和有效期。
  4. 检查详情:展开下方各部分以查看完整的主题、签发者、SAN 以及技术扩展。
  5. 检查状态:查看状态徽章以确认证书当前是有效还是已过期。
", - p3: "", - p4: "", - }, cheatsheet: { title: "X.509 证书参考", h0: "证书字段", @@ -1424,16 +1282,6 @@ export default { text1: "复制 JSON", text2: "复制 XML", }, - edu: { - heading1: "什么是 SAML?", - p1: "安全断言标记语言(SAML)是一种基于 XML 的开放标准,用于在各方之间交换身份验证和授权数据,特别是在身份提供方(IdP)与服务提供方(SP)之间。SAML 是许多企业单点登录(SSO)解决方案的核心,让用户可以使用一套凭据访问多个应用程序。最常用的版本是 SAML 2.0,它使用包含断言的安全令牌,在 IdP 与 SP 之间传递关于主体的信息。", - heading2: "如何使用此工具", - p2: "将 Base64 编码的 SAMLResponse 或原始 XML 粘贴到输入框中。如果要解码 Redirect 绑定的载荷,请切换“尝试解压”选项。点击解码响应以解析消息。在快速摘要中查看签发者、主题和有效性状态。在属性表中查看解码后的用户属性。使用标签页查看格式化 XML、断言详情,或声明的 JSON 表示形式。", - heading3: "常见使用场景", - p3: "SSO 故障排查,通过检查断言是否过期或受众是否不匹配来诊断用户无法登录的原因。集成测试,验证您的身份提供方是否发送了正确的属性。安全审计,检查原始 XML 以确保断言已正确签名。开发调试,在服务提供方集成过程中快速查看 SAML 消息的内容。", - heading4: "专业提示", - p4: "通过 HTTP-Redirect 发送的 SAML 消息通常会先经过 deflate 压缩,再进行 Base64 编码——如果解码失败,请尝试切换“尝试解压”复选框。请确保 AudienceRestriction 与您的 SP Entity ID 匹配。如果响应被标记为无效,请检查 NotBefore 和 NotOnOrAfter 时间,看看 IdP 与 SP 时钟之间是否存在时间偏差。", - }, cheatsheet: { title: "SAML 快速参考", h0: "SAML 流程", @@ -1476,16 +1324,6 @@ export default { alert1: "请输入 User-Agent 字符串", tpl2: "原始分析输出", }, - edu: { - heading1: "什么是 User-Agent?", - p1: "User-Agent 是您的浏览器在访问每个网站时都会发送的一个字符串。它标识了浏览器版本、操作系统和设备类型,使服务器能够针对您的具体环境优化内容。", - heading2: "如何使用此工具", - p2: "将 User-Agent 字符串粘贴到输入框中,或点击“使用此项”分析您当前浏览器的字符串。工具会拆解出浏览器引擎、操作系统版本和设备特征。", - heading3: "常见使用场景", - p3: "调试网站兼容性问题、分析 Web 服务器日志以识别机器人流量、验证浏览器伪装,以及了解受众的设备分布情况。", - heading4: "专业提示", - p4: "许多现代浏览器会冻结或简化其 User-Agent 字符串以防止指纹追踪。请始终查找 Version 或 Chrome 标记以获取最准确的版本信息。", - }, }, "qr-code": { name: "QR 码生成器", @@ -1524,16 +1362,6 @@ export default { alert3: "已复制!", tpl4: "上传图片以解码", }, - edu: { - heading1: "什么是二维码?", - p1: "快速响应码(QR 码)是一种二维条形码,可以存储各种类型的数据,最常见的是 URL。智能手机和专用扫描器可以扫描它们,从而快速访问信息或触发操作。", - heading2: "如何使用此工具", - p2: "输入您想要编码的文本或 URL。如有需要,可调整尺寸和纠错级别。二维码会实时更新,并可下载为图片用于打印或数字用途。", - heading3: "常见使用场景", - p3: "分享网站链接、提供 Wi-Fi 登录凭据、数字名片(vCard)、活动门票,以及移动支付或身份验证流程。", - heading4: "专业提示", - p4: "更高的纠错级别(H 或 Q)可以让二维码在部分损坏或遮挡的情况下依然可被扫描,非常适合用于实体标识或品牌宣传。", - }, }, "timestamp-converter": { name: "时间戳转换器", @@ -1564,16 +1392,6 @@ export default { text0: "无效的时间戳", tpl1: "Unix(毫秒)", }, - edu: { - heading1: "什么是Unix时间?", - p1: "Unix时间(也称为Epoch时间、POSIX时间或Unix时间戳)是一种描述时间点的系统。它是自Unix纪元以来经过的秒数(减去闰秒);Unix纪元是1970年1月1日00:00:00 UTC。它在操作系统和文件格式中被广泛使用,因为它是一个单一整数,便于计算机存储和操作。这个标准使不同系统能够准确地通信时间,而无需考虑其本地时区设置。", - heading2: "如何使用此工具", - p2: "将Unix转换为人类可读格式:在Unix时间戳字段中输入时间戳,并选择它是秒还是毫秒。将人类可读格式转换为Unix:使用选择器选择日期和时间,然后选择所需时区。使用\"现在\"按钮快速获取当前时间戳。实时查看结果,包括ISO 8601、本地时间、UTC和相对时间。点击任何结果旁边的复制按钮将其保存到剪贴板。", - heading3: "常见使用场景", - p3: "日志分析,将服务器日志或数据库条目中的神秘时间戳转换为可读日期以进行调试。API开发,验证您的后端是否发送了正确的纪元值。数据迁移,确保在系统间移动时基于时间的数据保持一致。调度,为cron作业、过期日期或事件触发器计算未来或过去的时间戳。", - heading4: "专业技巧", - p4: "使用JavaScript时,请记住Date.now()返回毫秒,而标准Unix时间戳以秒为单位——除以1000进行转换。始终使用ISO 8601格式在系统间交换数据以确保最大兼容性。注意2038年问题,32位有符号整数将溢出;现代系统使用64位整数,在可预见的未来解决了这个问题。", - }, }, "color-converter": { name: "颜色转换器", @@ -1589,16 +1407,6 @@ export default { badge7: "仅限客户端", badge8: "隐私优先", }, - edu: { - heading1: "颜色模型详解(HEX/RGB/HSL)", - heading2: "如何使用此工具", - heading3: "常见使用场景", - heading4: "专业技巧", - p1: "

颜色模型是表示颜色的数学系统。HEX(十六进制)是HTML和CSS中使用的6位代码,表示红、绿、蓝三个分量。RGB(红、绿、蓝)在数字成像中常用,每个通道使用0到255的十进制值。

HSL(色调、饱和度、亮度)对人类更直观,因为它以基本颜色(色调)、强度(饱和度)和亮度来描述颜色。了解这些模型有助于为您的设计和开发需求选择正确的格式,确保在不同平台和设备之间保持一致性。

", - p2: "
  1. 在饱和度/亮度方块中拖动光标并使用色调滑块,通过可视化颜色选择器选择颜色。
  2. 或者,在\"手动输入\"字段中输入特定值(支持#hex、rgb或hsl格式)。
  3. 观察\"预览\"框以实时查看所选颜色。
  4. 在下方的HEX、RGB、HSL和HSV卡片中查看转换后的值。
  5. 点击任意卡片上的\"复制\"图标将该特定格式保存到剪贴板。
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "单位转换器", @@ -1616,16 +1424,6 @@ export default { text0: "选择单位以查看换算公式", text1: "请输入有效数字", }, - edu: { - heading1: "测量系统概述", - p1: "测量系统是测量单位的集合及其相互关系的规则。两个最常见的系统是公制(国际单位制或SI)和英制系统。公制基于十的幂次,非常逻辑化且易于扩展。主要在美国使用的英制系统使用英寸、英尺和磅等单位,具有历史起源和不太统一的换算系数。理解这些系统之间的差异对于科学、工程、国际贸易以及烹饪或旅行等日常任务至关重要。", - heading2: "如何使用此工具", - p2: "从顶部的网格中选择测量类别(如长度、重量、温度)。在\"从\"下拉菜单中选择要转换的单位。在输入字段中输入要转换的值。在\"到\"下拉菜单中选择目标单位。转换后的值将立即显示,并附有用于转换的数学公式。", - heading3: "常见使用场景", - p3: "旅行时将公里换算为英里或将摄氏度换算为华氏度。烹饪时在公制(克/毫升)和英制(盎司/杯)测量之间转换食谱。工程和科学中不同压力、能量或速度单位之间的精确换算。数字存储,了解兆字节、千兆字节和太字节之间的差异。", - heading4: "专业技巧", - p4: "使用交换按钮快速反转所选单位之间的换算方向。始终仔细检查特定的单位类型,特别是对于体积和重量,因为名称在不同系统中可能类似,例如美制加仑与英制加仑。在连续执行多次换算时,在最终结果之前保留尽可能多的小数位,以避免累积舍入误差。", - }, }, "yaml-toml-converter": { name: "YAML/TOML 转换器", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ TOML 转换失败:", tpl7: "等待转换。", }, - edu: { - heading1: "YAML、TOML 与 JSON 对比", - p1: "JSON 因其简洁性以及在 JavaScript 中的原生支持,成为数据交换中使用最广泛的格式。YAML(YAML Ain't Markup Language)是一种对人类友好的数据序列化标准,使用缩进来表示结构,因此在复杂配置文件中很受欢迎。TOML(Tom's Obvious, Minimal Language)的设计目标是语义明确、易读易写,常用于项目配置。JSON 严格且紧凑,而 YAML 和 TOML 则更注重可读性和手动编辑的便利性。", - heading2: "如何使用此工具", - p2: "将您的配置数据(JSON、YAML 或 TOML)粘贴到左侧的源文本区域。工具会自动检测源格式,您也可以从下拉菜单中手动选择。点击“仅验证”可检查语法错误而不执行转换。点击某个转换按钮(转为 JSON、转为 YAML、转为 TOML)即可将数据转换为该格式。在右侧的输出面板中查看结果,并点击复制将其保存到剪贴板。", - heading3: "常见使用场景", - p3: "基础设施即代码,在处理 Kubernetes 清单、Docker Compose 文件或 AWS CloudFormation 模板时在 JSON 与 YAML 之间转换。项目配置,在 package.json(JSON)与 pyproject.toml 或 Cargo.toml(TOML)之间迁移设置。API 原型设计,快速查看复杂数据结构在不同格式下的呈现方式。旧版迁移,在确保数据完整性的同时将旧配置文件转换为现代格式。", - heading4: "专业提示", - p4: "在 CI/CD 流水线中使用 YAML,因为复杂嵌套结构的可读性对可维护性至关重要。应用级配置文件优先选用 TOML,为可能需要手动编辑的终端用户提供简洁的界面。从 YAML 转换为 JSON 时,请注意 YAML 的类型强制转换问题(例如 NO 可能被解释为 false),并确保数据类型被正确保留。", - }, cheatsheet: { title: "格式对比", h0: "语法差异", @@ -1719,16 +1507,6 @@ export default { text1: "复制", text2: "已复制!", }, - edu: { - heading1: "什么是 htpasswd?", - p1: "

htpasswd 文件是一种平面文件数据库,用于在 Apache 和 Nginx Web 服务器上存储基本身份验证所需的用户名和哈希密码。它是保护网站特定目录或管理面板的一种简单而有效的方式,而无需完整的数据库支撑的身份验证系统。

htpasswd 文件中的每一行代表一个用户,格式为 username:hashed_password。

", - heading2: "如何使用此工具", - p2: "
  1. 输入用户名:输入您要用于身份验证的用户名。
  2. 提供密码:输入密码,或点击“生成强密码”以创建一个安全的密码。
  3. 选择算法:选择 Bcrypt(-B)以获得现代安全性,或选择 Apache MD5(-m)以兼容旧版系统。
  4. 生成:点击“生成条目”以创建哈希字符串。
  5. 复制或下载:将生成的行复制到剪贴板,或将其下载为文件上传到您的服务器。
", - heading3: "常见使用场景", - p3: "", - heading4: "专业提示", - p4: "", - }, }, "mock-data-generator": { name: "模拟数据生成器", @@ -1762,16 +1540,6 @@ export default { text1: "复制", text2: "没有可预览的行。", }, - edu: { - heading1: "什么是模拟数据?", - p1: "

模拟数据是合成信息,它模仿真实世界的数据,而不包含任何敏感或个人可识别信息(PII)。对于需要真实数据集来构建和验证应用程序的开发人员和测试人员来说,它是必不可少的,无需冒数据泄露风险或违反GDPR或CCPA等隐私法规。通过使用模拟数据,您可以模拟各种场景,从标准用户配置文件到边缘情况,确保您的软件能够优雅地处理所有类型的输入。

", - heading2: "测试策略", - p2: "

有效的测试需要多样化的数据集。使用模拟数据为开发数据库提供种子数据、用数千条记录执行负载测试,或验证不同字符串长度的UI布局。它对于需要来自外部API的可预测响应的集成测试特别有用。通过在本地生成数据,您可以创建易于重置和复现的一致测试环境,从而实现更可靠和更快速的开发周期。

", - heading3: "模拟中的数据隐私", - p3: "

隐私是现代软件开发的首要任务。在开发或测试环境中使用真实生产数据是重大安全风险。模拟数据生成器通过生成假但结构正确的数据来解决这个问题。我们的工具完全在您的浏览器中运行,这意味着您的配置和生成的数据永远不会离开您的设备。这种隐私优先的方法确保即使创建模拟数据的过程也是安全的,并符合最严格的安全标准。

", - heading4: "专业技巧", - p4: "", - }, cheatsheet: { title: "模拟数据字段类型", h0: "可用类型", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "命名规范详解(camelCase/snake_case 等)", - heading2: "如何使用此工具", - heading3: "常见使用场景", - heading4: "专业提示", - p1: "

命名规范是一套用于选择标识符字符序列的规则,这些标识符用于表示源代码和文档中的变量、类型、函数及其他实体。camelCase(例如 myVariable)以小写字母开头,并将后续每个单词的首字母大写。snake_case(例如 my_variable)使用下划线分隔单词。

PascalCase(例如 MyVariable)将每个单词的首字母都大写,而 kebab-case(例如 my-variable)使用连字符分隔单词。这些规范不仅仅关乎美观,它们对代码的可读性、可维护性,以及是否符合不同编程语言和框架的惯用标准都至关重要。

", - p2: "
  1. 在页面顶部的“输入文本”区域输入或粘贴您的文本。
  2. 工具会自动实时将您的输入转换为十余种不同的大小写样式。
  3. 滚动浏览“转换结果”网格,找到您需要的具体样式。
  4. 点击任意结果旁的“复制”图标,将其保存到剪贴板。
  5. 使用“清除”按钮移除所有输入并开始新的转换。
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "代码压缩工具", @@ -1913,16 +1671,6 @@ export default { text2: "📋 复制", tpl3: "所有处理均在您的浏览器中完成。您的代码在本地处理,不会发送到我们的服务器。", }, - edu: { - heading1: "什么是代码压缩?", - heading2: "如何使用此工具", - heading3: "常见使用场景", - heading4: "专业提示", - p1: "

代码压缩是指在不改变代码功能的前提下,去除源代码中所有不必要字符的过程。这包括去除空白字符、换行符、注释,有时还会缩短变量名。其目的是减小代码文件体积,从而减少需要通过网络传输的数据量。

这能带来更快的页面加载速度,并提升 Web 应用程序的性能。虽然代码压缩对生产环境至关重要,但它会让代码几乎无法被人类阅读和调试。因此,它通常是在部署到线上服务器之前,作为构建流程的最后一步来执行。

", - p2: "
  1. 从顶部标签页中选择编程语言(JavaScript、CSS、HTML 或 JSON)。
  2. 将您的源代码粘贴到左侧的“输入代码”文本区域。
  3. 点击“压缩代码”按钮,以缩小文件体积用于生产环境。
  4. 或者,点击“美化代码”以添加缩进和格式,提升可读性。
  5. 在“输出代码”区域查看结果,并点击“复制”或“下载”以保存优化后的代码。
", - p3: "", - p4: "", - }, }, "image-converter": { name: "图片转换器", @@ -1969,16 +1717,6 @@ export default { alert2: "读取文件出错。", tpl3: "使用 Canvas API 进行客户端处理——无需上传,即时呈现结果", }, - edu: { - heading1: "图像格式对比(PNG/JPEG/WebP)", - p1: "

选择合适的图像格式对网页性能和视觉质量至关重要。JPEG 最适合照片和色彩丰富的复杂图像,因为它使用有损压缩来实现较小的文件体积。PNG 则更适合需要透明度、或包含清晰边缘和纯色(例如徽标和图标)的图像,因为它采用无损压缩。

WebP 是一种现代格式,能提供更优秀的有损和无损压缩效果,通常在保持高质量的同时,文件体积明显小于 JPEG 或 PNG。

", - heading2: "如何使用此工具", - p2: "
  1. 将图像拖放到“上传图像”区域,或点击浏览文件进行上传。
  2. 在“转换格式”选项中选择您想要的输出格式(PNG、JPG 或 WebP)。
  3. 如果您选择了 JPG 或 WebP 等有损格式,可使用质量滑块在文件体积与视觉保真度之间取得平衡。
  4. 您还可以选择使用“调整图像大小”设置,按百分比或指定尺寸缩放图像。
  5. 点击“转换并调整图像大小”,然后点击“下载”即可保存优化后的图像。
", - heading3: "常见使用场景", - p3: "", - heading4: "专业提示", - p4: "", - }, }, "css-gradient": { name: "CSS 渐变生成器", @@ -2018,16 +1756,6 @@ export default { alert2: "复制 CSS 到剪贴板失败", tpl3: "加载界面和遮罩层", }, - edu: { - heading1: "什么是 CSS 渐变?", - heading2: "线性渐变 vs 径向渐变 vs 锥形渐变", - heading3: "浏览器支持与性能", - heading4: "打造更好渐变的专业提示", - p1: "

CSS 渐变是一项强大的功能,可以在两种或多种指定颜色之间显示平滑过渡效果。与传统的背景图像不同,渐变是由浏览器生成的,这意味着它们可以无限缩放、消耗更少的带宽,并且可以通过代码轻松操控。它们常用于背景、按钮和装饰元素,为网页设计增添层次感和视觉趣味。

", - p2: "

CSS 渐变主要有三种类型:

", - p3: "

现代 CSS 渐变已在包括 Chrome、Firefox、Safari 和 Edge 在内的所有主流浏览器中得到广泛支持。由于它们是由浏览器引擎通过数学方式渲染的,因此与高分辨率图像相比,性能极佳。不过,对于包含数十个颜色节点的非常复杂的渐变,最好在低端设备上测试其性能。对于较旧的浏览器(如 IE9 及以下版本),建议提供纯色回退方案。

", - p4: "", - }, }, "curl-studio": { name: "cURL 工作室", @@ -2096,16 +1824,6 @@ export default { text2: "已复制!", tpl3: "脱敏后的日志将显示在此处...", }, - edu: { - heading1: "什么是 PII?", - p1: "

个人身份信息(PII)是指任何可用于识别特定个人的数据。这包括姓名、电子邮件地址和电话号码等直接标识符,以及 IP 地址、物理位置和信用卡号等间接标识符。在服务器日志的语境中,PII 通常出现在请求参数、请求头或错误消息中。

保护 PII 是现代数据安全的关键部分,也是全球各种法律框架的强制要求。

", - heading2: "合规要求(GDPR/CCPA)", - p2: "

诸如欧洲《通用数据保护条例》(GDPR)和美国《加州消费者隐私法案》(CCPA)等法规,对个人数据的处理方式制定了严格规则。这些法律要求组织实施“隐私设计原则”,并将个人数据的收集与存储降至最低限度。

与第三方支持团队或开发者共享包含 PII 的原始日志可能导致合规违规。在数据离开您的安全环境之前对其进行脱敏或屏蔽处理,是维持监管合规的关键一步。

", - heading3: "脱敏策略", - p3: "

处理日志中敏感数据的方法有以下几种:

本工具专注于脱敏处理,通过模式匹配即时查找并替换常见的 PII 格式。

", - heading4: "专业提示", - p4: "", - }, }, "mermaid-studio": { name: "Mermaid 工作室", @@ -2306,16 +2024,6 @@ export default { text51: "尚未提取到任何 URL。", text52: "尚无路由数据。", }, - edu: { - heading1: "邮件身份验证详解", - heading2: "SPF/DKIM/DMARC", - heading3: "钓鱼检测", - heading4: "专业提示", - p1: "

邮件身份验证是一系列用于提供邮件来源可验证信息的技术。通过验证发件人的身份,这些协议帮助邮件服务器区分合法邮件与伪造或欺诈性邮件(如钓鱼邮件)。现代邮件身份验证的三大支柱是 SPF、DKIM 和 DMARC。

当邮件被接收时,接收服务器会执行这些检查,并将结果记录在邮件头部中,本工具会为您解析这些内容。

", - p2: "", - p3: "

钓鱼邮件通常使用“伪造”手法,使其看起来像是来自可信来源。我们的分析工具会查找常见的危险信号,例如“From”地址(用户看到的地址)与“Return-Path”(邮件的实际来源)之间的不匹配。我们还会提取并分析邮件正文中的 URL,以识别可疑链接,例如使用 Punycode(仿冒域名)或以 IP 地址代替主机名的链接。

通过查看“发现的问题”部分,您可以快速识别这些信号,并判断该邮件是否可以安全地进行交互。

", - p4: "", - }, cheatsheet: { title: "邮件身份验证快速参考", h0: "这些检查项的含义", @@ -2491,16 +2199,6 @@ export default { text9: "请先粘贴 SQL。", text10: "✓ 已复制", }, - edu: { - heading1: "为何要格式化 SQL?", - p1: "SQL 很容易变得复杂难读,尤其是在处理多重连接、子查询和嵌套条件时。格式化 SQL 包括添加一致的缩进、换行以及关键字的大小写规范。这能让查询的逻辑更易于理解,对调试、代码审查以及长期维护大型数据库架构都至关重要。格式良好的查询在手动编辑时也不容易出现逻辑错误。", - heading2: "如何使用此工具", - p2: "将您的原始 SQL 查询粘贴到左侧的“输入 SQL”编辑器中。选择您的数据库方言(Postgres 或 MySQL)以及偏好的关键字大小写(大写或小写)。点击“格式化”按钮,以恰当的缩进和间距美化您的查询。使用“验证”按钮检查常见的结构性问题,例如未闭合的引号或不匹配的括号。点击“复制”将格式化后的 SQL 保存到剪贴板,或点击“清除”重新开始。", - heading3: "常见使用场景", - p3: "代码审查,在提交拉取请求之前格式化混乱的 SQL。调试,清理由 ORM 生成的查询,以准确了解针对数据库执行的具体操作。文档编写,为技术指南、维基或 README 文件创建清晰易读的示例。旧代码清理,快速将陈旧、未格式化的脚本重构为现代、易读的风格。", - heading4: "专业提示", - p4: "使用带 WITH 子句的公用表表达式(CTE),将复杂查询拆解为更小、更易管理的部分。始终为表和列使用描述性别名,使查询意图更加清晰。如果需要将 SQL 压缩为一行以用于配置文件或命令行工具,请使用“压缩”按钮。", - }, cheatsheet: { title: "SQL 格式化提示", h0: "快速改进点", @@ -2569,16 +2267,6 @@ export default { text15: "注意:为安全起见,值已被脱敏。差异比较为启发式方法,不包含注释/顺序。", text16: "✓ 已复制", }, - edu: { - heading1: "环境变量最佳实践", - heading2: "密钥管理", - heading3: ".env 安全性", - heading4: "专业提示", - p1: "

环境变量是“十二要素应用”(Twelve-Factor App)方法论的基本组成部分,该方法论主张将配置与代码严格分离。通过使用环境变量,您只需更改配置值,即可在不同环境(开发、预发布、生产)中运行相同的代码。

最佳实践包括使用具有描述性的大写名称(例如 DATABASE_URL),为非关键设置提供默认值,并且绝不将敏感信息直接硬编码到源代码控制系统中。

", - p2: "

密钥是一类特殊的环境变量,包含 API 密钥、数据库密码和私有证书等敏感信息。安全地管理这些信息对于防止数据泄露至关重要。对于生产环境,您应使用专用的密钥管理服务(例如 AWS Secrets Manager、HashiCorp Vault 或 Cloudflare Secrets)。

在本地开发中,通常会使用 .env 文件,但这些文件绝不应提交到您的 Git 仓库中。请始终将 *.env 添加到您的 .gitignore 文件中。

", - p3: "

在与团队成员共享 .env 文件进行调试时,存在意外泄露生产环境密钥的高风险。本工具通过提供“脱敏敏感值”功能来帮助降低这一风险。它使用启发式方法识别 SECRET、TOKEN 或 PASSWORD 等键,并将其值替换为脱敏版本(例如 ab...yz (32))。

这使您可以比较环境文件的结构和非敏感值,而不会泄露实际的密钥。

", - p4: "", - }, cheatsheet: { title: "Dotenv 说明", h0: "脱敏策略", @@ -2638,16 +2326,6 @@ export default { text7: "暂无预览。", text8: "✓ 已复制", }, - edu: { - heading1: "什么是 SVG?", - p1: "SVG(可缩放矢量图形)是一种基于 XML 的二维图形矢量图像格式,支持交互性和动画效果。与 JPEG 或 PNG 等位图格式不同,SVG 由数学路径定义,这意味着它们可以缩放到任意大小而不损失质量。这使其非常适合用于网页上的徽标、图标和插图,无论是在移动设备屏幕还是高分辨率桌面显示器上都能保持清晰锐利。", - heading2: "如何使用此工具", - p2: "将您的 SVG 代码粘贴到左侧的“SVG 输入”文本区域中。点击“预览”查看图形并提取其调色板。使用“优化”或“压缩”按钮清理标记并减小文件体积。您还可以在“颜色”面板中输入新值并点击“应用”来替换特定颜色。点击“复制”或“下载”以保存经过消毒和优化的 SVG。", - heading3: "常见使用场景", - p3: "图标管理,清理从 Figma 或 Illustrator 等设计工具导出的 SVG。主题定制,快速更改图标集的颜色以匹配您的品牌调色板。安全性,对来自不受信任来源的 SVG 进行消毒处理,以移除潜在的脚本或外部引用。性能优化,压缩 SVG 标记以减小内联图形的体积,提升页面加载速度。", - heading4: "专业提示", - p4: "使用 currentColor 按钮,将所有显式的填充和描边转换为 currentColor,使您的 SVG 可以通过 CSS 轻松设置样式。在生产环境中使用 SVG 之前,请始终对其进行优化,确保文件尽可能小。在设计工具中创建 SVG 时,请使用“轮廓化描边”和“简化路径”功能,在优化之前降低生成代码的复杂度。", - }, cheatsheet: { title: "SVG 安全说明", h0: "消毒处理", @@ -2801,16 +2479,6 @@ export default { text28: "点击扫描以查找密钥。", text29: "✓ 已复制", }, - edu: { - heading1: "什么是密钥泄露?", - p1: "当 API 密钥、密码或私有令牌等敏感信息被意外提交到版本控制系统或在公共论坛中分享时,就会发生密钥泄露。这类泄露可能导致未经授权的访问、数据泄露和经济损失。本工具帮助您在分享或提交代码之前,在浏览器本地识别常见的密钥模式。", - heading2: "如何使用此工具", - p2: "将您的代码、配置或日志文件粘贴到输入区域。点击“扫描”按钮以分析文本中是否存在潜在密钥。查看每个检测项的发现结果和建议。使用“复制脱敏结果”按钮,获取密钥已被遮蔽、可安全分享的文本版本。", - heading3: "常见使用场景", - p3: "提交前检查,在提交代码之前进行扫描,确保不包含任何密钥。日志脱敏,在与支持团队或同事共享日志之前遮蔽其中的敏感令牌。安全审计,快速审查配置文件中是否存在硬编码凭据。", - heading4: "专业提示", - p4: "一旦发现凭据已泄露,请务必立即进行轮换。使用环境变量或密钥管理器,而不是在源代码中硬编码密钥。启用“包含低严重性模式”可进行更全面的扫描,但也要预料到会有更多误报。", - }, cheatsheet: { title: "如果发现密钥该怎么办", h0: "立即采取的措施", @@ -2907,16 +2575,6 @@ export default { text15: "✓ 有效的 JWKS 结构(", text16: "请粘贴 JWK。", }, - edu: { - heading1: "什么是 JWT?", - p1: "JSON Web Token(JWT)是一种紧凑、URL 安全的格式,用于在双方之间传递声明。JWT 由三部分组成,均采用 Base64URL 编码并以点号分隔:头部(算法和类型)、载荷(声明)和签名。签名确保令牌未被篡改。JWT 常用于 Web API 中的身份验证和信息交换。标准声明包括 sub(主题)、iss(签发者)、aud(受众)、exp(过期时间)、nbf(生效时间)、iat(签发时间)和 jti(JWT ID)。", - heading2: "JWT 算法", - p2: "HS256/384/512 使用 HMAC 结合 SHA-2 和共享密钥——简单,但双方必须持有相同的密钥。RS256/384/512 使用 RSA PKCS#1 v1.5 非对称签名——非常适合微服务架构,因为各服务只需持有公钥即可。ES256/384/512 使用基于 NIST 曲线的 ECDSA,在相同安全强度下签名比 RSA 更小。PS256/384/512 使用 RSA-PSS,这是一种概率性变体,在现代系统中比 RS* 更受青睐。", - heading3: "JWK 与 JWKS", - p3: "JSON Web Key(JWK)是表示密码学密钥的 JSON 结构。JWK 集(JWKS)是一种 JSON 结构,在 keys 属性下包含一个 JWK 数组。服务会在一个知名 URL(例如 /.well-known/jwks.json)上发布其 JWKS,使客户端无需带外密钥交换即可获取用于 JWT 验证的公钥。JWKS 中的密钥通过其 kid(密钥 ID)进行标识,JWT 头部会引用该 ID。", - heading4: "安全最佳实践", - p4: "始终在服务器端验证 exp、nbf、iss 和 aud 声明。切勿在生产环境中使用 alg: none 算法——它会移除所有签名保护。当多个服务需要验证令牌时,优先使用非对称算法(RS*、ES*、PS*)而非 HMAC。定期轮换密钥,并使用 kid 标识每个令牌使用了哪个密钥进行签名。安全存储私钥——切勿将其提交到版本控制系统。使用较短的过期时间和刷新令牌,而不是长期有效的 JWT。", - }, }, "encoding-workbench": { name: "编码工作台", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "未检测到可识别的编码层级。", }, - edu: { - heading1: "编码与哈希有何区别?", - heading2: "如何使用此工具", - heading3: "多层编码详解", - heading4: "哈希算法指南", - p1: "

编码是将数据转换为另一种可逆(可解码)表示形式的过程。常见格式包括 Base64——用于通过文本通道传输二进制数据、URL 编码、HTML 实体编码和十六进制编码。编码不是加密;它不提供机密性保护。

哈希是一种单向数学变换。密码学哈希函数会接收任意输入并生成一个固定长度的指纹。您无法通过哈希值反推出原始输入。哈希被用于验证文件完整性、安全存储密码,以及生成数字签名。

", - p2: "
  1. 编码 / 解码标签页:粘贴文本并选择一种操作(Base64、URL、HTML、十六进制),或点击自动检测层级以自动解开多层嵌套编码。
  2. 哈希标签页:输入文本或选择文件,选择算法,然后点击全部计算哈希。启用 HMAC 模式可使用共享密钥计算密钥哈希。
  3. 识别标签页:粘贴未知的哈希值或已编码字符串,点击识别即可查看可能的算法及其置信度评分。
", - p3: "

现实世界中的数据往往会被多次编码。例如,一个载荷可能先经过 URL 编码,再经过 Base64 编码,然后被放入一个十六进制字符串中。自动检测层级功能会检查输入模式,依次尝试每一种解码方式,并将每一步以卡片形式可视化呈现,让您清楚地看到数据是如何被层层包裹的。

", - p4: "", - }, }, "oauth-debugger": { name: "OAuth 调试器", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "什么是 PKCE?它为何重要?", - p1: "

用于代码交换的证明密钥(PKCE,RFC 7636)最初是为无法安全存储客户端密钥的移动应用和原生应用而设计的。其工作原理是:客户端生成一个随机的 code_verifier,并由此推导出一个 code_challenge(SHA-256 + base64url),然后在授权请求中发送该挑战值。在用授权码换取令牌时,客户端会发送原始的 code_verifier。授权服务器会验证其是否与此前的挑战值匹配——从而证明令牌请求来自发起该流程的同一客户端。

即使对于机密客户端(拥有客户端密钥的服务端应用),OAuth 2.1 现在也建议使用 PKCE,以防御授权码拦截攻击。

", - heading2: "为什么隐式授权流程已被弃用?", - p2: "

隐式授权流程(response_type=token)最初是为单页应用设计的一种捷径,直接在 URL 片段中返回访问令牌。这带来了严重问题:URL 中的令牌会出现在浏览器历史记录、服务器日志和 referrer 头中,并且该流程容易受到令牌注入攻击。OAuth 2.0 安全最佳实践(RFC 9700)和 OAuth 2.1 已明确移除隐式授权流程,转而推荐使用授权码 + PKCE 方案,单页应用可以在无需客户端密钥的情况下安全使用该方案。

", - heading3: "OAuth 2.1 的主要变化", - p3: "", - heading4: "授权码流程分步详解", - p4: "
  1. 生成 PKCE 对:创建一个随机的 code_verifier,并计算 code_challenge = BASE64URL(SHA256(code_verifier))。
  2. 重定向到授权端点:包含 response_type=code、client_id、redirect_uri、scope、state、code_challenge 和 code_challenge_method=S256。
  3. 用户在授权服务器进行身份验证并授予同意。
  4. 在您的 redirect_uri 处接收授权码,同时收到回传的 state——请验证 state 与您发送的值一致。
  5. 用授权码换取令牌:向令牌端点发送 POST 请求,包含 grant_type=authorization_code、code、redirect_uri、client_id 和 code_verifier。
  6. 接收访问令牌(以及可选的 id_token 和 refresh_token),并使用它们调用 API。
", - }, }, "ladder-game": { name: "梯子游戏", diff --git a/src/i18n/zh-TW.js b/src/i18n/zh-TW.js index 98dfd64..5726699 100644 --- a/src/i18n/zh-TW.js +++ b/src/i18n/zh-TW.js @@ -90,16 +90,6 @@ export default { text7: "✓ 已複製", tpl8: "最大深度", }, - edu: { - heading1: "什麼是JSON?", - p1: "

JSON(JavaScript物件表示法)是一種輕量級資料交換格式,易於人類讀寫,也易於機器解析和產生。它基於JavaScript程式語言標準的子集。JSON是一種完全獨立於語言的文字格式,但使用了C系列語言程式設計師熟悉的慣例。

這些特性使JSON成為Web應用程式、API和配置文件的理想資料交換語言。由於其更小的體積和更好的效能,它已成為Web資料交換的事實標準,很大程度上取代了XML。

", - heading2: "如何使用此工具", - p2: "
  1. 將原始或混亂的JSON資料貼上到左側的輸入JSON編輯器中。
  2. 點擊格式化按鈕,使用適當的縮排和語法突顯美化程式碼。
  3. 或者,使用最小化按鈕刪除所有空白字元以供生產使用。
  4. 檢查狀態指示器以確保您的JSON有效;如果有錯誤,工具將突顯顯示確切的行。
  5. 點擊複製將格式化結果儲存到剪貼簿,或點擊清除重新開始。
", - heading3: "常見使用情境", - p3: "", - heading4: "專業技巧", - p4: "", - }, }, "jwt-decoder": { name: "JWT 檢查器", @@ -139,22 +129,6 @@ export default { status5: "演算法:", status6: "解碼失敗", }, - edu: { - heading1: "什麼是 JWT?", - p1: "

JSON Web Token(JWT)是一種開放標準(RFC 7519),定義了一種簡潔且獨立的方式,以 JSON 物件的形式在各方之間安全地傳輸資訊。由於這些資訊經過數位簽章,因此可以被驗證與信任。JWT 可以使用密鑰(採用 HMAC 演算法)簽署,也可以使用 RSA 或 ECDSA 的公鑰/私鑰組合簽署。

由於體積精簡,JWT 常用於身份驗證與資訊交換場景,例如 HTTP Authorization 標頭中的 Bearer 權杖。

", - heading2: "如何使用此工具", - p2: "
  1. 貼上您的權杖:複製編碼後的 JWT(header.payload.signature)並貼到輸入欄位中。
  2. 自動解碼:工具會自動偵測權杖並即時解碼其組成部分。
  3. 檢視標頭:在「標頭」區段查看演算法(alg)與權杖類型(typ)。
  4. 分析酬載:在「酬載」區段檢查宣告內容,例如到期時間(exp)、簽發者(iss)與主體(sub)。
  5. 驗證宣告:查看「宣告分析」方塊以取得易讀日期與驗證狀態。
", - heading3: "常見使用情境", - p3: "", - heading4: "專業提示", - p4: "", - heading5: "權杖結構(header.payload.signature)", - p5: "

JWT 通常由三個以點分隔的部分組成:

", - heading6: "安全考量", - p6: "

雖然 JWT 經過簽章以確保完整性,但通常並未加密。這表示任何持有權杖的人都能解碼標頭與酬載以讀取其中的資訊。切勿在 JWT 酬載中儲存密碼或私鑰等敏感資訊。

此外,務必驗證 exp(到期時間)宣告以防止重放攻擊,並確保伺服器在信任酬載資料之前先驗證簽章。

", - heading7: "專業提示", - p7: "", - }, cheatsheet: { title: "JWT 快速參考", h0: "結構", @@ -193,16 +167,6 @@ export default { text0: "✓ 已複製!", tpl1: "GUID:", }, - edu: { - heading1: "什麼是 UUID?", - p1: "通用唯一識別碼(UUID)是一個 128 位元的數字,用於在電腦系統中唯一識別資訊。它們的設計目的是能夠在沒有中央權威機構的情況下獨立產生,同時將碰撞機率降到微乎其微。", - heading2: "如何使用此工具", - p2: "選擇 UUID 版本(v1 為基於時間、v4 為隨機)以及所需的識別碼數量。點選「產生」即可建立一份唯一識別碼清單,可直接用於您的資料庫或應用程式。", - heading3: "常見使用情境", - p3: "分散式資料庫中的主鍵、工作階段識別碼、交易追蹤,以及在多個系統中需要跨系統唯一性的暫存檔案或資源命名。", - heading4: "專業提示", - p4: "UUID v4 是通用唯一識別碼最常見的選擇,因為它依賴高品質的隨機性。若需要依建立時間排序識別碼,則可使用 v1。", - }, }, "password-generator": { name: "密碼產生器", @@ -265,24 +229,6 @@ export default { status6: "弱", text1: "請輸入有效的基礎電子郵件地址。", }, - edu: { - heading1: "什麼樣的密碼才是安全的?", - p1: "

安全的密碼是抵禦未授權存取的第一道防線。在高速運算的現代,安全性由熵來定義——字串隨機性和不可預測性的度量。強密碼應該足夠長(至少16個字元),在每個帳戶中唯一,並由多種字元類型組成,包括大寫字母、小寫字母、數字和符號。

避免使用生日、寵物名或常見字典詞彙等個人資訊。即使是像P@ssw0rd123這樣看起來複雜的替換,也很容易被使用大量常見模式詞典的現代暴力破解工具破解。

", - heading2: "如何使用此工具", - p2: "
  1. 選擇模式:根據需求選擇密碼、使用者名稱、密碼短語或郵件別名。
  2. 調整長度:使用滑桿設定所需長度。對於密碼,建議16個字元以上以獲得高安全性。
  3. 配置選項:切換字元集(符號、數字等)或樣式(可讀性 vs 安全性)。
  4. 產生:點擊產生按鈕建立您的唯一憑證。
  5. 複製:使用複製圖示將結果安全地移動到剪貼簿或密碼管理員。
", - heading3: "常見使用情境", - p3: "", - heading4: "專業技巧", - p4: "", - heading5: "什麼樣的密碼才是安全的?", - p5: "

安全的密碼是抵禦未授權存取的第一道防線。在高速運算的現代,安全性由熵來定義——字串隨機性和不可預測性的度量。強密碼應該足夠長(至少16個字元),在每個帳戶中唯一,並由多種字元類型組成,包括大寫字母、小寫字母、數字和符號。

避免使用生日、寵物名或常見字典詞彙等個人資訊。即使是像P@ssw0rd123這樣看起來複雜的替換,也很容易被使用大量常見模式詞典的現代暴力破解工具破解。

", - heading6: "熵的解釋", - p6: "

熵是密碼隨機性和不可預測性的度量,通常以位元表示。熵越高,密碼越強。例如,僅使用小寫字母的10字元密碼的熵遠低於使用完整字母數字和特殊字元集的10字元密碼。

我們的產生器即時計算熵,為您提供密碼強度的客觀衡量標準。超過100位元熵的密碼被認為是異常強大的,能抵禦現代破解技術。

", - heading7: "最佳實踐", - p7: "", - heading8: "專業技巧", - p8: "", - }, }, "hash-calculator": { name: "雜湊計算器", @@ -350,16 +296,6 @@ export default { tpl4: "等待輸入...", text2: "計算結果:", }, - edu: { - heading1: "什麼是雜湊運算?", - p1: "

密碼學雜湊是一種數學運算,能將任何輸入資料(文字或檔案)轉換為固定長度的字元字串,通常以十六進位數字表示。這個「指紋」對輸入資料具有唯一性;即使原始資料只改變一個位元,也會產生截然不同的雜湊值,這種現象稱為雪崩效應。

與加密不同,雜湊運算是一種單向函式。您無法透過雜湊值反推出原始資料。這使其非常適合用於驗證資料完整性、安全地儲存密碼(搭配加鹽使用)以及在不暴露內容的情況下識別檔案。

", - heading2: "如何使用此工具", - p2: "
  1. 選擇輸入類型:字串請選擇「文字」分頁,本機檔案請選擇「檔案」分頁。
  2. 提供輸入:將文字貼上,或將檔案拖放到工作區中。
  3. 選用 HMAC:若需要產生具金鑰的雜湊值以用於身份驗證,可在 HMAC 欄位中輸入密鑰。
  4. 檢視結果:工具會即時自動計算多種雜湊變體(SHA-256、SHA-512 等)。
  5. 驗證完整性:使用「驗證」分頁,將已知雜湊值與您的輸入進行比對,以檢查是否遭到竄改。
", - heading3: "常見使用情境", - p3: "", - heading4: "專業提示", - p4: "", - }, cheatsheet: { title: "雜湊演算法參考", h0: "演算法比較", @@ -435,16 +371,6 @@ export default { text5: "請至少使用 /", text6: "IPv6 /", }, - edu: { - heading1: "什麼是CIDR?", - heading2: "如何使用此工具", - heading3: "常見使用情境", - heading4: "專業技巧", - p1: "無類域間路由(CIDR)是一種分配IP位址和IP路由的方法。它取代了基於類別(A、B和C)的舊系統,以在位址分配中提供更多的靈活性和效率。", - p2: "輸入帶有首碼的IP位址(如192.168.1.0/24)或使用滑桿調整首碼長度。點擊「執行分析」查看網路詳情、可用主機範圍和二進位表示。", - p3: "為雲端基礎設施(VPC)規劃網路子網路、排查路由問題、計算給定首碼的主機容量,以及在CIDR和子網路遮罩之間轉換。", - p4: "請記住,在IPv4中,子網路中的第一個和最後一個位址通常為網路ID和廣播位址保留。在IPv6中,標準本地網路的子網路幾乎總是/64。", - }, cheatsheet: { title: "子網路快速參考", h0: "常見子網路", @@ -619,16 +545,6 @@ export default { tpl3: "變更預設值:", tpl4: "找不到符合搜尋條件的連接埠。", }, - edu: { - heading1: "連接埠類別與安全性指南", - p1: "知名連接埠(0-1023)由 IANA 指派,在 Unix 系統上需要 root 權限。已註冊連接埠(1024-49151)供應用程式使用。動態/暫時性連接埠(49152-65535)用於用戶端連線。了解連接埠範圍對於防火牆設定與網路安全至關重要。", - heading2: "如何使用此工具", - p2: "依連接埠號碼或服務名稱搜尋,以找出通訊協定詳情與安全風險等級。可依類別(知名、已註冊、動態)或通訊協定(TCP/UDP)篩選以縮小結果範圍。點選任一列即可查看完整詳情,包括常見漏洞與強化建議。", - heading3: "常見使用情境", - p3: "防火牆規則設定、網路故障排解、在安全稽核期間識別非預期開放的連接埠,以及快速查閱通訊協定連接埠指派。", - heading4: "專業提示", - p4: "使用風險篩選功能快速識別網路中的高風險連接埠。「前 50 大常見連接埠」區段可讓您立即概覽最常使用的服務。", - }, cheatsheet: { c2: "\n ", c1: "\n \n \n \n \n \n \n \n \n
通訊埠服務風險
21FTP未加密的檔案傳輸
23Telnet明文身分驗證
25SMTP郵件垃圾轉送風險
53DNSDDoS 放大攻擊
445SMB勒索軟體傳播
3389RDP暴力破解攻擊
", @@ -872,16 +788,6 @@ export default { text4: "警告", alert0: "請先產生設定", }, - edu: { - heading1: "關於 WireGuard", - p1: "WireGuard 是一種現代化、高效能的 VPN 通訊協定,採用最先進的密碼學技術。其設計目標是比 OpenVPN 和 IPsec 等舊有通訊協定更簡潔、更快速,並因程式碼庫精簡而大幅縮小攻擊面。WireGuard 目前已納入 Linux 核心,並在 Windows、macOS、iOS 與 Android 上原生支援。", - heading2: "如何使用此工具", - p2: "選擇拓撲範本(點對點、軸輻式、站點對站點或行動用戶)以預先填入設定。點選「產生金鑰」即可在瀏覽器中於本機建立新的金鑰組。填寫必要欄位後點選「產生設定」以產出 WireGuard 設定檔。可使用「下載 .conf」儲存檔案,或使用「產生 QR 碼」建立供行動裝置匯入的 QR 碼。", - heading3: "常見使用情境", - p3: "供員工連接公司網路的遠端存取 VPN。連接分公司網路的站點對站點 VPN。用於在公用 Wi-Fi 上安全瀏覽的個人 VPN 伺服器。用於嵌入式裝置間安全通訊的 IoT 裝置通道。", - heading4: "專業提示", - p4: "在 NAT 後方的用戶端上使用 PersistentKeepalive = 25,可在沒有流量時仍維持通道連線。PresharedKey 會加上一層額外的對稱式加密,以提升抗量子運算能力。AllowedIPs = 0.0.0.0/0 會將所有流量透過通道路由(完整通道),而指定特定的 CIDR 則會建立分割通道。", - }, cheatsheet: { title: "WireGuard 快速參考", h0: "介面欄位", @@ -1025,14 +931,6 @@ export default { tpl6: "範例:", tpl7: "點選圖表中的任一欄位以查看詳細資訊。", }, - edu: { - heading1: "什麼是通訊協定標頭?", - p1: "通訊協定標頭是位於網路封包酬載之前的結構化資料,包含來源與目的位址、通訊協定類型、序號與校驗和等控制資訊。了解標頭結構對於網路除錯、封包分析與通訊協定實作至關重要。", - heading2: "如何使用此工具", - p2: "從分頁中選擇通訊協定以檢視其標頭結構。每個彩色區塊代表一個欄位,並標示其大小。點選任一欄位即可查看詳細資訊,包括欄位名稱與說明、位元/位元組偏移量、常見值及其意義,以及 RFC 參考文件。可使用十六進位傾印解析器,貼上 tcpdump 或 Wireshark 等工具輸出的十六進位內容以分析實際封包擷取結果。", - heading3: "常見使用情境", - p3: "透過封包分析了解擷取的網路流量結構、作為視覺化輔助工具學習網路通訊協定、透過除錯識別格式錯誤的標頭或不正確的欄位值,以及在實作網路通訊協定時作為開發參考。", - }, cheatsheet: { c3: "\n \n \n \n \n \n \n
值協定
0x0800IPv4
0x0806ARP
0x86DDIPv6
0x8100VLAN (802.1Q)
", c2: "\n \n \n \n \n \n \n \n \n \n
欄位大小說明
Source Port2 位元組來源通訊埠號
Dest Port2 位元組目的通訊埠號
Seq Number4 位元組序號
Ack Number4 位元組確認號
Data Offset4 位元標頭長度 / 4
Flags9 位元NS,CWR,ECE,URG,ACK,PSH,RST,SYN,FIN
Window2 位元組接收視窗大小
", @@ -1108,16 +1006,6 @@ export default { tpl0: "差異", tpl1: "未發現差異(或輸入為空)", }, - edu: { - heading1: "什麼是文字比對(Diff)?", - p1: "文字比對是比較兩組資料序列以找出其差異的過程,它能標示出新增、刪除或修改的內容。這是軟體開發、資料分析與內容管理中的基本操作,能協助使用者追蹤隨時間發生的變更,或比較文件的不同版本。", - heading2: "差異演算法", - p2: "大多數文字比對工具採用基於最長共同子序列(LCS)問題的演算法,目標是找出以相同相對順序出現在兩段文字中的最長元素序列。常見實作包括 Git 所使用、效率極高的 Myers diff 演算法,以及 Hunt-McIlroy 演算法。這些演算法會計算將一段文字轉換為另一段文字所需的最少編輯次數。", - heading3: "使用情境", - p3: "程式碼審查,讓開發者能準確看到提取請求(pull request)中的變更內容。像 Git 這類版本控制系統會將歷史記錄儲存為一連串差異以節省空間。內容稽核,讓寫作者與編輯者比對草稿以確保所有要求的修改都已完成。資料驗證,用於比較設定檔或資料庫匯出內容以找出差異。", - heading4: "專業提示", - p4: "許多比對工具都提供忽略縮排或行尾空白變更的選項,可在比較程式碼時減少雜訊干擾。在差異周圍保留幾行未變更的文字(上下文行),有助於了解變更帶來的影響。對於散文與自然語言文件,逐字比對通常更為實用,而逐行比對則是程式碼的標準做法。", - }, }, "regex-visualizer": { name: "正規表示式視覺化工具", @@ -1168,16 +1056,6 @@ export default { tpl5: "無群組", tpl6: "正規表示式無效", }, - edu: { - heading1: "什麼是正規表示式?", - p1: "正規表示式(regex)是用於比對字串中字元組合的強大模式,是各種程式語言中文字處理、驗證與資料擷取不可或缺的工具。正規表示式模式由字面字元與定義搜尋規則的特殊詮釋字元組成,廣泛應用於表單驗證、記錄檔解析、搜尋取代操作與資料清理工作。", - heading2: "如何使用此工具", - p2: "在輸入欄位中輸入您的正規表示式模式,工具會自動產生鐵路圖以視覺化模式結構。加入測試文字即可即時查看符合項目的醒目提示與說明。可使用速查表快速查閱常見模式與語法,並為您偏好的程式語言產生程式碼片段。", - heading3: "常見使用情境", - p3: "電子郵件驗證,確保使用者輸入符合正確的電子郵件格式後再進行處理;記錄檔解析,從伺服器記錄中擷取時間戳記與 IP 位址;資料清理,移除不需要的字元或統一格式化電話號碼;以及搜尋取代,透過模式比對進行大量文字轉換。", - heading4: "專業提示", - p4: "從簡單模式開始,逐步建構複雜模式。若不需要參照符合結果,請使用非擷取群組 (?:)。務必測試邊界情況,例如空字串與特殊字元。也請考慮正規表示式的可讀性——複雜的模式可以搭配註解說明。", - }, cheatsheet: { title: "正規表示式快速參考", h0: "字元類別", @@ -1323,16 +1201,6 @@ export default { text1: "複製", tpl2: "mkdir -p ~/.ssh && chmod 700 ~/.ssh\necho \\\"PUBLIC_KEY\\\" >> ~/.ssh/authorized_keys\nchmod 600 ~/.ssh/authorized_keys", }, - edu: { - heading1: "關於 SSH 金鑰", - p1: "SSH 金鑰是一組用於安全登入遠端系統的密碼學金鑰組。私鑰保留在您的機器上,公鑰則放置於伺服器上。這種非對稱式方法遠比密碼驗證更安全,是伺服器存取、Git 代管與自動化部署的業界標準。", - heading2: "如何使用此工具", - p2: "選擇您偏好的金鑰類型(RSA 或 ECDSA),若選擇 RSA 則需選擇金鑰長度。可加入選填的註解以識別金鑰(通常為 user@host)。點選「產生」以建立金鑰組。將公鑰複製並加入您的伺服器,並將私鑰安全地保存於本機。", - heading3: "常見使用情境", - p3: "供伺服器驗證使用,實現免密碼 SSH 登入遠端伺服器。供 Git 代管使用,免密碼驗證 GitHub、GitLab 或 Bitbucket。供 CI/CD 流程使用,讓需要連線伺服器的自動化部署腳本得以運作。供堡壘主機存取使用,實現安全的跳板主機設定。", - heading4: "專業提示", - p4: "建議新部署採用 Ed25519 金鑰——比 RSA 更快速也更安全。務必以強式密碼短語保護您的私鑰。可使用 ssh-agent 避免在同一工作階段中重複輸入密碼短語。將金鑰儲存於 ~/.ssh/ 並將權限設定為 600。", - }, cheatsheet: { title: "SSH 金鑰快速參考", h0: "金鑰類型", @@ -1372,16 +1240,6 @@ export default { tpl2: "無主體別名。", tpl3: "未解析出任何擴充功能。", }, - edu: { - heading1: "什麼是 X.509 憑證?", - heading2: "如何使用此工具", - heading3: "常見使用情境", - heading4: "專業提示", - p1: "

X.509 是公鑰憑證的標準格式,這種數位文件能安全地將公鑰與某個身份(例如網站、組織或個人)綁定在一起。這類憑證是公開金鑰基礎設施(PKI)的基礎,用於透過 HTTPS 保護網際網路安全,也用於簽署電子郵件與軟體。

X.509 憑證包含公鑰、憑證持有者的身份,以及簽發該憑證的憑證授權機構(CA)的數位簽章,用以證明其真實性。

", - p2: "
  1. 貼上您的憑證:複製 PEM 編碼的憑證(包含 BEGIN 與 END 標頭)並貼到輸入欄位中。
  2. 解析:點選「解析憑證」以擷取並分析資料。
  3. 檢視摘要:查看上方卡片中的通用名稱(CN)、簽發者與有效日期。
  4. 檢視詳細資訊:展開下方區段以查看完整的主體、簽發者、SAN 與技術性擴充功能。
  5. 檢查狀態:查看狀態徽章以確認憑證目前是否有效或已過期。
", - p3: "", - p4: "", - }, cheatsheet: { title: "X.509 憑證參考", h0: "憑證欄位", @@ -1424,16 +1282,6 @@ export default { text1: "複製 JSON", text2: "複製 XML", }, - edu: { - heading1: "什麼是 SAML?", - p1: "安全宣告標記語言(SAML)是一種以 XML 為基礎的開放標準,用於在各方之間交換身份驗證與授權資料,特別是在身份提供者(IdP)與服務提供者(SP)之間。SAML 是許多企業級單一登入(SSO)解決方案的核心,讓使用者能以單一組憑證存取多個應用程式。最常見的版本為 SAML 2.0,透過包含宣告的安全權杖,在 IdP 與 SP 之間傳遞關於主體的資訊。", - heading2: "如何使用此工具", - p2: "將 Base64 編碼的 SAMLResponse 或原始 XML 貼到輸入欄位中。若解碼的是 Redirect 綁定的酬載,請切換「嘗試解壓縮」選項。點選「解碼回應」以解析訊息。查看「快速摘要」了解簽發者、主體與有效狀態。在「屬性」表格中檢視解碼後的使用者屬性。可使用分頁切換查看美化後的 XML、宣告詳細資訊,或宣告內容的 JSON 表示形式。", - heading3: "常見使用情境", - p3: "透過檢查過期宣告或受眾不符來診斷使用者無法登入的 SSO 故障排解問題。整合測試,驗證您的身份提供者是否傳送正確的屬性。安全稽核,檢查原始 XML 以確保宣告已正確簽署。開發時,在服務提供者整合期間快速檢視 SAML 訊息的內容。", - heading4: "專業提示", - p4: "透過 HTTP-Redirect 傳送的 SAML 訊息通常會先經過 deflate 壓縮再進行 Base64 編碼——若解碼失敗,請嘗試切換「嘗試解壓縮」核取方塊。請確保 AudienceRestriction 與您的 SP 實體 ID 相符。若回應被標示為無效,請檢查 NotBefore 與 NotOnOrAfter 時間,確認 IdP 與 SP 時鐘之間是否存在時間偏差。", - }, cheatsheet: { title: "SAML 快速參考", h0: "SAML 流程", @@ -1476,16 +1324,6 @@ export default { alert1: "請輸入 User-Agent 字串", tpl2: "原始分析輸出", }, - edu: { - heading1: "什麼是 User-Agent?", - p1: "User-Agent 是您的瀏覽器在每次造訪網站時傳送的字串,能識別瀏覽器版本、作業系統與裝置類型,讓伺服器能針對您的特定環境最佳化內容。", - heading2: "如何使用此工具", - p2: "在輸入框中貼上 User-Agent 字串,或點選「使用此值」以分析您目前的瀏覽器字串。此工具會拆解出瀏覽器引擎、作業系統版本與裝置特性。", - heading3: "常見使用情境", - p3: "除錯網站相容性問題、分析網頁伺服器記錄以識別機器人流量、驗證瀏覽器偽裝,以及了解受眾的裝置分佈情況。", - heading4: "專業提示", - p4: "許多現代瀏覽器會凍結或簡化其 User-Agent 字串以防止指紋追蹤。請務必查看 Version 或 Chrome 標記以取得最準確的版本資訊。", - }, }, "qr-code": { name: "QR 碼產生器", @@ -1524,16 +1362,6 @@ export default { alert3: "已複製!", tpl4: "上傳圖片以進行解碼", }, - edu: { - heading1: "什麼是 QR 碼?", - p1: "QR 碼(Quick Response,快速回應碼)是一種二維條碼,可儲存各種類型的資料,最常見的是網址。可透過智慧型手機與專用讀取器掃描,快速存取資訊或觸發動作。", - heading2: "如何使用此工具", - p2: "輸入您要編碼的文字或網址,並視需要調整大小與容錯等級。QR 碼會即時更新,可下載為圖片供列印或數位用途使用。", - heading3: "常見使用情境", - p3: "分享網站連結、提供 Wi-Fi 憑證、數位名片(vCard)、活動票務,以及行動支付或身份驗證流程。", - heading4: "專業提示", - p4: "較高的容錯等級(H 或 Q)可讓 QR 碼即使部分損壞或遮蔽仍可掃描,非常適合用於實體標示或品牌行銷。", - }, }, "timestamp-converter": { name: "時間戳記轉換器", @@ -1564,16 +1392,6 @@ export default { text0: "時間戳記無效", tpl1: "Unix(毫秒)", }, - edu: { - heading1: "什麼是Unix時間?", - p1: "Unix時間(也稱為Epoch時間、POSIX時間或Unix時間戳記)是一種描述時間點的系統。它是自Unix紀元以來經過的秒數(減去閏秒);Unix紀元是1970年1月1日00:00:00 UTC。它在作業系統和檔案格式中被廣泛使用,因為它是一個單一整數,便於電腦儲存和操作。這個標準使不同系統能夠準確地通訊時間,而無需考慮其本地時區設定。", - heading2: "如何使用此工具", - p2: "將Unix轉換為人類可讀格式:在Unix時間戳記欄位中輸入時間戳記,並選擇它是秒還是毫秒。將人類可讀格式轉換為Unix:使用選擇器選擇日期和時間,然後選擇所需時區。使用「現在」按鈕快速取得目前時間戳記。即時檢視結果,包括ISO 8601、本地時間、UTC和相對時間。點擊任何結果旁邊的複製按鈕將其儲存到剪貼簿。", - heading3: "常見使用情境", - p3: "日誌分析,將伺服器日誌或資料庫條目中的神秘時間戳記轉換為可讀日期以進行偵錯。API開發,驗證您的後端是否傳送了正確的紀元值。資料遷移,確保在系統間移動時基於時間的資料保持一致。排程,為cron工作、到期日期或事件觸發器計算未來或過去的時間戳記。", - heading4: "專業技巧", - p4: "使用JavaScript時,請記住Date.now()回傳毫秒,而標準Unix時間戳記以秒為單位——除以1000進行轉換。始終使用ISO 8601格式在系統間交換資料以確保最大相容性。注意2038年問題,32位元有號整數將溢位;現代系統使用64位元整數,在可預見的未來解決了這個問題。", - }, }, "color-converter": { name: "顏色轉換器", @@ -1589,16 +1407,6 @@ export default { badge7: "純用戶端運行", badge8: "隱私優先", }, - edu: { - heading1: "色彩模型詳解(HEX/RGB/HSL)", - heading2: "如何使用此工具", - heading3: "常見使用情境", - heading4: "專業技巧", - p1: "

色彩模型是表示顏色的數學系統。HEX(十六進位)是HTML和CSS中使用的6位代碼,表示紅、綠、藍三個分量。RGB(紅、綠、藍)在數位成像中常用,每個通道使用0到255的十進位值。

HSL(色相、飽和度、亮度)對人類更直覺,因為它以基本顏色(色相)、強度(飽和度)和亮度來描述顏色。了解這些模型有助於為您的設計和開發需求選擇正確的格式,確保在不同平台和裝置之間保持一致性。

", - p2: "
  1. 在飽和度/亮度方塊中拖動游標並使用色相滑桿,透過視覺化色彩選擇器選擇顏色。
  2. 或者,在「手動輸入」欄位中輸入特定值(支援#hex、rgb或hsl格式)。
  3. 觀察「預覽」方塊以即時查看所選顏色。
  4. 在下方的HEX、RGB、HSL和HSV卡片中查看轉換後的值。
  5. 點擊任意卡片上的「複製」圖示將該特定格式儲存到剪貼簿。
", - p3: "", - p4: "", - }, }, "unit-converter": { name: "單位轉換器", @@ -1616,16 +1424,6 @@ export default { text0: "選擇單位以查看換算公式", text1: "請輸入有效數字", }, - edu: { - heading1: "測量系統概述", - p1: "測量系統是測量單位的集合及其相互關係的規則。兩個最常見的系統是公制(國際單位制或SI)和英制系統。公制基於十的冪次,非常合乎邏輯且易於擴展。主要在美國使用的英制系統使用英寸、英尺和磅等單位,具有歷史起源和不太統一的換算係數。理解這些系統之間的差異對於科學、工程、國際貿易以及烹飪或旅行等日常工作至關重要。", - heading2: "如何使用此工具", - p2: "從頂部的格線中選擇測量類別(如長度、重量、溫度)。在「從」下拉選單中選擇要轉換的單位。在輸入欄位中輸入要轉換的值。在「到」下拉選單中選擇目標單位。轉換後的值將立即顯示,並附有用於轉換的數學公式。", - heading3: "常見使用情境", - p3: "旅行時將公里換算為英里或將攝氏度換算為華氏度。烹飪時在公制(克/毫升)和英制(盎司/杯)測量之間轉換食譜。工程和科學中不同壓力、能量或速度單位之間的精確換算。數位儲存,了解百萬位元組、千兆位元組和太位元組之間的差異。", - heading4: "專業技巧", - p4: "使用交換按鈕快速反轉所選單位之間的換算方向。始終仔細檢查特定的單位類型,特別是對於體積和重量,因為名稱在不同系統中可能類似,例如美制加侖與英制加侖。在連續執行多次換算時,在最終結果之前保留盡可能多的小數位,以避免累積捨入誤差。", - }, }, "yaml-toml-converter": { name: "YAML/TOML 轉換器", @@ -1659,16 +1457,6 @@ export default { text6: "⚠️ TOML 轉換失敗:", tpl7: "等待轉換。", }, - edu: { - heading1: "YAML、TOML 與 JSON 比較", - p1: "JSON 因其簡潔性與 JavaScript 原生支援,成為資料交換最廣泛使用的格式。YAML(YAML Ain't Markup Language)是一種對人類友善的資料序列化標準,以縮排表示結構,常用於複雜的設定檔。TOML(Tom's Obvious, Minimal Language)的語意明確,設計上易於閱讀與編寫,常用於專案設定。JSON 嚴謹且精簡,而 YAML 與 TOML 則優先考量人類可讀性與手動編輯的便利性。", - heading2: "如何使用此工具", - p2: "將您的設定資料(JSON、YAML 或 TOML)貼到左側的來源文字區域,工具會自動偵測來源格式,您也可以從下拉選單中手動選擇。點選「僅驗證」可在不進行轉換的情況下檢查語法錯誤。點選任一轉換按鈕(轉為 JSON、轉為 YAML、轉為 TOML)即可將您的資料轉換為該格式。在右側的輸出面板中檢視結果,並點選「複製」將其儲存到剪貼簿。", - heading3: "常見使用情境", - p3: "基礎架構即程式碼,在處理 Kubernetes 資訊清單、Docker Compose 檔案或 AWS CloudFormation 範本時於 JSON 與 YAML 之間轉換。專案設定,在 package.json(JSON)與 pyproject.toml 或 Cargo.toml(TOML)之間遷移設定。API 原型設計,快速視覺化複雜資料結構在不同格式下的呈現方式。舊系統遷移,在確保資料完整性的同時將舊有設定檔轉換為現代格式。", - heading4: "專業提示", - p4: "在 CI/CD 流程中建議使用 YAML,因為複雜巢狀結構的可讀性對於可維護性至關重要。應用程式層級的設定檔則建議使用 TOML,為可能需要手動編輯的終端使用者提供簡潔的介面。從 YAML 轉換為 JSON 時,請留意 YAML 的型別強制轉換問題(例如 NO 可能被解讀為 false),並確保您的資料型別能正確保留。", - }, cheatsheet: { title: "格式比較", h0: "語法差異", @@ -1719,16 +1507,6 @@ export default { text1: "複製", text2: "已複製!", }, - edu: { - heading1: "什麼是 htpasswd?", - p1: "

htpasswd 檔案是一種純文字資料庫,用於儲存 Apache 與 Nginx 網頁伺服器基本身份驗證所需的使用者名稱與雜湊密碼。這是一種簡單但有效的方式,能在無需完整資料庫身份驗證系統的情況下,保護網站上特定的目錄或管理面板。

htpasswd 檔案中的每一行代表一位使用者,格式為 username:hashed_password。

", - heading2: "如何使用此工具", - p2: "
  1. 輸入使用者名稱:輸入您要用於身份驗證的使用者名稱。
  2. 提供密碼:輸入密碼,或點選「產生高強度密碼」以建立一組安全的密碼。
  3. 選擇演算法:選擇 Bcrypt(-B)以取得現代安全性,或選擇 Apache MD5(-m)以相容舊系統。
  4. 產生:點選「產生項目」以建立雜湊字串。
  5. 複製或下載:將產生的內容複製到剪貼簿,或下載為檔案上傳至您的伺服器。
", - heading3: "常見使用情境", - p3: "", - heading4: "專業提示", - p4: "", - }, }, "mock-data-generator": { name: "模擬資料產生器", @@ -1762,16 +1540,6 @@ export default { text1: "複製", text2: "沒有可預覽的資料列。", }, - edu: { - heading1: "什麼是模擬資料?", - p1: "

模擬資料是合成資訊,它模仿真實世界的資料,而不包含任何敏感或個人可識別資訊(PII)。對於需要真實資料集來構建和驗證應用程式的開發人員和測試人員來說,它是必不可少的,無需冒資料洩露風險或違反GDPR或CCPA等隱私法規。透過使用模擬資料,您可以模擬各種情境,從標準使用者設定檔到邊緣案例,確保您的軟體能夠優雅地處理所有類型的輸入。

", - heading2: "測試策略", - p2: "

有效的測試需要多樣化的資料集。使用模擬資料為開發資料庫提供種子資料、用數千條記錄執行負載測試,或驗證不同字串長度的UI版面配置。它對於需要來自外部API的可預測回應的整合測試特別有用。透過在本地產生資料,您可以建立易於重置和複現的一致測試環境,從而實現更可靠和更快速的開發週期。

", - heading3: "模擬中的資料隱私", - p3: "

隱私是現代軟體開發的首要任務。在開發或測試環境中使用真實生產資料是重大安全風險。模擬資料產生器透過產生假但結構正確的資料來解決這個問題。我們的工具完全在您的瀏覽器中執行,這意味著您的配置和產生的資料永遠不會離開您的裝置。這種隱私優先的方法確保即使建立模擬資料的過程也是安全的,並符合最嚴格的安全標準。

", - heading4: "專業技巧", - p4: "", - }, cheatsheet: { title: "模擬資料欄位類型", h0: "可用類型", @@ -1870,16 +1638,6 @@ export default { js: { tpl0: "aLtErNaTiNg:", }, - edu: { - heading1: "命名慣例解析(camelCase/snake_case 等)", - heading2: "如何使用此工具", - heading3: "常見使用情境", - heading4: "專業提示", - p1: "

命名慣例是一組規則,用於決定原始碼與文件中變數、型別、函式及其他實體識別碼所使用的字元序列。camelCase(例如 myVariable)以小寫字母開頭,並將後續每個單字的首字母大寫。snake_case(例如 my_variable)則使用底線分隔單字。

PascalCase(例如 MyVariable)將每個單字的首字母都大寫,而 kebab-case(例如 my-variable)則使用連字號分隔單字。這些慣例不僅關乎美觀,更攸關程式碼的可讀性、可維護性,以及是否符合不同程式語言與框架的慣用標準。

", - p2: "
  1. 在頁面頂端的「輸入文字」區域輸入或貼上您的文字。
  2. 工具會即時自動將您的輸入轉換為十多種不同的大小寫樣式。
  3. 捲動「轉換結果」網格以找到您需要的特定樣式。
  4. 點選任一結果旁的「複製」圖示,將其儲存到剪貼簿。
  5. 使用「清除」按鈕移除所有輸入內容,開始新的轉換。
", - p3: "", - p4: "", - }, }, "code-minifier": { name: "程式碼壓縮工具", @@ -1913,16 +1671,6 @@ export default { text2: "📋 複製", tpl3: "所有處理均在您的瀏覽器中進行。您的程式碼會在本機處理,不會傳送到我們的伺服器。", }, - edu: { - heading1: "什麼是壓縮(Minification)?", - heading2: "如何使用此工具", - heading3: "常見使用情境", - heading4: "專業提示", - p1: "

壓縮(Minification)是在不改變功能的情況下,移除原始碼中所有不必要字元的過程,包括移除空白、換行、註解,有時還會縮短變數名稱。目標是縮小程式碼的檔案大小,進而減少透過網路傳輸所需的資料量。

這能加快網頁載入速度,並提升網頁應用程式的效能。雖然壓縮對正式環境至關重要,但它會讓程式碼幾乎無法被人類閱讀與除錯。因此,壓縮通常是在部署到正式伺服器前建置流程中的最後一個步驟。

", - p2: "
  1. 從頂端分頁選擇程式語言(JavaScript、CSS、HTML 或 JSON)。
  2. 將您的原始碼貼到左側的「輸入程式碼」文字區域。
  3. 點選「壓縮程式碼」按鈕以縮小檔案大小,供正式環境使用。
  4. 或者,點選「美化程式碼」以加入縮排與格式化,提升可讀性。
  5. 在「輸出程式碼」區域檢視結果,並點選「複製」或「下載」以儲存您優化後的程式碼。
", - p3: "", - p4: "", - }, }, "image-converter": { name: "圖片轉換器", @@ -1969,16 +1717,6 @@ export default { alert2: "讀取檔案時發生錯誤。", tpl3: "採用 Canvas API 進行用戶端處理——無需上傳,即時取得結果", }, - edu: { - heading1: "圖片格式比較(PNG/JPEG/WebP)", - p1: "

選擇正確的圖片格式對於網頁效能與視覺品質至關重要。JPEG 最適合用於相片與色彩豐富的複雜圖片,因其採用破壞性壓縮以達到較小的檔案大小。PNG 則適合需要透明度或含有銳利邊緣與純色的圖片(如標誌與圖示),因其採用無損壓縮。

WebP 是一種現代格式,能提供更優異的破壞性與無損壓縮,通常能在維持高品質的同時,產生比 JPEG 或 PNG 小得多的檔案。

", - heading2: "如何使用此工具", - p2: "
  1. 將圖片拖曳至「上傳圖片」區域,或點選以瀏覽您的檔案。
  2. 從「轉換格式」選項中選擇您想要的輸出格式(PNG、JPG 或 WebP)。
  3. 若您選擇了 JPG 或 WebP 等破壞性格式,可使用品質滑桿在檔案大小與視覺保真度之間取得平衡。
  4. 您也可以選擇使用「調整圖片大小」設定,依百分比或指定尺寸縮放圖片。
  5. 點選「轉換並調整圖片大小」,接著點選「下載」以儲存您優化後的檔案。
", - heading3: "常見使用情境", - p3: "", - heading4: "專業提示", - p4: "", - }, }, "css-gradient": { name: "CSS 漸層產生器", @@ -2018,16 +1756,6 @@ export default { alert2: "複製 CSS 到剪貼簿失敗", tpl3: "載入畫面與覆蓋層", }, - edu: { - heading1: "什麼是 CSS 漸層?", - heading2: "線性、放射狀與錐形漸層比較", - heading3: "瀏覽器支援與效能", - heading4: "打造更佳漸層的專業提示", - p1: "

CSS 漸層是一項強大的功能,能讓您在兩種或多種指定顏色之間顯示平滑過渡效果。與傳統的背景圖片不同,漸層是由瀏覽器產生的,這表示它們可以無限縮放、消耗較少頻寬,也能輕鬆透過程式碼調整。漸層常用於背景、按鈕與裝飾元素,為網頁設計增添深度與視覺趣味。

", - p2: "

CSS 漸層主要有三種類型:

", - p3: "

現代 CSS 漸層已獲得包括 Chrome、Firefox、Safari 與 Edge 在內的所有主流瀏覽器廣泛支援。由於它們是由瀏覽器引擎以數學方式算繪的,相較於高解析度圖片,效能極為優異。不過,對於擁有數十個色彩停駐點的極複雜漸層,最好仍在低階裝置上測試效能。對於較舊的瀏覽器(如 IE9 及以下版本),建議提供純色作為備援方案。

", - p4: "", - }, }, "curl-studio": { name: "cURL 工作室", @@ -2096,16 +1824,6 @@ export default { text2: "已複製!", tpl3: "遮蔽後的記錄將顯示於此...", }, - edu: { - heading1: "什麼是個人識別資訊(PII)?", - p1: "

個人識別資訊(PII)是指任何可用於識別特定個人的資料,包括姓名、電子郵件地址、電話號碼等直接識別項,以及 IP 位址、實體位置與信用卡卡號等間接識別項。在伺服器記錄的情境中,PII 常出現於請求參數、標頭或錯誤訊息中。

保護 PII 是現代資料安全的重要環節,也是全球多項法規的強制要求。

", - heading2: "合規要求(GDPR/CCPA)", - p2: "

歐洲的一般資料保護規則(GDPR)與美國加州消費者隱私法(CCPA)等法規,對個人資料的處理方式訂有嚴格規範,要求組織實施隱私設計原則,並將個人資料的蒐集與儲存降至最低。

將含有 PII 的原始記錄分享給第三方支援團隊或開發人員,可能導致違反法規。在資料離開您的安全環境之前先進行遮蔽或編修,是維持法規遵循的關鍵步驟。

", - heading3: "遮蔽策略", - p3: "

處理記錄中敏感資料的方式有幾種:

本工具著重於編修,透過模式比對即時尋找並取代常見的 PII 格式。

", - heading4: "專業提示", - p4: "", - }, }, "mermaid-studio": { name: "Mermaid 工作室", @@ -2306,16 +2024,6 @@ export default { text51: "尚未擷取任何網址。", text52: "尚無路由資料。", }, - edu: { - heading1: "電子郵件身份驗證解析", - heading2: "SPF/DKIM/DMARC", - heading3: "釣魚郵件偵測", - heading4: "專業提示", - p1: "

電子郵件身份驗證是一套用於提供電子郵件來源可驗證資訊的技術集合。透過驗證寄件者身份,這些通訊協定能協助郵件伺服器區分合法郵件與偽造或詐騙郵件(如釣魚郵件)。現代電子郵件身份驗證的三大支柱是 SPF、DKIM 與 DMARC。

收到郵件時,接收伺服器會執行這些檢查,並將結果記錄在郵件標頭中,本工具會為您解析這些內容。

", - p2: "", - p3: "

釣魚郵件經常使用「偽造」手法,使郵件看似來自受信任的來源。本分析工具會尋找常見的警訊,例如「From」地址(使用者看到的內容)與「Return-Path」(郵件實際來源)之間的不一致。我們也會擷取並分析郵件內文中的網址,以識別可疑連結,例如使用 Punycode(相似仿冒網域)或以 IP 位址取代主機名稱的連結。

透過檢視「分析結果」區段,您能快速識別這些訊號,判斷該郵件是否可安全互動。

", - p4: "", - }, cheatsheet: { title: "電子郵件驗證快速參考", h0: "這些檢查項目的意義", @@ -2491,16 +2199,6 @@ export default { text9: "請先貼上 SQL。", text10: "✓ 已複製", }, - edu: { - heading1: "為什麼要格式化 SQL?", - p1: "SQL 很容易變得複雜且難以閱讀,尤其是在處理多重連接、子查詢與巢狀條件時。格式化 SQL 包括加入一致的縮排、換行以及關鍵字的大小寫統一,這能讓查詢的邏輯更容易理解,這對於除錯、程式碼審查,以及長期維護大型資料庫結構都至關重要。格式良好的查詢在手動編輯時也較不容易產生邏輯錯誤。", - heading2: "如何使用此工具", - p2: "將您的原始 SQL 查詢貼到左側的「輸入 SQL」編輯器中。選擇您的資料庫方言(Postgres 或 MySQL)與偏好的關鍵字大小寫(大寫或小寫)。點選「格式化」按鈕,以適當的縮排與間距美化您的查詢。使用「驗證」按鈕檢查常見的結構性問題,例如未關閉的引號或括號不平衡。點選「複製」將格式化後的 SQL 儲存到剪貼簿,或點選「清除」重新開始。", - heading3: "常見使用情境", - p3: "程式碼審查,在提交提取請求前格式化雜亂的 SQL。除錯,整理 ORM 產生的查詢,以準確了解對資料庫實際執行的內容。文件撰寫,為技術指南、wiki 或 README 檔案建立清楚易讀的範例。舊系統整理,快速將舊有、未格式化的腳本重構為現代易讀的風格。", - heading4: "專業提示", - p4: "使用 WITH 子句的共用資料表運算式(CTE),將複雜查詢拆解為更小、更易於管理的部分。請務必為資料表與欄位使用具描述性的別名,讓查詢意圖更加清楚。若需要將 SQL 壓縮為單行,以用於設定檔或命令列工具,可使用「壓縮」按鈕。", - }, cheatsheet: { title: "SQL 格式化提示", h0: "快速改善建議", @@ -2569,16 +2267,6 @@ export default { text15: "注意:為求安全,數值已遮蔽。差異比較採用啟發式方法,不包含註解/順序。", text16: "✓ 已複製", }, - edu: { - heading1: "環境變數最佳實務", - heading2: "機密資訊管理", - heading3: ".env 檔案安全性", - heading4: "專業提示", - p1: "

環境變數是「十二要素應用程式」(Twelve-Factor App)方法論的基本要素之一,該方法論主張將設定與程式碼嚴格分離。透過使用環境變數,您只需變更設定值,即可在不同環境(開發、測試、正式環境)中執行相同的程式碼。

最佳實務包括使用具描述性的大寫名稱(例如 DATABASE_URL)、為非關鍵設定提供預設值,以及絕不將敏感資訊直接寫入版本控制系統。

", - p2: "

機密資訊是環境變數中的特殊類別,包含 API 金鑰、資料庫密碼與私密憑證等敏感資訊。安全地管理這些資訊對防止資料外洩至關重要。正式環境應使用專用的機密資訊管理服務(如 AWS Secrets Manager、HashiCorp Vault 或 Cloudflare Secrets)。

本機開發時通常使用 .env 檔案,但絕不應將其提交到您的 git 版本庫。請務必將 *.env 加入您的 .gitignore 檔案。

", - p3: "

與團隊成員分享 .env 檔案以進行除錯時,意外洩漏正式環境機密資訊的風險很高。我們的管理工具透過「遮蔽敏感值」功能協助降低此風險,它會運用啟發式規則識別如 SECRET、TOKEN 或 PASSWORD 等鍵名,並以遮蔽後的版本取代其值(例如 ab...yz (32))。

如此一來,您就能比較環境檔案的結構與非敏感值,而不會外洩實際的機密資訊。

", - p4: "", - }, cheatsheet: { title: "Dotenv 注意事項", h0: "遮蔽策略", @@ -2638,16 +2326,6 @@ export default { text7: "尚無預覽。", text8: "✓ 已複製", }, - edu: { - heading1: "什麼是 SVG?", - p1: "SVG(可縮放向量圖形)是一種以 XML 為基礎的向量圖形格式,適用於二維圖形,並支援互動性與動畫效果。與 JPEG 或 PNG 等點陣格式不同,SVG 由數學路徑定義,這表示它們可以縮放至任意大小而不損失品質。這使其非常適合用於網頁上的標誌、圖示與插圖,從行動裝置螢幕到高解析度桌上型顯示器都能保持清晰銳利。", - heading2: "如何使用此工具", - p2: "將您的 SVG 程式碼貼到左側的「SVG 輸入」文字區域。點選「預覽」以查看圖形並擷取其色彩調色盤。使用「優化」或「壓縮」按鈕清理標記內容並縮小檔案大小。您也可以在「顏色」面板中輸入新值以取代特定顏色,並點選「套用」。點選「複製」或「下載」以儲存淨化並優化後的 SVG。", - heading3: "常見使用情境", - p3: "圖示管理,清理從 Figma 或 Illustrator 等設計工具匯出的 SVG。主題化,快速變更圖示集的顏色以符合您的品牌調色盤。安全性,淨化來自不受信任來源的 SVG,移除潛在的指令碼或外部參照。效能優化,壓縮 SVG 標記以縮小內嵌圖形的大小,提升頁面載入速度。", - heading4: "專業提示", - p4: "使用 currentColor 按鈕,將所有明確指定的填色與筆畫轉換為 currentColor,讓您的 SVG 能輕鬆透過 CSS 設定樣式。在正式環境使用 SVG 前,請務必先進行優化,確保檔案盡可能精簡。在設計工具中建立 SVG 時,請在優化前使用「外框筆畫」與「簡化路徑」功能,以降低產生程式碼的複雜度。", - }, cheatsheet: { title: "SVG 安全性注意事項", h0: "淨化處理", @@ -2801,16 +2479,6 @@ export default { text28: "點選「掃描」以尋找機密資訊。", text29: "✓ 已複製", }, - edu: { - heading1: "什麼是機密資訊外洩?", - p1: "機密資訊外洩是指 API 金鑰、密碼或私密權杖等敏感資訊,不慎被提交到版本控制系統或分享於公開論壇。這類外洩可能導致未經授權的存取、資料外洩與財務損失。本工具能協助您在本機瀏覽器中,於分享或提交程式碼之前,先識別常見的機密資訊模式。", - heading2: "如何使用此工具", - p2: "將您的程式碼、設定檔或記錄檔貼到輸入區域,點選「掃描」按鈕以分析文字中潛在的機密資訊。檢視每項偵測結果的分析與建議。使用「複製遮蔽結果」按鈕,取得已遮蔽機密資訊、可安全分享的文字版本。", - heading3: "常見使用情境", - p3: "提交前檢查,在提交程式碼前先掃描以確保不含機密資訊。記錄遮蔽,在與支援團隊或同事分享前先遮蔽記錄中的敏感權杖。安全稽核,快速稽核設定檔中是否含有寫死的憑證。", - heading4: "專業提示", - p4: "一旦發現憑證外洩,請務必立即輪替。請使用環境變數或機密資訊管理工具,而非將機密資訊寫死在原始碼中。啟用「包含低嚴重性模式」可進行更徹底的掃描,但請預期會出現更多誤判。", - }, cheatsheet: { title: "發現機密資訊時該怎麼做", h0: "立即行動步驟", @@ -2907,16 +2575,6 @@ export default { text15: "✓ 有效的 JWKS 結構(", text16: "請貼上 JWK。", }, - edu: { - heading1: "什麼是 JWT?", - p1: "JSON Web Token(JWT)是一種簡潔、URL 安全的格式,用於在雙方之間傳遞宣告。JWT 由三個以點分隔、經 Base64URL 編碼的部分組成:標頭(演算法與類型)、酬載(宣告)與簽章。簽章可確保權杖未遭竄改。JWT 常用於網頁 API 中的身份驗證與資訊交換。標準宣告包括 sub(主體)、iss(簽發者)、aud(受眾)、exp(到期時間)、nbf(不早於)、iat(簽發時間)與 jti(JWT ID)。", - heading2: "JWT 演算法", - p2: "HS256/384/512 使用 HMAC 搭配 SHA-2 與共享密鑰——簡單,但雙方必須持有相同的金鑰。RS256/384/512 使用 RSA PKCS#1 v1.5 非對稱簽章——非常適合微服務架構,因為服務端只需要公鑰即可。ES256/384/512 使用 ECDSA 搭配 NIST 曲線,在相同安全性下簽章比 RSA 更小。PS256/384/512 使用 RSA-PSS,這是現代系統中優於 RS* 的機率性變體。", - heading3: "JWK 與 JWKS", - p3: "JSON Web Key(JWK)是表示密碼學金鑰的 JSON 結構。JWK Set(JWKS)則是一種 JSON 結構,在 keys 屬性下包含一組 JWK 陣列。服務會在一個知名網址(例如 /.well-known/jwks.json)發佈其 JWKS,讓用戶端無需經由外部管道交換金鑰,即可取得公鑰以驗證 JWT。JWKS 中的金鑰透過其 kid(金鑰識別碼)識別,JWT 標頭會參照此識別碼。", - heading4: "安全性最佳實務", - p4: "請務必在伺服器端驗證 exp、nbf、iss 與 aud 宣告。切勿在正式環境中使用 alg: none 演算法——這會移除所有簽章保護。當多個服務都需要驗證權杖時,建議優先使用非對稱演算法(RS*、ES*、PS*)而非 HMAC。請定期輪替金鑰,並使用 kid 識別每個權杖所使用的簽署金鑰。請安全地儲存私鑰——切勿將其提交至版本控制系統。建議使用較短的到期時間並搭配重新整理權杖,而非使用長效期的 JWT。", - }, }, "encoding-workbench": { name: "編碼工作台", @@ -2980,16 +2638,6 @@ export default { js: { noLayers: "未偵測到可識別的編碼層級。", }, - edu: { - heading1: "編碼與雜湊有何不同?", - heading2: "如何使用此工具", - heading3: "分層編碼解析", - heading4: "雜湊演算法指南", - p1: "

編碼會將資料轉換為另一種可逆(可解碼)的表示形式。常見格式包括 Base64——用於在文字通道中傳輸二進位資料——URL 編碼、HTML 實體編碼與十六進位編碼。編碼並非加密,它不提供任何機密性保護。

雜湊是一種單向數學轉換,密碼學雜湊函式會接受任意輸入並產生固定長度的指紋。您無法透過雜湊值反推出原始輸入。雜湊常用於驗證檔案完整性、安全儲存密碼,以及產生數位簽章。

", - p2: "
  1. 編碼/解碼分頁:貼上文字並選擇操作(Base64、URL、HTML、十六進位),或點選「自動偵測層級」以自動解開多層巢狀編碼。
  2. 雜湊分頁:輸入文字或選擇檔案,選擇演算法,然後點選「全部計算雜湊」。啟用 HMAC 模式可搭配共享密鑰計算具金鑰的雜湊值。
  3. 識別分頁:貼上未知的雜湊或編碼字串,並點選「識別」以查看可能的演算法及其信心等級。
", - p3: "

現實世界中的資料常會經過多層編碼。舉例來說,某個酬載可能先經過 URL 編碼,再經過 Base64 編碼,最後放入十六進位字串中。「自動偵測層級」功能會檢視輸入內容的模式,依序嘗試每一種解碼方式,並將每個步驟以卡片形式視覺化呈現,讓您清楚看到資料是如何被層層包裝的。

", - p4: "", - }, }, "oauth-debugger": { name: "OAuth 偵錯器", @@ -3045,16 +2693,6 @@ export default { placeholder7: "https://yourapp.example.com/callback", placeholder8: "openid profile email", }, - edu: { - heading1: "什麼是 PKCE?為何重要?", - p1: "

Proof Key for Code Exchange(PKCE,RFC 7636)最初是為無法安全儲存用戶端密鑰的行動裝置與原生應用程式所設計。其運作方式是由用戶端產生一組隨機的 code_verifier,再由其衍生出 code_challenge(SHA-256 加 base64url),並在授權請求中傳送此 challenge。在以授權碼交換權杖時,用戶端會傳送原始的 code_verifier。授權伺服器會驗證其與先前的 challenge 是否相符——藉此證明權杖請求確實來自發起此流程的同一個用戶端。

即使是機密用戶端(擁有用戶端密鑰的伺服器端應用程式),OAuth 2.1 現在也建議採用 PKCE,作為防範授權碼攔截攻擊的措施。

", - heading2: "為什麼隱含式流程已被淘汰?", - p2: "

隱含式流程(response_type=token)原本是為單頁應用程式設計的捷徑,直接在網址片段中回傳存取權杖。這會造成嚴重問題:網址中的權杖會出現在瀏覽器歷史記錄、伺服器記錄與 referrer 標頭中,且此流程容易受到權杖注入攻擊。OAuth 2.0 安全性最佳實務(RFC 9700)與 OAuth 2.1 已明確移除隱含式流程,改採授權碼流程搭配 PKCE,讓單頁應用程式能在無需用戶端密鑰的情況下安全使用。

", - heading3: "OAuth 2.1 的關鍵變更", - p3: "", - heading4: "授權碼流程逐步說明", - p4: "
  1. 產生 PKCE 配對:建立一組隨機的 code_verifier,並計算 code_challenge = BASE64URL(SHA256(code_verifier))。
  2. 重新導向至授權端點:包含 response_type=code、client_id、redirect_uri、scope、state、code_challenge 與 code_challenge_method=S256。
  3. 使用者在授權伺服器進行身份驗證並授予同意。
  4. 在您的 redirect_uri 接收授權碼,並隨附回傳的 state——請驗證 state 是否與您傳送的一致。
  5. 以授權碼交換權杖:向權杖端點發送 POST 請求,帶上 grant_type=authorization_code、code、redirect_uri、client_id 與 code_verifier。
  6. 接收存取權杖(以及選用的 id_token 與 refresh_token),並使用它們呼叫 API。
", - }, }, "ladder-game": { name: "梯子遊戲", diff --git a/src/routes/case-converter.js b/src/routes/case-converter.js index 7ad8e90..4d3544e 100644 --- a/src/routes/case-converter.js +++ b/src/routes/case-converter.js @@ -6,7 +6,6 @@ import { respondHTML, respondJSON } from "../utils/respond.js"; import { createPageTemplate, createToolHeader } from "../utils/common-ui.js"; import { - createEducationalSection, createRelatedToolsSection, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; @@ -116,33 +115,7 @@ function renderCaseConverterPage(lang = DEFAULT_LANGUAGE) {
- ${createEducationalSection( - [ - { - title: "Naming Conventions Explained (camelCase/snake_case/etc)", - content: - "

Naming conventions are sets of rules for choosing the character sequence to be used for identifiers which denote variables, types, functions, and other entities in source code and documentation. camelCase (e.g., myVariable) starts with a lowercase letter and capitalizes the first letter of each subsequent word. snake_case (e.g., my_variable) uses underscores to separate words.

PascalCase (e.g., MyVariable) capitalizes the first letter of every word, while kebab-case (e.g., my-variable) uses hyphens to separate words. These conventions are not just about aesthetics; they are critical for code readability, maintainability, and adhering to the idiomatic standards of different programming languages and frameworks.

", - }, - { - title: "How to Use This Tool", - content: - '
  1. Type or paste your text into the "Input Text" area at the top of the page.
  2. The tool will automatically convert your input into over a dozen different case styles in real-time.
  3. Scroll through the "Conversion Results" grid to find the specific case style you need.
  4. Click the "Copy" icon next to any result to save it to your clipboard.
  5. Use the "Clear" button to remove all input and start a new conversion.
', - }, - { - title: "Common Use Cases", - content: - "", - }, - { - title: "Pro Tips", - content: - "", - }, - ], - "case-converter", - currentLang, - )} - ${createRelatedToolsSection(relatedToolsData)} + ${createRelatedToolsSection(relatedToolsData)}
`; diff --git a/src/routes/certificate-decoder.js b/src/routes/certificate-decoder.js index d1327c7..4c6fde2 100644 --- a/src/routes/certificate-decoder.js +++ b/src/routes/certificate-decoder.js @@ -11,7 +11,6 @@ import { infoHint, } from "../utils/common-ui.js"; import { - createEducationalSection, createRelatedToolsSection, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; @@ -209,53 +208,7 @@ function renderCertificateDecoderPage(lang = DEFAULT_LANGUAGE) {
- ${createEducationalSection( - [ - { - title: "What are X.509 Certificates?", - content: ` -

X.509 is a standard format for public key certificates, which are digital documents that securely bind a public key to an identity (such as a website, organization, or individual). These certificates are the foundation of the Public Key Infrastructure (PKI) used to secure the internet via HTTPS, as well as for signing emails and software.

-

An X.509 certificate contains the public key, the identity of the certificate holder, and the digital signature of the Certificate Authority (CA) that issued the certificate, proving its authenticity.

- `, - }, - { - title: "How to Use This Tool", - content: ` -
    -
  1. Paste your certificate: Copy your PEM-encoded certificate (including the BEGIN and END headers) and paste it into the input field.
  2. -
  3. Parse: Click "Parse Certificate" to extract and analyze the data.
  4. -
  5. Review Summary: Check the top cards for the Common Name (CN), Issuer, and validity dates.
  6. -
  7. Inspect Details: Expand the sections below to see the full Subject, Issuer, SANs, and technical extensions.
  8. -
  9. Check Status: Look at the status badge to see if the certificate is currently valid or expired.
  10. -
- `, - }, - { - title: "Common Use Cases", - content: ` - - `, - }, - { - title: "Pro Tips", - content: ` - - `, - }, - ], - "certificate-decoder", - currentLang, - )} - ${createRelatedToolsSection(relatedToolsData)} + ${createRelatedToolsSection(relatedToolsData)}
`; diff --git a/src/routes/cidr-calculator.js b/src/routes/cidr-calculator.js index 63f95ba..18cadd7 100644 --- a/src/routes/cidr-calculator.js +++ b/src/routes/cidr-calculator.js @@ -11,9 +11,7 @@ import { infoHint, } from "../utils/common-ui.js"; import { - createEducationalSection, createRelatedToolsSection, - createVisibleArticle, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; import { @@ -75,15 +73,6 @@ function renderCIDRCalculatorPage(lang = DEFAULT_LANGUAGE) { ${toolHeader} - ${createVisibleArticle({ - title: "Subnet math in the browser, not against a live network", - paragraphs: [ - `Enter an IPv4 or IPv6 prefix and this planner derives network, broadcast (IPv4), host range, and reverse-DNS labels with integer arithmetic in the page. It does not ping hosts, query WHOIS, or walk a routing table.`, - `IPv4 still reserves network and broadcast addresses in a subnet, so a /24 has 254 usable hosts. IPv6 assignments are usually /64 on a LAN; compressing zeros is display only and does not change the prefix.`, - `Use it to size a VPC, check that two CIDRs overlap, or mint a PTR name before you write the zone file. The result is a calculation, not a guarantee that the addresses are free on the wire.`, - ], - })} -
@@ -360,33 +349,6 @@ function renderCIDRCalculatorPage(lang = DEFAULT_LANGUAGE) {
- ${createEducationalSection( - [ - { - title: "What is CIDR?", - content: - "Classless Inter-Domain Routing (CIDR) is a method for allocating IP addresses and IP routing. It replaced the older system based on classes (A, B, and C) to provide more flexibility and efficiency in address distribution.", - }, - { - title: "How to Use This Tool", - content: - 'Enter an IP address with a prefix (e.g., 192.168.1.0/24) or use the slider to adjust the prefix length. Click "Run analysis" to see network details, usable host ranges, and binary representations.', - }, - { - title: "Common Use Cases", - content: - "Planning network subnets for cloud infrastructure (VPCs), troubleshooting routing issues, calculating host capacity for a given prefix, and converting between CIDR and subnet masks.", - }, - { - title: "Pro Tips", - content: - "Remember that in IPv4, the first and last addresses in a subnet are typically reserved for the network ID and broadcast address. In IPv6, subnets are almost always /64 for standard local networks.", - }, - ], - "cidr-calculator", - currentLang, - )} - ${createCheatsheet("cidr-calculator", "Subnet Quick Reference", [ { heading: "Common Subnets", diff --git a/src/routes/code-minifier.js b/src/routes/code-minifier.js index f8070c1..ff68be4 100644 --- a/src/routes/code-minifier.js +++ b/src/routes/code-minifier.js @@ -11,7 +11,6 @@ import { } from "../utils/common-ui.js"; import { respondHTML } from "../utils/respond.js"; import { - createEducationalSection, createRelatedToolsSection, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; @@ -141,33 +140,7 @@ function renderCodeMinifierPage(lang = DEFAULT_LANGUAGE) {
- ${createEducationalSection( - [ - { - title: "What is Minification?", - content: - "

Minification is the process of removing all unnecessary characters from source code without changing its functionality. This includes removing whitespace, newlines, comments, and sometimes shortening variable names. The goal is to reduce the file size of the code, which in turn reduces the amount of data that needs to be transferred over the network.

This leads to faster page load times and improved performance for web applications. While minification is essential for production environments, it makes the code nearly impossible for humans to read and debug. Therefore, it is typically performed as a final step in the build process before deploying to a live server.

", - }, - { - title: "How to Use This Tool", - content: - '
  1. Select the programming language (JavaScript, CSS, or HTML) from the tabs at the top.
  2. Paste your source code into the "Input Code" text area on the left.
  3. Click the "Minify Code" button to reduce the file size for production use.
  4. Alternatively, click "Beautify Code" to add indentation and formatting for better readability.
  5. View the results in the "Output Code" area and click "Copy" or "Download" to save your optimized code.
  6. Need to format or minify JSON? Use the JSON Formatter tool.
', - }, - { - title: "Common Use Cases", - content: - "", - }, - { - title: "Pro Tips", - content: - "", - }, - ], - "code-minifier", - currentLang, - )} -
+ ${createRelatedToolsSection(relatedToolsData)} `; diff --git a/src/routes/color-converter.js b/src/routes/color-converter.js index bd34a5e..d410c56 100644 --- a/src/routes/color-converter.js +++ b/src/routes/color-converter.js @@ -6,7 +6,6 @@ import { respondHTML, respondJSON } from "../utils/respond.js"; import { createPageTemplate, createToolHeader } from "../utils/common-ui.js"; import { - createEducationalSection, createRelatedToolsSection, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; @@ -162,33 +161,7 @@ function renderColorConverterPage(lang = DEFAULT_LANGUAGE) {
- ${createEducationalSection( - [ - { - title: "Color Models Explained (HEX/RGB/HSL)", - content: - "

Color models are mathematical systems for representing colors. HEX (Hexadecimal) is a 6-digit code used in HTML and CSS, representing Red, Green, and Blue components. RGB (Red, Green, Blue) uses decimal values from 0 to 255 for each channel, often used in digital imaging.

HSL (Hue, Saturation, Lightness) is more intuitive for humans, as it describes color in terms of its base pigment (Hue), intensity (Saturation), and brightness (Lightness). Understanding these models helps in choosing the right format for your design and development needs, ensuring consistency across different platforms and devices.

", - }, - { - title: "How to Use This Tool", - content: - '
  1. Use the visual color picker to select a color by dragging the cursor in the saturation/brightness square and the hue slider.
  2. Alternatively, enter a specific value in the "Manual Input" field (supports #hex, rgb, or hsl formats).
  3. Observe the "Preview" box to see the selected color in real-time.
  4. View the converted values in the HEX, RGB, HSL, and HSV cards below.
  5. Click the "Copy" icon on any card to save that specific format to your clipboard.
', - }, - { - title: "Common Use Cases", - content: - "", - }, - { - title: "Pro Tips", - content: - "", - }, - ], - "color-converter", - currentLang, - )} -
+ ${createRelatedToolsSection(relatedToolsData)} `; diff --git a/src/routes/cron-builder.js b/src/routes/cron-builder.js index 3f57ab7..c4dbd0d 100644 --- a/src/routes/cron-builder.js +++ b/src/routes/cron-builder.js @@ -7,11 +7,9 @@ import { } from "../utils/common-ui.js"; import { createRelatedToolsSection, - createVisibleArticle, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; import { - DEFAULT_LANGUAGE, getToolTranslation, normalizeLanguage, resolveRequestLanguage, @@ -48,15 +46,6 @@ export async function handleCronBuilderRoutes(request) { { toolId: "cron-builder" }, )} - ${createVisibleArticle({ - title: "Five-field crontab, explained in this tab", - paragraphs: [ - `This builder speaks classic Vixie/crontab syntax: minute, hour, day of month, month, day of week. It does not accept a sixth seconds field, Quartz, or systemd OnCalendar=. If your scheduler wants those, this page will not silently translate them.`, - `The next-run list is computed in the browser from the expression and your current timezone. It is a preview, not a job runner. Nothing is stored and no webhook is registered.`, - `Day-of-week 0 and 7 are both Sunday. Lists, ranges, and steps (1,15, 1-5, */5) work; named months and days are accepted where crontab does. If the parser cannot read a field, the preview stays empty instead of inventing a schedule.`, - ], - })} -
diff --git a/src/routes/csp-builder.js b/src/routes/csp-builder.js index d00d2d1..2f270d8 100644 --- a/src/routes/csp-builder.js +++ b/src/routes/csp-builder.js @@ -13,7 +13,6 @@ import { infoHint, } from "../utils/common-ui.js"; import { - createEducationalSection, createRelatedToolsSection, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; diff --git a/src/routes/css-gradient-generator.js b/src/routes/css-gradient-generator.js index 4e3180a..196382f 100644 --- a/src/routes/css-gradient-generator.js +++ b/src/routes/css-gradient-generator.js @@ -7,7 +7,6 @@ import { createPageTemplate, createToolHeader } from "../utils/common-ui.js"; import { - createEducationalSection, createRelatedToolsSection, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; @@ -183,33 +182,7 @@ function renderCSSGradientPage(lang = DEFAULT_LANGUAGE) {
- ${createEducationalSection( - [ - { - title: "What are CSS Gradients?", - content: - "

CSS gradients are a powerful feature that allows you to display smooth transitions between two or more specified colors. Unlike traditional background images, gradients are generated by the browser, which means they are infinitely scalable, consume less bandwidth, and can be easily manipulated with code. They are commonly used for backgrounds, buttons, and decorative elements to add depth and visual interest to web designs.

", - }, - { - title: "Linear vs Radial Gradients", - content: - '

There are two main types of CSS gradients:

', - }, - { - title: "Browser Support and Performance", - content: - "

Modern CSS gradients are widely supported across all major browsers, including Chrome, Firefox, Safari, and Edge. Because they are rendered mathematically by the browser's engine, they are extremely performant compared to high-resolution images. However, for very complex gradients with dozens of color stops, it's always good practice to test performance on lower-end devices. For older browsers (like IE9 and below), it's recommended to provide a solid color fallback.

", - }, - { - title: "Pro Tips for Better Gradients", - content: - '', - }, - ], - "css-gradient-generator", - currentLang, - )} -
+
${createRelatedToolsSection(relatedToolsData)}
- ${createEducationalSection( - [ - { - title: "Image Formats Compared (PNG/JPEG/WebP)", - content: - "

Choosing the right image format is crucial for web performance and visual quality. JPEG is best for photographs and complex images with many colors, as it uses lossy compression to achieve small file sizes. PNG is ideal for images that require transparency or have sharp edges and solid colors (like logos and icons), as it uses lossless compression.

WebP is a modern format that provides superior lossy and lossless compression, often resulting in significantly smaller file sizes than JPEG or PNG while maintaining high quality. Our tool supports all these formats, allowing you to optimize your assets for any platform or device without sacrificing clarity.

", - }, - { - title: "How to Use This Tool", - content: - '
  1. Upload your image by dropping it into the "Upload Image" zone or clicking to browse your files. PNG, JPG, WebP, GIF and BMP files are accepted; an animated GIF is read as its first frame only.
  2. Select your desired output format (PNG, JPG, or WebP) from the "Convert Format" options.
  3. If you\'ve selected a lossy format like JPG or WebP, use the quality slider to balance file size and visual fidelity.
  4. Optionally, use the "Resize Image" settings to scale your image by percentage or specific dimensions.
  5. Click "Convert & Resize Image" and then "Download" to save your optimized asset.
', - }, - { - title: "Common Use Cases", - content: - "", - }, - { - title: "Pro Tips", - content: - "", - }, - ], - "image-converter", - currentLang, - )} -
+ ${createRelatedToolsSection(relatedToolsData)} `; diff --git a/src/routes/json-formatter.js b/src/routes/json-formatter.js index f8fc921..19c0db8 100644 --- a/src/routes/json-formatter.js +++ b/src/routes/json-formatter.js @@ -16,9 +16,7 @@ import { getRichEditorScript, } from "../utils/rich-editor.js"; import { - createEducationalSection, createRelatedToolsSection, - createVisibleArticle, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; import { @@ -82,15 +80,6 @@ function renderJSONFormatterPage(lang = "en") { ${toolHeader} - ${createVisibleArticle({ - title: "Why this JSON formatter does not upload your document", - paragraphs: [ - `This page calls the browser's JSON.parse and JSON.stringify. There is no "save" action, no paste history, and no shareable link with a sequential id. That is the product: a formatter you can use on an API envelope that still contains session cookies or internal hostnames.`, - `In November 2025, security researchers showed that long-running online formatters which do store pastes had leaked years of JSON through predictable "recent" URLs. The documents included cloud access keys, JWTs, and internal configs. If a site can show you last week's paste, it had to receive it. This tool never gets that chance because the Worker only serves the HTML and static assets.`, - `Valid JSON is RFC 8259: double-quoted keys and strings, no trailing commas, no comments, no single quotes. The validator reports the first parse error with a line number. Pretty-print is lossless whitespace; minify is the inverse. Neither step sends a byte of the document off this origin.`, - ], - })} -
- ${createEducationalSection( - [ - { - title: "What is JSON?", - content: - "

JSON (JavaScript Object Notation) is a lightweight data-interchange format that is easy for humans to read and write and easy for machines to parse and generate. It is based on a subset of the JavaScript Programming Language Standard. JSON is a text format that is completely language independent but uses conventions that are familiar to programmers of the C-family of languages, including C, C++, C#, Java, JavaScript, Perl, Python, and many others.

These properties make JSON an ideal data-interchange language for web applications, APIs, and configuration files. It represents data as name/value pairs and ordered lists of values. It has become the de facto standard for data exchange on the web, largely replacing XML due to its smaller footprint and better performance.

", - }, - { - title: "How to Use This Tool", - content: - '
  1. Paste your raw or messy JSON data into the "Input JSON" editor on the left.
  2. Click the "Format" button to beautify the code with proper indentation and syntax highlighting.
  3. Alternatively, use the "Minify" button to remove all whitespace for production use.
  4. Check the "Status" indicator to ensure your JSON is valid; if there\'s an error, the tool will highlight the exact line.
  5. Click "Copy" to save the formatted result to your clipboard or "Clear" to start over.
', - }, - { - title: "Common Use Cases", - content: - "", - }, - { - title: "Pro Tips", - content: - '', - }, - ], - "json-formatter", - lang, - )} - ${createRelatedToolsSection(relatedToolsData)} + ${createRelatedToolsSection(relatedToolsData)}
${getAdSlotHTML("json", { path: "/json-formatter", diff --git a/src/routes/log-masker.js b/src/routes/log-masker.js index 74156c3..23f89d6 100644 --- a/src/routes/log-masker.js +++ b/src/routes/log-masker.js @@ -1,7 +1,6 @@ import { respondHTML } from "../utils/respond.js"; import { createPageTemplate, createToolHeader } from "../utils/common-ui.js"; import { - createEducationalSection, createRelatedToolsSection, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; @@ -101,33 +100,7 @@ function renderLogMaskerPage(lang = DEFAULT_LANGUAGE) {
- ${createEducationalSection( - [ - { - title: "What is PII?", - content: - "

Personally Identifiable Information (PII) is any data that can be used to identify a specific individual. This includes direct identifiers like names, email addresses, and phone numbers, as well as indirect identifiers like IP addresses, physical locations, and credit card numbers. In the context of server logs, PII often appears in request parameters, headers, or error messages.

Protecting PII is a critical part of modern data security and is required by various legal frameworks around the world.

", - }, - { - title: "Compliance Requirements (GDPR/CCPA)", - content: - '

Regulations like the General Data Protection Regulation (GDPR) in Europe and the California Consumer Privacy Act (CCPA) in the United States impose strict rules on how personal data is handled. These laws require organizations to implement "privacy by design" and to minimize the collection and storage of personal data.

Sharing raw logs containing PII with third-party support teams or developers can lead to compliance violations. Masking or redacting this data before it leaves your secure environment is a key step in maintaining regulatory compliance.

', - }, - { - title: "Masking Strategies", - content: - "

There are several ways to handle sensitive data in logs:

Our tool focuses on redaction, using pattern matching to find and replace common PII formats instantly.

", - }, - { - title: "Pro Tips", - content: - '', - }, - ], - "log-masker", - currentLang, - )} - ${createRelatedToolsSection(relatedToolsData)} + ${createRelatedToolsSection(relatedToolsData)}
`; diff --git a/src/routes/mock-data-generator.js b/src/routes/mock-data-generator.js index 24b005a..f3c71ed 100644 --- a/src/routes/mock-data-generator.js +++ b/src/routes/mock-data-generator.js @@ -11,7 +11,6 @@ import { infoHint, } from "../utils/common-ui.js"; import { - createEducationalSection, createRelatedToolsSection, } from "../utils/content-ui.js"; import { TOOLS } from "../utils/tool-registry.js"; @@ -178,33 +177,7 @@ function renderMockDataPage(lang = DEFAULT_LANGUAGE) { ])}
- ${createEducationalSection( - [ - { - title: "What is Mock Data?", - content: - "

Mock data is synthetic information that mimics real-world data without containing any sensitive or personally identifiable information (PII). It is essential for developers and testers who need realistic datasets to build and validate applications without risking data breaches or violating privacy regulations like GDPR or CCPA. By using mock data, you can simulate various scenarios, from standard user profiles to edge cases, ensuring your software handles all types of input gracefully.

", - }, - { - title: "Testing Strategies", - content: - "

Effective testing requires diverse datasets. Use mock data to seed your development databases, perform load testing with thousands of records, or verify UI layouts with varying string lengths. It's particularly useful for integration testing where you need predictable responses from external APIs. By generating data locally, you can create consistent test environments that are easy to reset and reproduce, leading to more reliable and faster development cycles.

", - }, - { - title: "Data Privacy in Mocks", - content: - '

Privacy is a top priority in modern software development. Using real production data in development or staging environments is a major security risk. Mock data generators solve this by producing "fake" but structurally correct data. Our tool runs entirely in your browser, meaning your configuration and the generated data stay in your browser and are not sent to our servers. This "Privacy-First" approach ensures that even the process of creating mock data is secure and compliant with the strictest security standards.

', - }, - { - title: "Pro Tips", - content: - "", - }, - ], - "mock-data-generator", - currentLang, - )} -
+ ${createRelatedToolsSection(relatedToolsData)}