Case StudyTypeScript / Privacy / SSG / i18n

FormattedAI.pl

Darmowe narzędzia deweloperskie stawiające na prywatność. 100% po stronie klienta -- zero uploadu, zero śledzenia, zero kont. Formater Markdown, konwerter AVIF, minifikatory CSS/JS, generator tagów SEO/GEO.

FormattedAI.pl

FormattedAI to kolekcja darmowych narzędzi webowych dla deweloperów i twórców treści, stawiających na prywatność. Każde narzędzie działa całkowicie w przeglądarce -- Twoje dane nigdy nie opuszczają urządzenia. Bez kont, bez uploadu, bez śledzenia.

Problem

Każde narzędzie do formatowania i konwersji na rynku wysyła dane na zewnętrzne serwery. Dla deweloperów pracujących pod NDA lub obsługujących wrażliwe bazy kodu, jest to bezpośrednie naruszenie ich umów. Większość narzędzi wymaga też kont, śledzi użytkowników ciasteczkami i serwuje reklamy.

Potrzebowałem narzędzi, którym mogę zaufać z kodem klienta, kluczami API widocznymi w konfigach i zastrzeżoną logiką biznesową. Nic na rynku nie oferowało takiej gwarancji.

Rozwiązanie

Zestaw 5 produkcyjnych narzędzi (+ 2 w przygotowaniu), które działają w 100% w przeglądarce. Serwer dostarcza statyczny HTML, CSS i JavaScript -- potem Twoja maszyna wykonuje całą pracę.

Narzędzia

FormattedAI - Homepage

Homepage

Landing page with all available tools. Built with vanilla HTML/SCSS/JS, no frameworks.

1/6

Artykuły

Wbudowana baza wiedzy, gdzie publikuję poradniki o wydajności stron, optymalizacji obrazów i samych narzędziach. Służy zarówno jako dokumentacja, jak i hub treści dla ruchu organicznego.

FormattedAI - Sekcja artykułów

Architektura techniczna

Cała aplikacja zbudowana jest z czystego HTML, SCSS i JavaScript -- bez frameworków. Narzędzia budowania ograniczają się do Sass, esbuild i własnego generatora i18n w Node.js. To utrzymuje bundle minimalny i eliminuje ryzyko supply chain.

  • Bez frameworków -- czysty HTML/SCSS/JS, zero zależności runtime
  • WebAssembly -- konwersja AVIF używa enkodera jSquash WASM działającego w przeglądarce
  • Biblioteki klienckie -- Terser, CSSO i Beautify zbundlowane do minifikacji/formatowania w przeglądarce
  • Marked + DOMPurify -- parsowanie Markdown z sanityzacją HTML
  • Statyczne i18n -- własny skrypt budowania generuje osobny HTML dla polskiego i angielskiego z plików JSON i szablonów
  • Nginx -- wdrożenie produkcyjne z gzip, rocznym cache assetów, nagłówkami bezpieczeństwa

SEO i GEO

Generator tagów SEO/GEO to nie tylko narzędzie -- sam FormattedAI jest zoptymalizowany zarówno pod tradycyjne wyszukiwarki, jak i silniki AI:

  • Dane strukturalne JSON-LD (WebSite, WebApplication, FAQPage, BreadcrumbList)
  • Tagi Open Graph + Twitter Card na każdej stronie
  • Alternates hreflang dla PL/EN
  • llms.txt dla discoverability przez AI crawlery
  • AI-aware robots.txt (GPTBot, ClaudeBot, PerplexityBot)

Stack

  • Vanilla HTML / SCSS / JavaScript (bez frameworków)
  • esbuild + Dart Sass (tylko build)
  • WebAssembly (enkoder jSquash AVIF)
  • Terser, CSSO, js-beautify (zbundlowane kliencko)
  • Marked + DOMPurify (przetwarzanie Markdown)
  • Własny generator statyczny i18n w Node.js
  • Nginx (serwer produkcyjny)

Wyniki

  • 100/100 wynik Lighthouse na wszystkich stronach
  • Zero zewnętrznych wywołań API -- wszystko działa lokalnie
  • 2 języki -- pełny polski i angielski, generowane statycznie
  • 5 aktywnych narzędzi + 2 w przygotowaniu (JSON Formatter, Color Palette)
  • Licencja MIT -- w pełni open-source
  • Używane przez deweloperów w firmach ze ścisłymi politykami przetwarzania danych