Hull Shape Analysis Interface

Interactive frontend for analyzing and optimizing ship hull shapes. Includes 3D hull upload/preview, hydrostatics, resistance, power, weight, comfort, structural views, plus an optimization workspace ready to talk to a Python backend (deep learning and surrogate models).

Project structure

• src/
  • components/ – UI views (analysis tabs, optimization workspace, sidebar, etc.)
  • services/ – API hooks/services (e.g., optimizationService.ts mock)
  • types/ – shared TypeScript types for hull stats and optimization
  • utils/ – helpers (e.g., loadHullMesh.ts for Three.js loading)
  • main.tsx, App.tsx, index.css – app entry and layout shell
• public/ – static assets (if added)
• vite.config.ts – Vite config
• package.json, package-lock.json – dependencies and lockfile
• build/ – production build output (do not edit by hand)

Getting started

npm install
npm run dev        # start Vite dev server

Open the printed localhost URL to use the app. Upload a hull mesh, explore analysis tabs, or switch to the Optimization workspace.

Build for production

npm run build      # outputs to /build

Serve the static build/ directory with any static file server.

Backend integration

• Frontend calls are isolated in src/services/optimizationService.ts. Swap the mock implementation with real endpoints when your Python backend is ready.
• Expose your API URL via an env var (e.g., VITE_API_URL=http://localhost:8000) and use it in the service layer.

Notes

• Keep package-lock.json committed for reproducible installs.
• Ignore node_modules/ and build artifacts in git.