MultiPortfolio

An explorable multiplayer portfolio, built with Bun, React, and React Three Fiber. Visitors arrive at a live miniature island, choose a companion, and discover five project buildings, an about terrace, and a hidden ticket.

Run

bun install
bun run dev

Open http://localhost:3000. The same Bun server handles the application, WebSocket presence, and SSH terminal portfolio. Both experiences share project content and show connected Web and SSH visitors.

For local development, set SSH_HOST_KEY_PATH to the existing private host key. The SSH listener uses SSH_PORT (default 2222); HTTP uses PORT (default 3000). Connect with ssh -p 2222 visitor@localhost. The public ssh username@jokinsuares.fr route on port 22 should forward to this SSH listener. Keep the host key outside Git and retain the existing key when deploying so returning visitors see the same fingerprint. An encrypted key can use SSH_HOST_KEY_PASSPHRASE (the legacy key defaults to password). The contact form uses DISCORD_WEBHOOK_URL and DISCORD_USER_ID.

In SSH, click the top menu or use A, P, C, or V to switch sections. Use the mouse wheel or arrow keys to scroll, and click Quit or press Q/Ctrl+C to leave. SSH usernames appear in the public visitor lists. Connect as contact to send a message; click fields and Submit, or use Tab and Enter. Mouse controls require a terminal with SGR mouse support; keyboard controls remain available.

Docker Compose

Keep the original host.key in this directory with mode 0600, readable by UID 1000 (the container's bun user). Put the Discord settings in an ignored .env file using .env.example as a template. Then run docker compose up -d --build.

Compose publishes HTTP on host port 3000 and SSH on host port 6669 by default, preserving the prior SSH backend port. Set HTTP_PUBLISHED_PORT or SSH_PUBLISHED_PORT in .env if needed. The existing public port 22 route should forward to host port 6669. The SSH key is mounted read-only and excluded from the image.

Explore

• Click or tap open ground to walk around obstacles.
• Use WASD, ZQSD, or arrow keys for screen-relative movement.
• Click district labels or the destination bar to read about the work without joining.
• Press E near a place to discover it. Escape closes dialogs.
• Use the zoom buttons and the station button to navigate.
• Open the help button to reduce ambient motion. System reduced-motion preferences are respected automatically.

The island, buildings, train, and animated companions are procedural assets: no Blender exports or external 3D downloads are needed. Typography uses Google Fonts with local fallbacks. Shared project copy and outbound links live in src/shared/portfolio.ts; island positions and building metadata live in src/shared/world.ts.

Validation

bun run typecheck
bun test
bun build index.html --outdir /tmp/multiportfolio-build

Navigation tests cover reachable destinations, collision avoidance, and routing around the station. The interface includes native modal focus handling, responsive mobile layouts, a 3D error fallback, and automatic presence reconnection.