Web UI for Hosting Control Panel
Project overview
The project is the development of the hosting provider’s client web cabinet (and the service’s public pages), where users can manage their services and settings.
Web UI for Hosting Control Panel
Client
The customer is a European web hosting provider.
Project Facts
Technologies: TypeScript, Next.js, React, react-dom, next-intl, SWR, Tailwind CSS, @tailwindcss/postcss , Sass, @radix-ui/react-select, motion, clsx, iconsax-reactjs, react-circle-flags, ESLint, eslint-config-next
Industry: telecommunications
Location: Europe
Project duration: 65 Mandays
Project overview
The project is the development of the hosting provider’s client web cabinet (and the service’s public pages), where users can manage their services and settings.
Business Challenge
The customer hired Chudovo for the implementation of its core web hosting platform based on microservices. Later, our team took over the implementation of the web UI for managing hosting settings by users in the hosting control panel. The main tasks set by the customer were:
- Development of the intuitive web interface to align with hosting workflows, taking into account UI/UX principles
- Implementation of modern UI and its integration with the back-end part
- Security compliance, secure authentication, and data handling
- Development of the web interface according to the set deadlines
Solution
Functionally, the project covers typical hosting scenarios:
- View/management of tariffs and subscriptions
- Services management (domains/hosting resources)
- Account settings
- Other features such as multilanguage, quick search, filtering, statuses, push-notifications.
Main responsibilities of the front-end engineer:
- Development of web UI for hosting control panel on Next.js + React + TypeScript: basic architecture, page structure, routing, UI composition
- Implementation of the client account: screens/sections for managing services and user data (lists, detailed pages, “empty/loading/error” states, basic navigation)
- Integration with API and preparation of a typed data interaction layer via SWR (caching, data updates, revalidation control, unified error handlers/loaders)
- Construction of reusable UI components (buttons, inputs, selects on Radix, small status display components), consistent styles via Tailwind + clsx
- Multilanguage support (i18n) via next-intl: connecting locales, organizing dictionaries/namespaces, UI for switching languages (with flags if necessary)
- UX/UI improvements: advice on form and list behavior, clear service statuses, neat animations/transitions via motion, adaptability for different screens
- Code quality support: ESLint, alignment of typing approaches, and minor component refactoring for readability and reuse.
Business Impact
- The customer successfully launched the solutions and enabled users to manage their hosting settings over the web UI
- Delivery of the fully functional hosting control panel for the efficient management of hosting settings
- The interface is optimized for use on mobile devices
Client
The customer is a European web hosting provider.
Project Facts
Technologies: TypeScript, Next.js, React, react-dom, next-intl, SWR, Tailwind CSS, @tailwindcss/postcss , Sass, @radix-ui/react-select, motion, clsx, iconsax-reactjs, react-circle-flags, ESLint, eslint-config-next
Industry: telecommunications
Location: Europe
Project duration: 65 Mandays
Contact us