Skąd się wziął projekt
Panel klienta MistyCloud to główna aplikacja użytkownika platformy hostingowej. Klienci mogą kupować i zarządzać trzema typami usług: serwerami gier (automatyczne prowizjonowanie przez Pelican Panel), web hostingiem i VPS. Kluczową funkcją jest wbudowana konsola serwerowa — terminal działający w przeglądarce, połączony przez Socket.IO z backendem, umożliwiający zarządzanie serwerem w czasie rzeczywistym. Aplikacja wspiera wiele języków i walut.
Co było trudne
Użytkownicy platformy hostingowej oczekują doświadczenia zbliżonego do natywnego narzędzia — chcą widzieć logi serwera w czasie rzeczywistym, zarządzać plikami, tworzyć backupy i zmieniać ustawienia bez konieczności używania zewnętrznych klientów SSH. Jednocześnie aplikacja musi być szybka, responsywna i działać w wielu językach dla różnych rynków.
Jak to rozwiązałem
Zbudowałem SPA w React 19 z Vite dla szybkiego development experience. xterm.js implementuje pełnoprawny terminal w przeglądarce, połączony przez Socket.IO z backendem — użytkownik widzi logi i może wydawać komendy w czasie rzeczywistym. Zustand zarządza globalnym stanem aplikacji. Framer Motion i GSAP zapewniają płynne animacje. i18next obsługuje internacjonalizację z automatycznym wykrywaniem języka przeglądarki. Turnstile CAPTCHA chroni formularze autentykacji.
Wynik
Kompletna aplikacja kliencka z zarządzaniem trzema typami usług hostingowych, wbudowaną konsolą serwerową w przeglądarce, sklepem z produktami, portfelem i historią transakcji oraz pełną obsługą wielu języków i walut.