Case Study: Valli – Customer Portal implementation

Details

Client

Valli

Published

October 2025

A few numbers

Plants

100+

Variable recordings per day

30K+

Contesto del cliente

Founded in 1956, VALLI S.r.l. has established itself as a global leader in poultry equipment, offering “turnkey” solutions for layer hens, pullets, breeders, and broiler farms. With a “made in Italy” approach that combines over 60 years of experience with exclusive patents and multi-tier systems, VALLI currently operates in more than 70 countries, providing design, installation, and after-sales support for complete systems.

Challenge

Valli needed to renew access to plant data collected from field routers: fragmented dashboards, manual updates, and static pages didn’t allow technicians and farmers to monitor critical parameters (temperature, humidity, production, consumption) at the pace required by the business. A single web interface was needed to enable real-time data viewing, remote HMI control, and quick generation of operational reports.

Soluzione sviluppata

We developed the Valli Customer Portal, a Next.js app designed for both desktop and mobile, featuring secure authentication (access and refresh tokens, OTP) integrated into the middleware.
The customizable dashboards offer drag-and-drop widgets and automatic controls based on machine configurations. Remote HMI access is available directly from the browser via WebSocket or HTTP sessions, while the reporting area consolidates consumption, production, and health status data with instant Excel export. The portal is fully brand-customizable, allowing selection of language, colors, and company logo.

Processo di sviluppo

Development followed user-centered iterative cycles, starting from UX/UI design and a Material UI 6 design system. The core of the portal (dashboards and reports) was built with a widget-based logic, state management via Zustand, and secure APIs featuring authentication and OTP. HMI integration was handled through the useGuacamole hook for VNC/HTTP sessions, while the final phase focused on graphic optimization, internationalization, and accessibility improvements.

Funzionalità principali

Protected login with OTP, automatic refresh, and route-guard middleware.
Drag-and-drop dashboard with widgets for real-time values, historical data, gauges, egg collection, and multi-parameter charts.
HMI integration with HTTP launch or embedded VNC session, plus automatic filtering of available servers (web/mobile).
Reporting section with time filters, dedicated components for birds, eggs, probes, sanitizations, and consumption, featuring optimized printing and Excel export.
Theme customization: color selection, logo upload, and language settings synchronized with company APIs.
Multilanguage support (Italian/English) based on next-intl, with automatic server-side language configuration.

Valore aggiunto

For customers: a unified and up-to-date view of farms, with customizable dashboards and downloadable reports in one click.
For the internal team: centralized management of branding, permissions, and configurations, reducing support needs through self-service settings.
For the business: a modern and modular architecture (Next.js 15 / Turborepo) ready to integrate new widgets and data flows.

Tecnologie utilizzate

Frontend: Next.js 15 (App Router, middleware), React 19, Material UI 6, Turborepo, Zustand, TanStack Query, next-intl.
Backend: C#, Mongo, .NET core, asp.net, entity framework
Proprietary libraries: layout, dialog, auth management, and shared utilities.
Data communication: HTTP client for Valli APIs, WebSocket with guacamole-common-js for HMI.
Build & deploy: Docker pipeline with Turbo prune/build, PNPM, and local HTTPS support via sops exec-env.