React template

The DockIY React template is a focused starting point for static React applications, with separate staging and production deployments already configured.

Stack

• React 19 and TypeScript for the application.
• Vite for local development and production builds.
• Tailwind CSS for styling.
• Caddy for static files, compression, asset caching, and single-page application routing.
• Docker Compose, Traefik, and the private DockIY registry for deployment.

The multi-stage production image builds the application with Node.js and pnpm, then copies only the generated dist files into an unprivileged Caddy image. Source code and the JavaScript toolchain stay out of the running container.

Run locally

Create a project with dockiy app init react my-app, or clone the template. Install Node.js 24+ and pnpm 11+, then run:

pnpm install --frozen-lockfile
pnpm dev

Vite runs at localhost:5173. Edit files under src/ and place static assets under public/.

Verify a production build before deploying:

pnpm build
pnpm preview

Configure deployment

The DockIY base stack must already be running. Set the app name, remote path, registry repository, hosts, and Compose project names in dockiy.yml. The VPS connection comes from the global DockIY config or a local dockiy.config.yml override.

	Staging	Production
Compose file	docker-compose.staging.yml	docker-compose.production.yml
Project	dockiy-react-staging	dockiy-react-production
Host	environments.staging.host	environments.production.host
Git tag	staging/v1.0.0-YYYYMMDD-01	prod/v1.0.0
Image tag	staging-v1.0.0-YYYYMMDD-01	production-v1.0.0

Each environment runs as a separate Compose project. Both connect to the DockIY reverse_proxy network, where Traefik handles HTTPS and routing.

Deploy

Commit the application, then deploy:

dockiy app deploy staging --version v1.0.0
dockiy app deploy production --version v1.0.0

After a production tag exists, staging can omit --version and reuse the highest production version. The CLI builds and pushes the image through an SSH tunnel, updates the selected Compose project, and verifies its healthcheck.

For the broader deployment model, see Deploying applications.