Prípadová štúdia
Interné nástroje a technické dashboardy
Webové rozhranie, ktoré zobrazuje stav zariadení a konfiguráciu na jednom mieste, na mobile aj na veľkej obrazovke.
- Next.js
- React
- TypeScript
- Tailwind CSS
- Vercel
Problém
Údaje o stave zariadení a konfigurácii boli roztrúsené vo viacerých nástrojoch a exportoch. Prehľad si musel každý poskladať sám.
Cieľ
Rozhranie, ktoré zobrazí stav zariadení a konfiguráciu na jednom mieste, funguje na mobile aj na veľkej obrazovke a dá sa rýchlo rozšíriť.
Riešenie
Postavil som webovú aplikáciu s typovaným dátovým modelom, prehľadovými obrazovkami, filtrovaním a vizualizáciou meraných hodnôt. Rozhranie je responzívne, komponenty znovupoužiteľné a obsah oddelený od prezentačnej vrstvy.
Najťažšia časť
Navrhnúť dátový model tak, aby zvládol rôzne typy zariadení bez toho, aby sa rozhranie pri každom novom type prepisovalo.
Výsledok
Nástroj používam pri každodennej práci; nové zariadenie sa doplní zmenou dát, nie zmenou komponentov.
Poučenie
Že dobrý typový model ušetrí viac času ako akákoľvek optimalizácia rozhrania.