센바스 터치(SENVAS Touch)에서 웹 기술로 만든 건 터치 관리 런처입니다. 기기를 켜고, 앱을 배포하고, 원격으로 관리하는 바탕 층이죠. 화면에 띄우는 HMI(운영자가 조작하는 현장 제어 화면) 자체가 아니라, 그 HMI 앱을 띄우고 관리하는 런처·콘솔을 웹으로 만들었습니다. 이 글은 그 관리 런처에 적용된 웹 기술을 정리합니다.

헷갈리기 쉬운 부분 — 운영자가 보는 HMI 앱은 별개입니다. .NET·Node.js·Python·네이티브 등 무엇으로 만들든, 런처가 그 앱을 전체화면으로 띄워 줍니다. 런처와 관리 콘솔이 웹이고, HMI 앱은 그 위에서 돕니다.

관리 런처가 하는 일

터치 관리 런처는 기기의 바탕에서 이런 일을 합니다.

  • 켜면 바로 — 부팅과 동시에 전체화면으로 떠서, 사용자 HMI 앱을 띄우거나(실행 중이면) 안내 화면을 보여줍니다(미실행이면).
  • 웹 관리 콘솔 — 브라우저로 들어가 앱 배포·모니터링·부팅화면·폰트·네트워크·시스템을 관리합니다.
  • 원격 관리 — 인터넷 너머에서도 같은 콘솔로 들어옵니다.

이 바탕 층을 으로 만들었습니다.

왜 런처를 “웹”으로 만들었나

  • 빠른 개발 — 관리 화면을 만들고 고치는 속도가 빠릅니다.
  • 현대적 화면 — 익숙한 웹 컴포넌트로 깔끔한 관리 콘솔을 구성합니다.
  • 하나의 기술로 전부 — 현장 안내 화면, 웹 관리 콘솔, 원격 접속이 전부 같은 웹 앱입니다.

핵심 스택 — .NET 9 + Blazor Server

.NET 9 Blazor Server로 런처의 화면과 로직을 모두 C# 한 언어로 작성합니다. .NET 9의 Blazor Server가 서버에서 화면을 렌더링하고 브라우저와 실시간으로 주고받습니다.

  • Blazor Server — 무거운 런타임을 브라우저에 내려받지 않으니, 라즈베리파이 같은 작은 기기에서도 가볍게 돕니다.
  • SignalR (WebSocket) — 서버와 브라우저가 실시간 양방향으로 연결됩니다. 상태·모니터링이 새로고침 없이 즉시 반영됩니다.
  • Kestrel — .NET 내장 웹서버가 기기 안에서 직접 콘솔을 띄웁니다. 별도 웹서버를 설치할 필요가 없습니다.

런처는 웹, HMI 앱은 따로

런처와 HMI 앱의 분리가 핵심입니다. 기기 안 런처 하나가 관리의 세 얼굴을 하면서, 그 위에 사용자 HMI 앱을 띄웁니다.

flowchart TD
    Launcher["터치 관리 런처.NET 9 Blazor Server · 웹"]
    Launcher --> Console["웹 관리 콘솔PC·태블릿·폰 브라우저"]
    Launcher --> Welcome["현장 안내 화면전체화면 키오스크"]
    Launcher --> Remote["원격 접속인터넷 어디서나"]
    Launcher -. 전체화면으로 띄움 .-> HMI["사용자 HMI 앱 (별개).NET · Node · Python · 네이티브"]

관리 콘솔·안내 화면·원격은 전부 같은 웹 앱(런처)입니다. 반면 운영자가 실제로 조작하는 HMI 앱은 별개 — 무엇으로 만들든 런처가 전체화면으로 띄워 주고, 종료되면 다시 안내 화면으로 돌아옵니다.

Chromium 키오스크 — 전체화면으로

Chromium 키오스크 모드로 런처가 부팅과 동시에 브라우저를 전체화면으로 띄웁니다. 주소창도 버튼도 없습니다. 사용자 HMI 앱이 실행 중이면 그 앱이 화면을 차지하고, 미실행이면 접속 주소·장비 정보를 담은 안내 화면이 자동으로 떠 운영자가 폰으로 바로 관리에 들어올 수 있습니다.

MudBlazor — 현대적 컴포넌트 UI

MudBlazor 컴포넌트로 관리 콘솔 화면을 구성합니다. 스위치·표·알림·다이얼로그 같은 완성도 높은 부품을 그대로 가져다 쓰니, 관리 화면도 빠르고 일관되게 만듭니다.

SENVAS Touch 웹 관리 콘솔 — Blazor + MudBlazor로 만든 시스템 화면 웹 관리 콘솔(터치 관리 런처). .NET Blazor Server + MudBlazor로 만들었고, 상태는 SignalR로 실시간 갱신됩니다. HMI 앱이 아니라 관리 화면입니다. (실제 기기 화면 캡처)

터치 관리 런처 웹 스택 정리

기술역할
.NET 9 Blazor Server관리 런처·콘솔을 C# 한 언어로, 가벼운 서버 렌더링
SignalR (WebSocket)실시간 양방향 — 새로고침 없는 상태 갱신
Kestrel기기 내장 웹서버
Chromium 키오스크부팅 즉시 전체화면
MudBlazor현대적 콘솔 UI

다시 짚으면 — 웹으로 만든 건 HMI가 아니라, 그 HMI를 띄우고 관리하는 런처·콘솔입니다. 덕분에 관리 기능을 더하거나 바꾸는 일이 빠릅니다. 원격 접속에 쓰인 VPN 기술은 센바스 터치에 적용된 VPN 기술에서 이어집니다.

.NET 9 Blazor Server 하나로 현장 안내 화면·웹 관리 콘솔·원격 접속을 모두 덮은 것이 이 런처의 핵심입니다.

문의