@prmvx/frontend-forge 0.1.0

package/dist/templates/architectures/next/feature/src/shared/components/layout/Header.tsx

@@ -0,0 +1,19 @@
+import Link from "next/link";
+import { Button } from "@/shared/components/common/Button";
+import { HOME_ROUTES } from "@/features/home/constants/routes";
+
+export function Header() {
+  return (
+    <header className="flex items-center justify-between border-b px-6 py-4">
+      <Link href={HOME_ROUTES.HOME} className="text-lg font-semibold">
+        Feature App
+      </Link>
+      <nav className="flex items-center gap-3">
+        <Link href={HOME_ROUTES.PROFILE} className="text-sm text-zinc-600">
+          Profile
+        </Link>
+        <Button>Explore</Button>
+      </nav>
+    </header>
+  );
+}

package/dist/templates/architectures/next/feature/src/shared/hooks/useDebounce.ts

@@ -0,0 +1,14 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+export function useDebounce<T>(value: T, delay = 300) {
+  const [debouncedValue, setDebouncedValue] = useState(value);
+
+  useEffect(() => {
+    const timer = setTimeout(() => setDebouncedValue(value), delay);
+    return () => clearTimeout(timer);
+  }, [value, delay]);
+
+  return debouncedValue;
+}

package/dist/templates/architectures/next/feature/src/shared/hooks/useToggle.ts

@@ -0,0 +1,15 @@
+"use client";
+
+import { useState } from "react";
+
+export function useToggle(defaultValue = false) {
+  const [value, setValue] = useState(defaultValue);
+
+  const toggle = () => setValue((prev) => !prev);
+
+  return {
+    value,
+    toggle,
+    setValue,
+  };
+}

package/dist/templates/architectures/next/feature/src/shared/providers/index.tsx

@@ -0,0 +1,8 @@
+"use client";
+
+import { ReactNode } from "react";
+import { ThemeProvider } from "./theme-provider";
+
+export function Providers({ children }: { children: ReactNode }) {
+  return <ThemeProvider>{children}</ThemeProvider>;
+}

package/dist/templates/architectures/next/feature/src/shared/providers/theme-provider.tsx

@@ -0,0 +1,7 @@
+"use client";
+
+import { ReactNode } from "react";
+
+export function ThemeProvider({ children }: { children: ReactNode }) {
+  return <div className="min-h-screen bg-white text-zinc-900">{children}</div>;
+}

package/dist/templates/architectures/next/feature/src/shared/utils/cn.ts

@@ -0,0 +1,3 @@
+export function cn(...classes: (string | undefined | false | null)[]) {
+  return classes.filter(Boolean).join(" ");
+}

package/dist/templates/architectures/next/feature/src/shared/utils/formatDate.ts

@@ -0,0 +1,7 @@
+export function formatDate(date: Date) {
+  return date.toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "long",
+    day: "numeric",
+  });
+}

package/dist/templates/architectures/next/standard/src/components/common/Button.tsx

@@ -0,0 +1,17 @@
+import { cn } from "@/utils/cn";
+
+type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+
+export function Button({ children, className, ...props }: ButtonProps) {
+  return (
+    <button
+      {...props}
+      className={cn(
+        "rounded-md bg-zinc-900 px-4 py-2 text-sm font-medium text-white transition hover:bg-zinc-700",
+        className
+      )}
+    >
+      {children}
+    </button>
+  );
+}

package/dist/templates/architectures/next/standard/src/components/home/HomeView.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import { useState } from "react";
+import { Header } from "@/components/layout/Header";
+import { Footer } from "@/components/layout/Footer";
+import { Button } from "@/components/common/Button";
+import { useToggle } from "@/hooks/useToggle";
+import { useDebounce } from "@/hooks/useDebounce";
+import { formatDate } from "@/utils/formatDate";
+
+export function HomeView() {
+  const { value, toggle } = useToggle();
+  const [query, setQuery] = useState("architecture");
+  const debouncedQuery = useDebounce(query);
+
+  return (
+    <div className="flex min-h-screen flex-col">
+      <Header />
+      <main className="mx-auto flex w-full max-w-3xl flex-1 flex-col gap-6 px-6 py-10">
+        <section className="space-y-2">
+          <p className="text-sm uppercase tracking-wide text-zinc-500">
+            Standard Architecture
+          </p>
+          <h1 className="text-3xl font-bold">A simple, connected starter</h1>
+          <p className="text-zinc-600">
+            Components, hooks, services, and utilities work together from day
+            one. Today is {formatDate(new Date())}.
+          </p>
+        </section>
+
+        <section className="rounded-lg border p-4">
+          <h2 className="mb-2 font-medium">Hook demo</h2>
+          <p className="mb-3 text-sm text-zinc-600">
+            Toggle state: {value ? "On" : "Off"}
+          </p>
+          <Button onClick={toggle}>Toggle with useToggle</Button>
+        </section>
+
+        <section className="rounded-lg border p-4">
+          <h2 className="mb-2 font-medium">Debounce demo</h2>
+          <input
+            className="mb-2 w-full rounded-md border px-3 py-2"
+            value={query}
+            onChange={(event) => setQuery(event.target.value)}
+            placeholder="Type to debounce"
+          />
+          <p className="text-sm text-zinc-600">Debounced: {debouncedQuery}</p>
+        </section>
+      </main>
+      <Footer />
+    </div>
+  );
+}

