@akanjs/cli 0.0.148 → 0.0.150

package/cjs/src/templates/workspaceRoot/README.md.template

@@ -0,0 +1,37 @@
+## Get Started
+
+Run the code below.
+
+```
+npm run downloadEnv # Need to register your public key
+
+npm i -g akan pnpm
+
+pnpm i
+
+cat <<EOF >> .env
+# organization configuration, no need to change
+NEXT_PUBLIC_REPO_NAME=<%= repoName %>
+NEXT_PUBLIC_SERVE_DOMAIN="<%= serveDomain %>"
+
+# development branch, debug, develop, main, etc. mainly it changes databases.
+NEXT_PUBLIC_ENV=debug
+
+# local, cloud, edge it changes the connection point of the clients.
+NEXT_PUBLIC_OPERATION_MODE=local
+# hybrid app specific config, will be depreciated in the future
+APP_OPERATION_MODE=local
+
+# backend service mode, federation, batch, all
+SERVER_MODE=federation
+
+# analyze the bundle size
+ANALYZE=false
+
+# log level, debug, info, warn, error
+NEXT_PUBLIC_LOG_LEVEL=debug
+EOF
+
+akan serve-backend <%= appName %>
+# or akan serve-frontend <%= appName %>, etc
+```

package/cjs/src/templates/workspaceRoot/eslint.config.ts.template

@@ -0,0 +1,3 @@
+import { eslintConfig } from "@akanjs/lint";
+
+export default eslintConfig;

package/cjs/src/templates/workspaceRoot/package.json.template

@@ -0,0 +1,43 @@
+{
+  "name": "<%= repoName %>",
+  "description": "<%= repoName %> workspace",
+  "version": "0.0.1",
+  "dependencies": {
+    "next": "15.3.2",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
+    "tailwindcss": "^4.1.7",
+    "daisyui": "^5.0.35"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "^4.1.7",
+    "@types/react": "18.3.1",
+    "@types/react-dom": "18.3.1",
+    "crypto-browserify": "^3.12.1",
+    "eslint": "^9.19.0",
+    "https-browserify": "^1.0.0",
+    "jest": "^29.7.0",
+    "jiti": "^2.4.2",
+    "os-browserify": "^0.3.0",
+    "prettier": "^3.5.3",
+    "prettier-plugin-tailwindcss": "^0.6.11",
+    "process": "^0.11.10",
+    "stream-browserify": "^3.0.0",
+    "stream-http": "^3.2.0",
+    "tailwind-scrollbar": "4.0.2",
+    "tailwindcss-animation-delay": "^2.0.2",
+    "tailwindcss-radix": "^4.0.2",
+    "ts-jest": "^29.3.4",
+    "url-polyfill": "^1.1.13",
+    "vite": "^6.3.5",
+    "vite-plugin-commonjs": "^0.10.4",
+    "vite-plugin-node-polyfills": "^0.23.0",
+    "vite-tsconfig-paths": "^5.1.4",
+    "vm-browserify": "^1.1.2"
+  },
+  "packageManager": "pnpm@10.11.0",
+  "engines": {
+    "node": ">=22",
+    "pnpm": ">=10"
+  }
+}

package/cjs/src/templates/workspaceRoot/tsconfig.json.template

@@ -0,0 +1,29 @@
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "rootDir": ".",
+    "sourceMap": true,
+    "declaration": false,
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "experimentalDecorators": true,
+    "noPropertyAccessFromIndexSignature": false,
+    "importHelpers": false,
+    "target": "es2022",
+    "module": "esnext",
+    "types": ["node", "webpack-env", "vite/client", "kakao.maps.d.ts", "jest"],
+    "lib": ["es2017", "dom", "webworker"],
+    "skipLibCheck": true,
+    "skipDefaultLibCheck": true,
+    "strictNullChecks": true,
+    "baseUrl": ".",
+    "jsx": "preserve",
+    "resolveJsonModule": true,
+    "paths": {
+      "@/*": ["*"]
+    }
+  },
+  "exclude": ["**/node_modules", "tmp", "**/ios", "**/android"]
+}

package/esm/index.js

