VIENCE DataHub main screenshot

VIENCE DataHub

Note: Currently in closed beta service, so the images above have been reconstructed using AI.

TypeScriptReactZustandTailwindCSSVitestViteGitHub ActionsHuskylint-staged

Project Overview

At medical AI startup VIENCE, developed a cloud-based service for managing and processing large-scale pathology image data using React and TypeScript.

This internal service supports over 1,000 SVS (slide image) files and enables pathology researchers and medical staff at university hospitals to manage files and process data efficiently.

Key Contributions and Achievements

Frontend Development

  • Built a file management interface with features such as drag-and-drop upload, folder CRUD operations, and both list and grid views to support seamless organization of large-scale pathology datasets
  • Implemented performant UI logic to render deeply nested directory structures and dynamically display metadata for large files, ensuring smooth interaction even with thousands of entries

UI/UX and Accessibility Improvements

  • Designed a dark mode UI and improved accessibility to meet WCAG AAA color contrast standards
  • Implemented a responsive layout optimized for both desktop and mobile environments

Codebase Optimization

  • Refactored global and local state management using Zustand → Reduced complexity and improved maintainability
  • Removed 35+ deprecated packages and resolved 110+ security issues from legacy code
  • Migrated from CRA to Vite → Achieved 82% faster build time (from 110s to 20s)

DevOps and Test Automation

  • Set up a CI/CD pipeline using GitHub Actions → Streamlined deployment process (10 steps → 1 step)
  • Resolved over 2,200 lint, test, compile, and build errors across the codebase
  • Enforced code style consistency with Husky + lint-staged at commit time
  • Adopted Vitest to introduce unit tests and reduce reliance on manual QA

Collaboration and Team Leadership

  • Co-led sprint planning with the CTO to deliver the beta version within 4 weeks
  • Conducted internal dev seminars and authored dev wiki documentation to share architectural decisions and coding conventions

Project Results

  • Launched a high-resolution pathology data service tailored to the needs of medical researchers and practitioners
  • Resolved legacy technical debt and dramatically improved developer experience and release stability
  • As a junior developer, gained hands-on experience in the full E2E cycle — from planning and design to development and deployment