@bleedingdev/modern-js-create 3.2.0-ultramodern.11 → 3.2.0-ultramodern.110

package/template/README.md

@@ -1,10 +1,16 @@
 # UltraModern.js 3.0 Starter
 
+This generated app is a simple UltraModern.js starting point. It gives one app
+with localized routes, production URL metadata, optional BFF support, Rstest,
+Oxlint, oxfmt, and a local contract check. You can build a useful product here
+without deleting fake product areas, shell packages, or deployment topology.
+
 ## Setup
 
 Install the dependencies:
 
 ```bash
+mise install
 pnpm install
 ```
 
@@ -19,61 +25,87 @@ pnpm dev
 Build the app for production:
 
 ```bash
-pnpm build
+MODERN_PUBLIC_SITE_URL=https://example.com pnpm build
 ```
 
-Validate the generated Ultramodern preset contract locally:
+Preview the production build locally:
 
 ```bash
-pnpm run ultramodern:check
+pnpm serve
 ```
 
-The generated preset defaults are opt-out. Disable specific contracts via env vars:
+Run the local gates before treating the scaffold as ready:
 
 ```bash
-MODERN_BASELINE_ENABLE_MF_SSR=false
-MODERN_BASELINE_ENABLE_BFF_REQUEST_ID=false
-MODERN_BASELINE_ENABLE_TELEMETRY_EXPORTERS=false
+pnpm run ultramodern:check
+MODERN_PUBLIC_SITE_URL=https://example.com pnpm run build
 ```
 
-The generated starter also includes `.github/workflows/ultramodern-gates.yml`.
-That workflow runs `pnpm run ultramodern:check` and `pnpm run build` on every
-push and pull request so the `presetUltramodern(...)` contract stays explicit.
+## What You Get
 
-## Micro Vertical Workspaces
+The default app is intentionally monolith-friendly:
 
-Inside a Micro Vertical workspace, generate shell, remote, and service packages
-with `--sub` so the workspace root owns package-manager and CI policy:
+| Area | Starting Point |
+| --- | --- |
+| App routes | Locale-prefixed pages under `src/routes/[lang]` |
+| Copy | English and Czech resources in `config/public/locales` |
+| Web defaults | Local favicon/logo assets, localized metadata, semantic starter markup |
+| Styling | App-local CSS, with Tailwind files only when selected |
+| Server logic | Optional BFF entrypoints under `api/` |
+| Tests | Rstest smoke coverage in `tests/` |
+| Agent workflow | Generated `AGENTS.md`, hooks, and local quality gates |
 
-```bash
-npx @modern-js/create apps/shell --router tanstack --tailwind --workspace --sub
-npx @modern-js/create apps/remotes/catalog --router tanstack --tailwind --workspace --sub
-npx @modern-js/create apps/remotes/design-system --router tanstack --tailwind --workspace --sub
-npx @modern-js/create services/catalog-api --bff-runtime effect --workspace --sub
-```
+Keep feature code in the app while one team owns the workflow, release train,
+and operational behavior. Add ordinary workspace packages for shared tokens,
+small UI primitives, generated clients, or domain-neutral utilities when that
+keeps the app easier to understand.
 
-The canonical topology is documented in
-`docs/super-app-rfc-adr/WORKSPACE-0001-micro-vertical-workspace-scaffolding.md`.
-Shell packages own route assembly and topology selection, remote packages own
-route subtrees and degraded UI, service packages own Effect or explicit Hono
-contracts, and shared packages are limited to tokens, primitives, generated
-clients, or domain-neutral utilities.
+## Customize The App
 
-If the design system needs independent deployment, keep it as a horizontal
-Module Federation remote with the same topology, trust, SSR compatibility, and
-fallback rules as the vertical remotes. Do not add a second preset or a
-design-system-specific framework mode.
+Start with the generated page and replace the placeholder cards with your first
+real routes, actions, and API calls. Put user-visible text in
+`config/public/locales/<lang>/translation.json`, then render it through
+`react-i18next` or `@modern-js/plugin-i18n/runtime`.
 