@@ -3170,6 +3170,8 @@ ${fileCheck.lintResult.message}`
 import * as esbuild from "esbuild";
 import { dtsPlugin } from "esbuild-plugin-d.ts";
 import fs13 from "fs";
+var assetExtensions = [".css", ".md", ".js", ".png", ".ico", ".svg", ".json", ".template"];
+var assetLoader = Object.fromEntries(assetExtensions.map((ext) => [ext, "copy"]));
 var Builder = class {
   #executor;
   #distExecutor;
@@ -3194,7 +3196,7 @@ var Builder = class {
       format,
       outdir: `${this.#distExecutor.cwdPath}/${format}`,
       logLevel: "error",
-      loader: { ".template": "copy", ".md": "copy" }
+      loader: assetLoader
     };
   }
   #getAssetBuildOptions() {
@@ -3208,7 +3210,7 @@ var Builder = class {
       ],
       outdir: this.#distExecutor.cwdPath,
       logLevel: "error",
-      loader: { ".css": "copy", ".md": "copy", ".js": "copy" }
+      loader: assetLoader
     };
   }
   async build(options = {}) {
@@ -3424,7 +3426,7 @@ var LibraryScript = class {
 };
 
 // pkgs/@akanjs/cli/src/application/application.runner.ts
-import { confirm as confirm2, input as input4 } from "@inquirer/prompts";
+import { confirm as confirm2, input as input4, select as select5 } from "@inquirer/prompts";
 import { StringOutputParser } from "@langchain/core/output_parsers";
 import { PromptTemplate as PromptTemplate2 } from "@langchain/core/prompts";
 import { RunnableSequence as RunnableSequence2 } from "@langchain/core/runnables";
@@ -3469,6 +3471,34 @@ var ApplicationRunner = class {
     await app.syncAssets(scanResult.akanConfig.libs);
     return scanResult;
   }
+  async getScriptFilename(app) {
+    if (!app.exists("scripts")) {
+      app.mkdir("scripts");
+      throw new Error(`No script files found. make a script file in apps/${app.name}/scripts folder`);
+    }
+    const scriptFiles = (await app.readdir("scripts")).filter((file) => file.endsWith(".ts"));
+    const scriptFile = await select5({
+      message: "Select script to run",
+      choices: scriptFiles.map((file) => ({ name: file, value: file.replace(".ts", "") }))
+    });
+    return scriptFile;
+  }
+  async runScript(app, filename) {
+    const buildResult = await esbuild2.build({
+      write: true,
+      entryPoints: [`${app.cwdPath}/scripts/${filename}.ts`],
+      bundle: true,
+      format: "cjs",
+      packages: "external",
+      platform: "node",
+      outdir: `${app.cwdPath}/scripts`,
+      logLevel: "warning"
+    });
+    await app.spawn("node", [`scripts/${filename}.js`], {
+      stdio: "inherit",
+      env: this.#getEnv(app)
+    });
+  }
   #getEnv(app, env = {}) {
     const rootEnv = dotenv3.parse(app.workspace.readFile(".env"));
     return {
@@ -3536,10 +3566,10 @@ var ApplicationRunner = class {
       setTimeout(() => openBrowser("http://localhost:8080/backend/graphql"), 3e3);
     await app.dist.spawn("node", ["--watch", "backend/main.js"], { env, stdio: "inherit" });
   }
-  async buildFrontend(app) {
+  async buildFrontend(app, { spawnOptions } = {}) {
     const { env } = await this.#prepareCommand(app, "build", "frontend");
     const akanConfig = await app.getConfig("build");
-    await app.spawn("npx", ["next", "build", "--no-lint"], { env });
+    await app.spawn("npx", ["next", "build", "--no-lint"], { env, ...spawnOptions });
     const buildResult = await esbuild2.build({
       entryPoints: [`${app.cwdPath}/next.config.ts`],
       outdir: `${app.dist.cwdPath}/frontend`,
@@ -3947,6 +3977,11 @@ var ApplicationScript = class {
     spinner.succeed("Application scanned");
     return scanResult;
   }
+  async script(app, filename) {
+    const scriptFilename = filename ?? await this.#runner.getScriptFilename(app);
+    await this.syncApplication(app);
+    await this.#runner.runScript(app, scriptFilename);
+  }
   async build(app) {
     await this.syncApplication(app);
     await Promise.all([this.buildBackend(app, { sync: false }), this.buildFrontend(app, { sync: false })]);
@@ -3981,12 +4016,16 @@ var ApplicationScript = class {
       }
     });
   }
-  async buildFrontend(app, { sync = true } = {}) {
+  async buildFrontend(app, { sync = true, standalone = false } = {}) {
     if (sync)
       await this.syncApplication(app);
-    const spinner = app.spinning("Building frontend...");
-    await this.#runner.buildFrontend(app);
-    spinner.succeed(`Frontend built in dist/apps/${app.name}/frontend`);
+    if (standalone)
+      await this.#runner.buildFrontend(app, { spawnOptions: { stdio: "inherit" } });
+    else {
+      const spinner = app.spinning("Building frontend...");
+      await this.#runner.buildFrontend(app);
+      spinner.succeed(`Frontend built in dist/apps/${app.name}/frontend`);
+    }
   }
   async startFrontend(app, { open: open2 = false, turbo = false, sync = true } = {}) {
     if (sync)
@@ -4113,6 +4152,9 @@ var ApplicationCommand = class {
   async syncApplication(app) {
     await this.applicationScript.syncApplication(app);
   }
+  async script(app, filename) {
+    await this.applicationScript.script(app, filename);
+  }
   async build(app) {
     await this.applicationScript.build(app);
   }
@@ -4120,7 +4162,7 @@ var ApplicationCommand = class {
     await this.applicationScript.buildBackend(app);
   }
   async buildFrontend(app) {
-    await this.applicationScript.buildFrontend(app);
+    await this.applicationScript.buildFrontend(app, { standalone: true });
   }
   async buildCsr(app) {
     await this.applicationScript.buildCsr(app);
@@ -4194,6 +4236,11 @@ __decorateClass([
   Target.Public(),
   __decorateParam(0, App())
 ], ApplicationCommand.prototype, "syncApplication", 1);
+__decorateClass([
+  Target.Public(),
+  __decorateParam(0, App()),
+  __decorateParam(1, Argument("filename", { desc: "name of script", nullable: true }))
+], ApplicationCommand.prototype, "script", 1);
 __decorateClass([
   Target.Public({ short: true }),
   __decorateParam(0, App())
@@ -4344,7 +4391,7 @@ var PackageRunner = class {
     if (pkg.name === "@akanjs/cli")
       await builder.build({
         bundle: true,
-        additionalEntryPoints: [`${pkg.cwdPath}/src/templates/**/*.ts`, `${pkg.cwdPath}/src/guidelines/**/*.md`]
+        additionalEntryPoints: [`${pkg.cwdPath}/src/templates/**/*`, `${pkg.cwdPath}/src/guidelines/**/*`]
       });
     else
       await builder.build();
@@ -5462,7 +5509,7 @@ var WorkspaceCommand = class {
 __decorateClass([
   Target.Public(),
   __decorateParam(0, Argument("workspaceName", { desc: "what is the name of your organization?" })),
-  __decorateParam(1, Option("app", { desc: "describe your first application to create " })),
+  __decorateParam(1, Option("app", { desc: "what is the codename of your first application? (e.g. myapp)" })),
   __decorateParam(2, Option("dir", { desc: "directory of workspace", default: process.env.USE_AKANJS_PKGS === "true" ? "local" : "." }))
 ], WorkspaceCommand.prototype, "createWorkspace", 1);
 __decorateClass([

package/esm/src/guidelines/___library/sharedUiStructureDescription.en.md

@@ -559,24 +559,6 @@ Key features:
 - Simultaneous Korean/English address provision
 - Modal address search
 
-### 26. Field.KoreanCityDistrict
-
-\`\`\`typescript
-interface KoreanCityDistrictProps {
-city: string | null;
-onChangeCity: (city: string | null) => void;
-district: string | null;
-onChangeDistrict: (district: string | null) => void;
-disabled?: boolean;
-}
-\`\`\`
-Key features:
-
-- Hardcoded Korean region data
-- Two-level selection (city/province → district/county)
-- Includes detailed regions: 25 districts in Seoul, 16 in Busan, etc.
-- Linked selection (district activates after city selection)
-
 ## Common Patterns and Features
 
 ### 1. Caching System

package/esm/src/guidelines/componentRule/componentRule.generate.json

@@ -0,0 +1,131 @@
+{
+  "title": "Component Rule",
+  "description": "Comprehensive guidelines for creating React components in the Akan.js framework",
+  "scans": [
+    {
+      "type": "source",
+      "description": "Cookie management utilities for web and mobile",
+      "path": "pkgs/@akanjs/client/src/cookie.ts"
+    },
+    {
+      "type": "source",
+      "description": "Storage utilities for persistent data",
+      "path": "pkgs/@akanjs/client/src/storage.ts"
+    },
+    {
+      "type": "source",
+      "description": "Device capabilities and platform detection",
+      "path": "pkgs/@akanjs/client/src/device.ts"
+    },
+    {
+      "type": "source",
+      "description": "Navigation and routing utilities",
+      "path": "pkgs/@akanjs/client/src/router.ts"
+    },
+    {
+      "type": "source",
+      "description": "Type utilities including clsx for class management",
+      "path": "pkgs/@akanjs/client/src/types.ts"
+    },
+    {
+      "type": "example",
+      "description": "Unit components (list items/cards)",
+      "path": "{apps,libs}/*/lib/*/*.Unit.tsx",
+      "sample": 3
+    },
+    {
+      "type": "example",
+      "description": "View components (detailed displays)",
+      "path": "{apps,libs}/*/lib/*/*.View.tsx",
+      "sample": 3
+    },
+    {
+      "type": "example",
+      "description": "Template components (forms/edit screens)",
+      "path": "{apps,libs}/*/lib/*/*.Template.tsx",
+      "sample": 3
+    },
+    {
+      "type": "example",
+      "description": "Utility components (toolbars/helpers)",
+      "path": "{apps,libs}/*/lib/*/*.Util.tsx",
+      "sample": 3
+    },
+    {
+      "type": "example",
+      "description": "Zone components (data containers)",
+      "path": "{apps,libs}/*/lib/*/*.Zone.tsx",
+      "sample": 3
+    },
+    {
+      "type": "example",
+      "description": "Reusable UI components",
+      "path": "{libs,apps}/*/ui/**/*.tsx",
+      "sample": 5
+    },
+    {
+      "type": "usage",
+      "description": "Component composition patterns",
+      "path": "{apps,libs}/*/lib/*/*.Zone.tsx",
+      "filterText": "renderItem",
+      "sample": 3
+    },
+    {
+      "type": "usage",
+      "description": "Form state management with stores",
+      "path": "{apps,libs}/*/lib/*/*.Template.tsx",
+      "filterText": "st.use",
+      "sample": 3
+    },
+    {
+      "type": "usage",
+      "description": "Conditional rendering with TailwindCSS",
+      "path": "{apps,libs}/*/lib/*/*.tsx",
+      "filterText": "clsx",
+      "sample": 3
+    },
+    {
+      "type": "usage",
+      "description": "Data fetching with Load components",
+      "path": "{apps,libs}/*/lib/*/*.Zone.tsx",
+      "filterText": "<Load.",
+      "sample": 3
+    },
+    {
+      "type": "usage",
+      "description": "Responsive design patterns",
+      "path": "{apps,libs}/*/lib/*/*.tsx",
+      "filterText": "md:",
+      "sample": 3
+    }
+  ],
+  "update": {
+    "filePath": "./componentRule.instruction.md",
+    "contents": [
+      "Component Architecture - Core structure and organization",
+      "Component Types - Purpose and responsibility of each component type",
+      "File Naming Conventions - Standardized naming patterns",
+      "Utility Functions - Core framework utilities",
+      "Best Practices - Guidelines for components",
+      "State Management - Integration with Zustand store and signals",
+      "Responsive Design - Mobile-first approach",
+      "Accessibility - Core principles",
+      "Performance Optimization - Memoization and lazy loading",
+      "Data Fetching - Using Load components",
+      "Composition Patterns - Component rendering methods",
+      "Complete Examples - Full implementation examples"
+    ],
+    "rules": [
+      "Component types (.Unit, .View, .Template, .Util, .Zone) should follow standard patterns and responsibilities",
+      "Every component file should maintain a consistent organization pattern with logical sections",
+      "Responsive design should use Tailwind's mobile-first approach with sm:, md:, lg: prefixes",
+      "Form components should use the framework state management pattern with st.use and st.do",
+      "Data containers should follow the Load.Units/Load.View pattern for consistent data fetching",
+      "Component files should export named components rather than default exports",
+      "Props should use explicit TypeScript interfaces with proper JSDoc comments where helpful",
+      "Separate business logic from presentation components",
+      "Follow Akan.js project structure and module organization"
+    ]
+  },
+  "page": "/[lang]/akanjs/(docs)/docs/codebase/component/page.tsx"
+}

package/esm/src/guidelines/cssRule/cssRule.generate.json

@@ -0,0 +1,93 @@
+{
+  "title": "CSS Rule with TailwindCSS and DaisyUI",
+  "description": "Comprehensive guidelines for creating CSS with TailwindCSS and DaisyUI in the Akan.js framework",
+  "scans": [
+    {
+      "type": "source",
+      "description": "clsx utility for class name management",
+      "path": "pkgs/@akanjs/client/src/types.ts"
+    },
+    {
+      "type": "example",
+      "description": "Unit components (list items/cards)",
+      "path": "{apps,libs}/*/lib/*/*.Unit.tsx",
+      "sample": 3
+    },
+    {
+      "type": "example",
+      "description": "View components (detailed displays)",
+      "path": "{apps,libs}/*/lib/*/*.View.tsx",
+      "sample": 3
+    },
+    {
+      "type": "example",
+      "description": "Edit components (forms for data creation/editing)",
+      "path": "{apps,libs}/*/lib/*/*.Edit.tsx",
+      "sample": 2
+    },
+    {
+      "type": "example",
+      "description": "Util components (special function components)",
+      "path": "{apps,libs}/*/lib/*/*.Util.tsx",
+      "sample": 2
+    },
+    {
+      "type": "example",
+      "description": "Zone components (container components)",
+      "path": "{apps,libs}/*/lib/*/*.Zone.tsx",
+      "sample": 2
+    },
+    {
+      "type": "example",
+      "description": "Reusable UI components",
+      "path": "{libs,apps}/*/ui/**/*.tsx",
+      "sample": 3
+    },
+    {
+      "type": "usage",
+      "description": "Conditional rendering with clsx",
+      "path": "{apps,libs}/*/lib/*/*.tsx",
+      "filterText": "clsx",
+      "sample": 3
+    },
+    {
+      "type": "usage",
+      "description": "DaisyUI color usage",
+      "path": "{apps,libs}/*/lib/*/*.tsx",
+      "filterText": "bg-primary|bg-secondary|bg-accent|bg-info|bg-success|bg-warning|bg-error",
+      "sample": 3
+    },
+    {
+      "type": "usage",
+      "description": "Responsive design patterns",
+      "path": "{apps,libs}/*/lib/*/*.tsx",
+      "filterText": "sm:|md:|lg:|xl:|2xl:",
+      "sample": 3
+    }
+  ],
+  "update": {
+    "filePath": "./cssRule.instruction.md",
+    "contents": [
+      "Core Principles - Fundamental styling concepts",
+      "Class Management with clsx - How to handle conditional class names",
+      "Component Structure Best Practices - Consistent component styling",
+      "Component Types in Akan.js - Styling patterns for different component types",
+      "Common UI Patterns - Reusable design patterns",
+      "Best Practices - Guidelines for maintainable CSS",
+      "Common Mistakes to Avoid - What not to do",
+      "Troubleshooting - Fixing common issues"
+    ],
+    "rules": [
+      "clsx should be used for conditional class names and className composition",
+      "Every component should accept and properly handle className prop for composition",
+      "Color system of DaisyUI should be used for colors (primary, secondary, accent, etc.) - hardcoded colors should be avoided",
+      "Components should follow responsive design principles with mobile-first approach",
+      "Use Tailwind's spacing scale consistently for margins and padding",
+      "Group related classes together for better readability",
+      "DaisyUI components should be used for common UI elements when available",
+      "Apply proper focus, hover, and active states for interactive elements",
+      "Respect the naming conventions for component types (Unit, View, Edit, Util, Zone)"
+    ]
+  },
+  "page": "/[lang]/akanjs/(docs)/docs/codebase/css/page.tsx"
+}

package/esm/src/guidelines/databaseModule/databaseModule.generate.json

@@ -0,0 +1,51 @@
+{
+  "title": "Database Module",
+  "description": "Structure of database module",
+  "scans": [
+    {
+      "type": "source",
+      "description": "core database module source code",
+      "path": "pkgs/@akanjs/server/src/module.ts"
+    },
+    {
+      "type": "source",
+      "description": "how to boot modules in Nest.js server",
+      "path": "pkgs/@akanjs/server/src/boot.ts"
+    },
+    {
+      "type": "source",
+      "description": "constant model decorators, database schema decorators, signal decorators reference",
+      "path": "pkgs/@akanjs/constant/src/decorator.ts"
+    },
+    {
+      "type": "example",
+      "description": "example database module of admin",
+      "path": "libs/shared/lib/admin/*"
+    }
+  ],
+  "update": {
+    "filePath": "./databaseModule.instruction.md",
+    "contents": [
+      "Purpose of database modules in Akan.js",
+      "File structure and location conventions",
+      "How to create database modules",
+      "How to use database modules in Nest.js server",
+      "How to use components, stores, and signals in client side",
+      "Real-time features with websockets and subscriptions",
+      "Best practices for data modeling and schema design",
+      "Authentication and authorization patterns",
+      "Performance optimization techniques",
+      "Error handling strategies"
+    ],
+    "rules": [
+      "Database module is a domain specific module to manage business logic of database",
+      "Follow consistent naming conventions with PascalCase for classes and camelCase for files",
+      "Keep business logic in service files, not in signals or documents",
+      "Use field validation in constant models to ensure data integrity",
+      "Create proper indexes in middleware for performance optimization",
+      "Apply appropriate authorization guards to protect sensitive operations",
+      "Use dictionary files for all UI text to support internationalization"
+    ]
+  },
+  "page": "/[lang]/akanjs/(docs)/docs/module/overview/page.tsx"
+}

package/esm/src/guidelines/docPageRule/docPageRule.generate.json

@@ -0,0 +1,72 @@
+{
+  "title": "How to create doc page",
+  "description": "How to create documentation page of Akan.js framework",
+  "scans": [
+    {
+      "type": "example",
+      "description": "Example of a system architecture documentation page",
+      "path": "apps/angelo/app/[lang]/akanjs/(docs)/docs/systemArch/frontend/page.tsx"
+    },
+    {
+      "type": "example",
+      "description": "Example of a module documentation page with API reference",
+      "path": "apps/angelo/app/[lang]/akanjs/(docs)/docs/module/signal/page.tsx"
+    },
+    {
+      "type": "source",
+      "description": "Documentation utility components",
+      "path": "apps/angelo/ui/Docs/index.ts"
+    },
+    {
+      "type": "source",
+      "description": "Code snippet component for syntax highlighting",
+      "path": "apps/angelo/ui/Docs/CodeSnippet.tsx"
+    },
+    {
+      "type": "source",
+      "description": "Title component for main headings",
+      "path": "apps/angelo/ui/Docs/Title.tsx"
+    },
+    {
+      "type": "source",
+      "description": "Description component for explanatory text",
+      "path": "apps/angelo/ui/Docs/Description.tsx"
+    },
+    {
+      "type": "source",
+      "description": "Option table component for displaying parameters",
+      "path": "apps/angelo/ui/Docs/OptionTable.tsx"
+    },
+    {
+      "type": "source",
+      "description": "Introduction table component for listing features",
+      "path": "apps/angelo/ui/Docs/IntroTable.tsx"
+    }
+  ],
+  "update": {
+    "filePath": "./docPageRule.instruction.md",
+    "contents": [
+      "Purpose of doc page in Akan.js",
+      "How to create doc page",
+      "Page organization and structure",
+      "Utility components",
+      "Best practices for documentation",
+      "Internationalization guidelines",
+      "Code example guidelines",
+      "Complete example implementation",
+      "Troubleshooting common issues"
+    ],
+    "rules": [
+      "Docs.Layout is already set on the top of layout.tsx file in the root of the project, so you don't need to use it in your page",
+      "Docs utility should be used with `Docs` prefix, like <Docs.Title>, do not use object destructuring",
+      "Always wrap user-facing text in l.trans() with at least English and Korean translations",
+      "Use a logical hierarchy of headings (Title → SubTitle → SubSubTitle)",
+      "Include a divider (<div className=\"divider\"></div>) between major sections",
+      "For long pages, use anchor links with hidden divs for navigation",
+      "Code examples should be realistic and include proper comments",
+      "Tables should use the appropriate type (OptionTable for parameters, IntroTable for features)",
+      "Always specify the correct language for CodeSnippet components"
+    ]
+  },
+  "page": "/[lang]/akanjs/(docs)/docs/[category]/[pageName]/page"
+}