package/dist/templates/architectures/next/standard/src/components/layout/Footer.tsx

@@ -0,0 +1,9 @@
+import { formatDate } from "@/utils/formatDate";
+
+export function Footer() {
+  return (
+    <footer className="border-t px-6 py-4 text-sm text-zinc-500">
+      Built with Frontend Init · {formatDate(new Date())}
+    </footer>
+  );
+}

package/dist/templates/architectures/next/standard/src/components/layout/Header.tsx

@@ -0,0 +1,19 @@
+import Link from "next/link";
+import { Button } from "@/components/common/Button";
+import { ROUTES } from "@/constants/routes";
+
+export function Header() {
+  return (
+    <header className="flex items-center justify-between border-b px-6 py-4">
+      <Link href={ROUTES.HOME} className="text-lg font-semibold">
+        Frontend Init
+      </Link>
+      <nav className="flex items-center gap-3">
+        <Link href={ROUTES.ABOUT} className="text-sm text-zinc-600">
+          About
+        </Link>
+        <Button>Get Started</Button>
+      </nav>
+    </header>
+  );
+}

package/dist/templates/architectures/next/standard/src/config/env.ts

@@ -0,0 +1,3 @@
+export const env = {
+  apiUrl: process.env.NEXT_PUBLIC_API_URL ?? "https://api.example.com",
+};

package/dist/templates/architectures/next/standard/src/constants/routes.ts

@@ -0,0 +1,4 @@
+export const ROUTES = {
+  HOME: "/",
+  ABOUT: "/about",
+} as const;

package/dist/templates/architectures/next/standard/src/hooks/useDebounce.ts

@@ -0,0 +1,14 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+export function useDebounce<T>(value: T, delay = 300) {
+  const [debouncedValue, setDebouncedValue] = useState(value);
+
+  useEffect(() => {
+    const timer = setTimeout(() => setDebouncedValue(value), delay);
+    return () => clearTimeout(timer);
+  }, [value, delay]);
+
+  return debouncedValue;
+}

package/dist/templates/architectures/next/standard/src/hooks/useToggle.ts

@@ -0,0 +1,15 @@
+"use client";
+
+import { useState } from "react";
+
+export function useToggle(defaultValue = false) {
+  const [value, setValue] = useState(defaultValue);
+
+  const toggle = () => setValue((prev) => !prev);
+
+  return {
+    value,
+    toggle,
+    setValue,
+  };
+}

package/dist/templates/architectures/next/standard/src/providers/index.tsx

@@ -0,0 +1,12 @@
+"use client";
+
+import { ReactNode } from "react";
+import { ThemeProvider } from "./theme-provider";
+
+type ProvidersProps = {
+  children: ReactNode;
+};
+
+export function Providers({ children }: ProvidersProps) {
+  return <ThemeProvider>{children}</ThemeProvider>;
+}

package/dist/templates/architectures/next/standard/src/providers/theme-provider.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { ReactNode } from "react";
+
+type ThemeProviderProps = {
+  children: ReactNode;
+};
+
+export function ThemeProvider({ children }: ThemeProviderProps) {
+  return <div className="min-h-screen bg-white text-zinc-900">{children}</div>;
+}

package/dist/templates/architectures/next/standard/src/services/api.ts

@@ -0,0 +1,22 @@
+import { env } from "@/config/env";
+import type { User } from "@/types/user";
+
+export async function fetchHealth() {
+  const response = await fetch(`${env.apiUrl}/health`);
+
+  if (!response.ok) {
+    throw new Error("Health check failed");
+  }
+
+  return response.json();
+}
+
+export async function fetchCurrentUser(): Promise<User> {
+  const response = await fetch(`${env.apiUrl}/users/me`);
+
+  if (!response.ok) {
+    throw new Error("Failed to fetch user");
+  }
+
+  return response.json();
+}

package/dist/templates/architectures/next/standard/src/types/user.ts

@@ -0,0 +1,5 @@
+export type User = {
+  id: string;
+  name: string;
+  email: string;
+};

package/dist/templates/architectures/next/standard/src/utils/cn.ts

@@ -0,0 +1,3 @@
+export function cn(...classes: (string | undefined | false | null)[]) {
+  return classes.filter(Boolean).join(" ");
+}

package/dist/templates/architectures/next/standard/src/utils/formatDate.ts

@@ -0,0 +1,7 @@
+export function formatDate(date: Date) {
+  return date.toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "long",
+    day: "numeric",
+  });
+}