-The public opinionated entrypoint is `presetUltramodern(...)`. It is the default
-UltraModern.js SuperApp surface for Effect, TanStack, SSR, BFF, and Micro
-Verticals.
+The starter keeps favicon and logo assets local in `config/favicon.svg` and
+`config/public/assets/ultramodern-logo.svg`. Replace those files when your app
+has product branding. The localized page title and description live in the same
+translation resources as the visible UI copy.
 
-Preview the production build locally:
+Tune the preset in `modern.config.ts`. Production builds require
+`MODERN_PUBLIC_SITE_URL` so canonical and `hreflang` URLs use your deployed
+origin. The local fallback is `http://localhost:8080`.
+
+The generated preset defaults are opt-out. Disable specific contracts via env
+vars when your app needs a softer lane:
 
 ```bash
-pnpm serve
+MODERN_BASELINE_ENABLE_MF_SSR=false
+MODERN_BASELINE_ENABLE_BFF_REQUEST_ID=false
+MODERN_BASELINE_ENABLE_TELEMETRY_EXPORTERS=false
 ```
 
+## Grow When Needed
+
+Stay in the single app until a boundary has a real owner and operational reason
+to split. A separate package is usually enough when you only need reusable code.
+Consider a larger workspace boundary later when a feature needs independent
+ownership, rollout, rollback, incident routing, or deployment evidence.
+
+The public opinionated entrypoint is `presetUltramodern(...)`. It keeps Effect,
+TanStack, SSR, BFF, i18n, and quality gates available without requiring a
+distributed app layout on day one.
+
+## Generated Automation
+
+The generated starter includes `.github/workflows/ultramodern-gates.yml` and
+`.github/renovate.json` for full app projects. The workflow runs
+`pnpm run ultramodern:check` and `pnpm run build` on every push and pull request
+with read-only permissions, commit-pinned actions, frozen installs, and
+StepSecurity audit-mode runner hardening. Renovate is configured for dependency
+dashboard review, one-day release age, grouped updates, action digest pinning,
+and manual approval for major upgrades.
+
 For more information, see the
 [UltraModern.js guide](https://bleedingdev.github.io/ultramodern.js/guides/get-started/ultramodern.html)
 and the [UltraModern.js documentation](https://bleedingdev.github.io/ultramodern.js/).

package/template/api/effect/index.ts.handlebars

@@ -4,18 +4,29 @@
   Layer,
   defineEffectBff,
 } from '@modern-js/plugin-bff/effect-server';
-import { bffEffectApi } from '../../shared/effect/api';
+import type { HttpApi, HttpApiGroup } from '@modern-js/plugin-bff/effect-server';
+import { bffEffectApi } from '../../shared/effect/api.ts';
 
-const greetingsLayer = HttpApiBuilder.group(bffEffectApi, 'greetings', (handlers) =>
-  handlers.handle('hello', () =>
-    Effect.succeed({
-      message: 'Hello from Effect HttpApi',
-      runtime: 'effect' as const,
-    }),
-  ),
+type ApiGroups<TApi> = TApi extends HttpApi.HttpApi<string, infer TGroups> ? TGroups : never;
+type GreetingsHandlers = HttpApiBuilder.Handlers.FromGroup<
+  HttpApiGroup.WithName<ApiGroups<typeof bffEffectApi>, 'greetings'>
+>;
+
+const greetingsLayer = HttpApiBuilder.group(
+  bffEffectApi,
+  'greetings',
+  (handlers: GreetingsHandlers) =>
+    handlers.handle('hello', () =>
+      Effect.succeed({
+        message: 'Hello from Effect HttpApi',
+        runtime: 'effect' as const,
+      }),
+    ),
 );
 
-const layer = HttpApiBuilder.layer(bffEffectApi).pipe(Layer.provide(greetingsLayer));
+const layer = HttpApiBuilder.layer(bffEffectApi).pipe(
+  Layer.provide(greetingsLayer),
+);
 
 export default defineEffectBff({
   api: bffEffectApi,

package/template/api/lambda/hello.ts.handlebars

@@ -1,6 +1,6 @@
-{{#if useHonoBff}}export default async () => {
-  return {
-    message: 'Hello from UltraModern.js BFF ({{bffRuntime}})',
-  };
-};
+{{#if useHonoBff}}const hello = () => ({
+  message: 'Hello from UltraModern.js BFF ({{bffRuntime}})',
+});
+
+export default hello;
 {{/if}}

package/template/config/favicon.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="UltraModern.js">
+  <rect width="64" height="64" rx="12" fill="#111827"/>
+  <path fill="#35d399" d="M14 17h9v21c0 5 3 8 9 8s9-3 9-8V17h9v22c0 11-8 18-18 18s-18-7-18-18V17Z"/>
+  <path fill="#ffffff" d="M28 17h8v25h-8z"/>
+</svg>

package/template/config/public/assets/ultramodern-logo.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 160" role="img" aria-label="UltraModern.js logo">
+  <rect width="160" height="160" rx="28" fill="#111827"/>
+  <path fill="#35d399" d="M42 36h22v56c0 22 14 34 36 34s36-12 36-34V36h22v57c0 35-24 57-58 57S42 128 42 93V36Z"/>
+  <path fill="#ffffff" d="M76 36h20v74H76z"/>
+  <path fill="#8be8ff" d="M112 36h18v74h-18z"/>
+</svg>

package/template/config/public/locales/cs/translation.json

@@ -0,0 +1,44 @@
+{
+  "home": {
+    "bff": {
+      "response": "Odpoved Effect HttpApi:"
+    },
+    "cards": {
+      "bff": {
+        "body": "Pridej serverovou logiku, kdyz route potrebuje typovana data nebo mutace.",
+        "title": "BFF + Effect"
+      },
+      "config": {
+        "body": "Upravuj vychozi hodnoty v modern.config.ts podle rustu aplikace.",
+        "title": "Konfigurace presetUltramodern"
+      },
+      "gates": {
+        "body": "Pred releasem spust ultramodern:check, testy, typecheck, lint a build.",
+        "title": "Ultramodern kontroly"
+      },
+      "guide": {
+        "body": "Zacni jednou aplikaci a pridej routy, API nebo balicky az kdyz pomuzou.",
+        "title": "UltraModern.js pruvodce"
+      }
+    },
+    "description": {
+      "afterConfig": "podle rustu aplikace a udrzuj",
+      "afterPreset": "profilem. Lad",
+      "end": "zelene pri pridavani rout, API a workspace balicku.",
+      "intro": "Zacni s verejnym"
+    },
+    "language": {
+      "cs": "Cestina",
+      "en": "Anglictina",
+      "switcher": "Jazyk"
+    },
+    "logoAlt": "Logo UltraModern.js",
+    "meta": {
+      "description": "Lokalizovany starter aplikace UltraModern.js se silnymi vychozimi hodnotami pro komplexni produkty.",
+      "title": "UltraModern.js Starter"
+    },
+    "name": "Jednoduchy starter aplikace",
+    "skipLink": "Preskocit na obsah",
+    "title": "UltraModern.js Starter"
+  }
+}

package/template/config/public/locales/en/translation.json

@@ -0,0 +1,44 @@
+{
+  "home": {
+    "bff": {
+      "response": "Effect HttpApi response:"
+    },
+    "cards": {
+      "bff": {
+        "body": "Add server logic when a route needs typed data or mutation handling.",
+        "title": "BFF + Effect"
+      },
+      "config": {
+        "body": "Tune generated defaults in modern.config.ts as the app grows.",
+        "title": "Configure presetUltramodern"
+      },
+      "gates": {
+        "body": "Run ultramodern:check, tests, typecheck, lint, and build before release.",
+        "title": "Ultramodern Gates"
+      },
+      "guide": {
+        "body": "Start with one app, then add routes, APIs, and packages when they help.",
+        "title": "UltraModern.js Guide"
+      }
+    },
+    "description": {
+      "afterConfig": "as the app grows, and keep",
+      "afterPreset": "profile. Tune",
+      "end": "green while you add routes, APIs, and workspace packages.",
+      "intro": "Start from the public"
+    },
+    "language": {
+      "cs": "Czech",
+      "en": "English",
+      "switcher": "Language"
+    },
+    "logoAlt": "UltraModern.js Logo",
+    "meta": {
+      "description": "A localized UltraModern.js app starter with strong defaults for complex products.",
+      "title": "UltraModern.js Starter"
+    },
+    "name": "Simple app starter",
+    "skipLink": "Skip to content",
+    "title": "UltraModern.js Starter"
+  }
+}

package/template/lefthook.yml

@@ -0,0 +1,10 @@
+pre-commit:
+  commands:
+    fix-and-check:
+      run: pnpm format && pnpm lint:fix && pnpm ultramodern:check
+      stage_fixed: true
+
+pre-push:
+  commands:
+    check:
+      run: pnpm ultramodern:check

package/template/modern.config.ts.handlebars

@@ -2,7 +2,8 @@
 import { appTools, defineConfig, presetUltramodern } from '@modern-js/app-tools';
 import path from 'node:path';
 {{#if enableBff}}import { bffPlugin } from '@modern-js/plugin-bff';
-{{/if}}{{#if isTanstackRouter}}import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
+{{/if}}import { i18nPlugin } from '@modern-js/plugin-i18n';
+{{#if isTanstackRouter}}import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
 {{/if}}
 const appId = process.env['MODERN_BASELINE_APP_ID'] || path.basename(process.cwd());
 const enableModuleFederationSSR = process.env['MODERN_BASELINE_ENABLE_MF_SSR'] !== 'false';
@@ -11,6 +12,18 @@ const enableTelemetryExporters =
   process.env['MODERN_BASELINE_ENABLE_TELEMETRY_EXPORTERS'] !== 'false';
 const telemetryFailLoudStartup = process.env['MODERN_TELEMETRY_FAIL_LOUD_STARTUP'] !== 'false';
 const otlpEndpoint = process.env['MODERN_TELEMETRY_OTLP_ENDPOINT'];
+const configuredSiteUrl = process.env['MODERN_PUBLIC_SITE_URL'];
+const hasConfiguredSiteUrl = typeof configuredSiteUrl === 'string' && configuredSiteUrl.length > 0;
+const isProductionBuild =
+  process.env['NODE_ENV'] === 'production' || process.argv.includes('build');
+
+if (isProductionBuild && !hasConfiguredSiteUrl) {
+  throw new Error(
+    'MODERN_PUBLIC_SITE_URL must be set for production builds so canonical and hreflang URLs use the deployed origin.',
+  );
+}
+
+const siteUrl = hasConfiguredSiteUrl ? configuredSiteUrl : 'http://localhost:8080';
 const victoriaMetricsEndpoint = process.env['MODERN_TELEMETRY_VICTORIA_ENDPOINT'];
 
 // https://bleedingdev.github.io/ultramodern.js/configure/app/usage.html
@@ -19,27 +32,46 @@ export default defineConfig(
     {
 {{#if enableBff}}      bff: {
 {{#if useEffectBff}}        effect: {
+          entry: './api/effect/index',
           openapi: true,
         },
 
 {{/if}}        runtimeFramework: '{{bffRuntime}}',
       },
 
-{{/if}}      plugins: [
+{{/if}}      html: {
+        meta: {
+          viewport: 'width=device-width, initial-scale=1.0, viewport-fit=cover',
+        },
+        title: 'UltraModern.js Starter',
+      },
+      plugins: [
         appTools(),
+        i18nPlugin({
+          localeDetection: {
+            fallbackLanguage: 'en',
+            languages: ['en', 'cs'],
+            localePathRedirect: true,
+          },
+        }),
 {{#if isTanstackRouter}}
         tanstackRouterPlugin(),
 {{/if}}{{#if enableBff}}
         bffPlugin(),
 {{/if}}      ],
+      source: {
+        globalVars: {
+          ULTRAMODERN_SITE_URL: siteUrl,
+        },
+      },
     },
     {
       appId,
       enableBffRequestId,
       enableModuleFederationSSR,
       enableTelemetryExporters,
-      telemetryFailLoudStartup,
       ...(typeof otlpEndpoint === 'string' ? { otlpEndpoint } : {}),
+      telemetryFailLoudStartup,
       ...(typeof victoriaMetricsEndpoint === 'string' ? { victoriaMetricsEndpoint } : {}),
     },
   ),

package/template/oxfmt.config.ts

@@ -3,6 +3,13 @@ import ultracite from 'ultracite/oxfmt';
 
 export default defineConfig({
   extends: [ultracite],
-  ignorePatterns: ['dist', 'node_modules', '.modern', '.modernjs', '**/routeTree.gen.ts'],
+  ignorePatterns: [
+    '.agents',
+    'dist',
+    'node_modules',
+    '.modern',
+    '.modernjs',
+    '**/routeTree.gen.ts',
+  ],
   singleQuote: true,
 });

package/template/oxlint.config.ts

@@ -8,5 +8,12 @@ export default defineConfig({
     node: true,
   },
   extends: [core, react],
-  ignorePatterns: ['dist', 'node_modules', '.modern', '.modernjs', '**/routeTree.gen.ts'],
+  ignorePatterns: [
+    '.agents',
+    'dist',
+    'node_modules',
+    '.modern',
+    '.modernjs',
+    '**/routeTree.gen.ts',
+  ],
 });

package/template/package.json.handlebars

@@ -1,62 +1,68 @@
 {
   "name": "{{packageName}}",
   "version": "0.1.0",
+  "private": true,
   "type": "module",
+  "packageManager": "pnpm@{{pnpmVersion}}",
   "scripts": {
     "reset": "npx rimraf node_modules ./**/node_modules",
     "dev": "modern dev",
     "build": "modern build",
     "serve": "modern serve",
+    "test": "rstest run",
     "typecheck": "node -e \"const fs = require('node:fs'); const { execFileSync, spawnSync } = require('node:child_process'); const bin = execFileSync('effect-tsgo', ['get-exe-path'], { encoding: 'utf8' }).trim(); if (process.platform !== 'win32') fs.chmodSync(bin, 0o755); const result = spawnSync(bin, ['--noEmit', '-p', 'tsconfig.json'], { stdio: 'inherit' }); process.exit(result.status ?? 1);\"",
+    "i18n:check": "node ./scripts/check-i18n-strings.mjs",
+{{#unless isSubproject}}
     "skills:install": "node ./scripts/bootstrap-agent-skills.mjs",
     "skills:check": "node ./scripts/bootstrap-agent-skills.mjs --check",
-    "ultramodern:check": "{{#unless isSubproject}}pnpm format:check && pnpm lint && {{/unless}}pnpm typecheck{{#unless isSubproject}} && pnpm skills:check{{/unless}} && node ./scripts/validate-ultramodern.mjs"{{#unless isSubproject}},
+    "postinstall": "oxfmt . && node ./scripts/bootstrap-agent-skills.mjs",
+{{/unless}}
+    "ultramodern:check": "pnpm format:check && pnpm lint && pnpm typecheck && pnpm i18n:check && pnpm test{{#unless isSubproject}} && pnpm skills:check{{/unless}} && node ./scripts/validate-ultramodern.mjs",
     "format": "oxfmt .",
     "format:check": "oxfmt --check .",
     "lint": "oxlint .",
-    "lint:fix": "oxlint . --fix",
-    "prepare": "simple-git-hooks"{{/unless}}
+    "lint:fix": "oxlint . --fix"
   },
   "dependencies": {
+    "@modern-js/plugin-i18n": "{{pluginI18nVersion}}",
 {{#if isTanstackRouter}}    "@modern-js/plugin-tanstack": "{{pluginTanstackVersion}}",
-{{/if}}    "@modern-js/runtime": "{{runtimeVersion}}",
-{{#if isTanstackRouter}}    "@tanstack/react-router": "1.170.1",
 {{/if}}
-    "react": "^19.2.3",
-    "react-dom": "^19.2.0"
+    "@modern-js/runtime": "{{runtimeVersion}}",
+{{#if isTanstackRouter}}    "@tanstack/react-router": "{{tanstackRouterVersion}}",
+{{/if}}
+    "i18next": "{{i18nextVersion}}",
+    "react": "{{reactVersion}}",
+    "react-dom": "{{reactDomVersion}}",
+    "react-i18next": "{{reactI18nextVersion}}"
   },
   "devDependencies": {
-    "@effect/tsgo": "0.7.3",
+    "@effect/tsgo": "{{effectTsgoVersion}}",
+    "@modern-js/adapter-rstest": "{{adapterRstestVersion}}",
     "@modern-js/app-tools": "{{appToolsVersion}}",
+    "@modern-js/create": "{{createVersion}}",
 {{#if enableBff}}    "@modern-js/plugin-bff": "{{pluginBffVersion}}",
 {{/if}}    "@modern-js/tsconfig": "{{tsconfigVersion}}",
+    "@rstest/core": "{{rstestCoreVersion}}",
 {{#if enableTailwind}}
-    "@tailwindcss/postcss": "^4.1.18",
+    "@tailwindcss/postcss": "^{{tailwindPostcssVersion}}",
 {{/if}}
     "@types/node": "^20",
-    "@types/react": "^19.1.8",
-    "@types/react-dom": "^19.1.6",
-    "@typescript/native-preview": "7.0.0-dev.20260518.1",
+    "@types/react": "{{typesReactVersion}}",
+    "@types/react-dom": "{{typesReactDomVersion}}",
+    "@typescript/native-preview": "{{typescriptNativePreviewVersion}}",
+    "happy-dom": "{{happyDomVersion}}",
 {{#unless isSubproject}}
-    "lint-staged": "~15.4.0",
-    "oxfmt": "0.50.0",
-    "oxlint": "1.65.0",
-{{/unless}}{{#if enableTailwind}}    "postcss": "^8.5.6",
-{{/if}}    "rimraf": "^6.0.1"{{#unless isSubproject}},
-    "simple-git-hooks": "^2.11.1"{{/unless}}{{#if enableTailwind}},
-    "tailwindcss": "^4.1.18"{{/if}}{{#unless isSubproject}},
-    "ultracite": "7.7.0"{{/unless}}
-  }{{#unless isSubproject}},
-  "simple-git-hooks": {
-    "pre-commit": "npx lint-staged"
+    "lefthook": "^2.1.9",
+{{/unless}}
+    "oxfmt": "{{oxfmtVersion}}",
+    "oxlint": "{{oxlintVersion}}",
+{{#if enableTailwind}}    "postcss": "{{postcssVersion}}",
+{{/if}}    "rimraf": "^6.1.3"{{#if enableTailwind}},
+    "tailwindcss": "^{{tailwindVersion}}"{{/if}},
+    "ultracite": "{{ultraciteVersion}}"
   },
-  "lint-staged": {
-    "*.{js,ts,cjs,mjs,d.cts,d.mts,jsx,tsx,json,jsonc}": [
-      "oxfmt --write",
-      "oxlint --fix"
-    ]
-  }{{/unless}},
   "engines": {
-    "node": ">=20"
+    "node": ">=20",
+    "pnpm": ">={{pnpmVersion}} <11.6.0"
   }
 }

package/template/pnpm-workspace.yaml

@@ -0,0 +1,34 @@
+minimumReleaseAge: 1440
+minimumReleaseAgeStrict: true
+minimumReleaseAgeIgnoreMissingTime: false
+minimumReleaseAgeExclude:
+  - '@bleedingdev/modern-js-*'
+  - '@tanstack/react-router'
+  - '@tanstack/router-core'
+  - '@typescript/native-preview'
+  - '@typescript/native-preview-*'
+  - '@types/react'
+trustPolicy: no-downgrade
+trustPolicyIgnoreAfter: 1440
+blockExoticSubdeps: true
+engineStrict: true
+pmOnFail: error
+verifyDepsBeforeRun: error
+strictDepBuilds: true
+
+allowBuilds:
+  '@swc/core': true
+  core-js: true
+  esbuild: true
+  lefthook: true
+  msgpackr-extract: true
+  sharp: true
+  workerd: true
+onlyBuiltDependencies:
+  - '@swc/core'
+  - core-js
+  - esbuild
+  - lefthook
+  - msgpackr-extract
+  - sharp
+  - workerd

package/template/rstest.config.mts

@@ -0,0 +1,5 @@
+import { defineConfig } from '@rstest/core';
+
+export default defineConfig({
+  testEnvironment: 'node',
+});