package/dist/templates/modules/axios/module.ts

@@ -0,0 +1,7 @@
+export default {
+  name: "axios",
+  dependencies: [
+    "axios",
+  ],
+  devDependencies: [],
+};

package/dist/templates/modules/core/module.ts

@@ -0,0 +1,5 @@
+export default {
+  name: "core",
+  dependencies: [],
+  devDependencies: [],
+};

package/dist/templates/modules/core/src/components/common/Button.tsx

@@ -0,0 +1,12 @@
+type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+
+export function Button({ children, ...props }: ButtonProps) {
+  return (
+    <button
+      {...props}
+      className="rounded-md bg-black px-4 py-2 text-white"
+    >
+      {children}
+    </button>
+  );
+}

package/dist/templates/modules/core/src/components/layout/Header.tsx

@@ -0,0 +1,7 @@
+export function Header() {
+  return (
+    <header className="border-b p-4">
+      <h1>Frontend Init</h1>
+    </header>
+  );
+}

package/dist/templates/modules/core/src/config/env.ts

@@ -0,0 +1,3 @@
+export const env = {
+  apiUrl: process.env.NEXT_PUBLIC_API_URL ?? "",
+};

package/dist/templates/modules/core/src/constants/index.ts

@@ -0,0 +1 @@
+export * from "./routes";

package/dist/templates/modules/core/src/constants/routes.ts

@@ -0,0 +1,3 @@
+export const ROUTES = {
+  HOME: "/",
+};

package/dist/templates/modules/core/src/hooks/index.ts

@@ -0,0 +1 @@
+export * from "./useToggle";

package/dist/templates/modules/core/src/hooks/useToggle.ts

@@ -0,0 +1,13 @@
+import { useState } from "react";
+
+export function useToggle(defaultValue = false) {
+  const [value, setValue] = useState(defaultValue);
+
+  const toggle = () => setValue((prev) => !prev);
+
+  return {
+    value,
+    toggle,
+    setValue,
+  };
+}

package/dist/templates/modules/core/src/providers/index.tsx

@@ -0,0 +1,9 @@
+import { ReactNode } from "react";
+
+type Props = {
+  children: ReactNode;
+};
+
+export function Providers({ children }: Props) {
+  return <>{children}</>;
+}

package/dist/templates/modules/core/src/services/api.ts

@@ -0,0 +1,5 @@
+export const api = {
+  get: async () => {
+    throw new Error("Not implemented");
+  },
+};

package/dist/templates/modules/core/src/utils/cn.ts

@@ -0,0 +1,3 @@
+export function cn(...classes: (string | undefined | false | null)[]) {
+  return classes.filter(Boolean).join(" ");
+}

package/dist/templates/modules/core/src/utils/index.ts

@@ -0,0 +1 @@
+export * from "./cn";

package/dist/templates/modules/zustand/module.ts

@@ -0,0 +1,7 @@
+export default {
+  name: "zustand",
+  dependencies: [
+    "zustand",
+  ],
+  devDependencies: [],
+};

package/package.json

@@ -0,0 +1,70 @@
+{
+  "name": "@prmvx/frontend-forge",
+  "version": "0.1.0",
+  "description": "A modern CLI to scaffold production-ready frontend architectures and starter modules for existing Next.js projects.",
+  "keywords": [
+    "cli",
+    "nextjs",
+    "react",
+    "frontend",
+    "starter",
+    "boilerplate",
+    "scaffold",
+    "architecture",
+    "template",
+    "generator",
+    "typescript",
+    "developer-tools",
+    "productivity",
+    "app-router"
+  ],
+  "homepage": "https://github.com/Parimal2607/frontend-forge#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Parimal2607/frontend-forge.git"
+  },
+  "bugs": {
+    "url": "https://github.com/Parimal2607/frontend-forge/issues"
+  },
+  "author": {
+    "name": "Parimal Sharma",
+    "url": "https://github.com/Parimal2607"
+  },
+  "license": "MIT",
+  "type": "module",
+  "bin": {
+    "frontend-forge": "./dist/cli.js"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "engines": {
+    "node": ">=20"
+  },
+  "scripts": {
+    "clean": "rimraf dist",
+    "build": "npm run clean && tsup && npm run copy-templates",
+    "copy-templates": "cpy \"templates/**/*\" dist/templates",
+    "dev": "tsup --watch",
+    "prepare": "npm run build"
+  },
+  "dependencies": {
+    "@clack/prompts": "^1.7.0",
+    "commander": "^12.0.0",
+    "execa": "^9.6.1",
+    "fs-extra": "^11.2.0",
+    "picocolors": "^1.1.1"
+  },
+  "devDependencies": {
+    "@types/node": "^22.0.0",
+    "cpy-cli": "^7.0.0",
+    "rimraf": "^6.0.1",
+    "tsup": "^8.0.0",
+    "typescript": "^5.8.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}