create-reactivite 1.2.0 → 1.3.0

package/README.md

@@ -10,6 +10,7 @@ When you run the CLI you pick one of two templates:
 | --- | --- |
 | **React + Vite** | React 19, Vite 8 (Rolldown), Tailwind v4, shadcn/ui, React Router v7, Recharts |
 | **Next.js 16** | Next.js 16 (App Router), React 19, Tailwind v4, shadcn/ui, i18n, TanStack Query, axios + orval, Zustand, react-hook-form + zod, husky, Vitest + MSW |
+| **Rspack** | React 19 + TypeScript, Rspack bundler (SWC). Minimal starter — grow it yourself. |
 
 ```
 $ npx create-reactivite my-app
@@ -18,6 +19,7 @@ $ npx create-reactivite my-app
 ? Pick a template: ›
 ❯ React + Vite (Tailwind v4, shadcn/ui, React Router)
   Next.js 16 (App Router, i18n, TanStack Query, orval, Zustand, husky)
+  Rspack (minimal React + TypeScript starter)
 ```
 
 ## 📦 Installation
@@ -169,9 +171,44 @@ my-app/
 
 ---
 
+## 🦀 Template 3 — Rspack (minimal)
+
+A deliberately bare **React + TypeScript** starter on [Rspack](https://rspack.dev/) (Rust-based bundler, built-in SWC). No router, no UI kit — a clean base to build on.
+
+### Scripts
+
+- `pnpm dev` — dev server (port 5174)
+- `pnpm build` — production build → `dist/`
+- `pnpm preview` — serve the production build
+
+### Structure
+
+```
+my-app/
+├── index.html
+├── rspack.config.mjs       # entry, swc loader, html plugin, native CSS
+├── tsconfig.json
+└── src/
+    ├── main.tsx
+    ├── App.tsx
+    ├── index.css
+    └── components/author-credit.tsx
+```
+
+---
+
+## 👤 Author
+
+Every template renders a small credit linking to the author. Built by **Javid Salimov** —
+[GitHub](https://github.com/javidselimov) ·
+[LinkedIn](https://www.linkedin.com/in/javidsalim/) ·
+[npm](https://www.npmjs.com/~ubuligan).
+
+---
+
 ## 🎨 Adding shadcn/ui Components
 
-Both templates use shadcn/ui (new-york, lucide icons):
+The React + Vite and Next.js templates use shadcn/ui (new-york, lucide icons):
 
 ```bash
 npx shadcn@latest add button
@@ -188,7 +225,7 @@ MIT
 
 ## 🔗 Links
 
-- [React](https://react.dev/) · [Next.js](https://nextjs.org/) · [Vite](https://vite.dev/)
+- [React](https://react.dev/) · [Next.js](https://nextjs.org/) · [Vite](https://vite.dev/) · [Rspack](https://rspack.dev/)
 - [Tailwind CSS](https://tailwindcss.com/) · [shadcn/ui](https://ui.shadcn.com/)
 - [React Router](https://reactrouter.com/) · [TanStack Query](https://tanstack.com/query) · [orval](https://orval.dev/)
 - [Zustand](https://zustand.docs.pmnd.rs/) · [Recharts](https://recharts.org/) · [TypeScript](https://www.typescriptlang.org/)

package/index.js

@@ -6,11 +6,29 @@ import { fileURLToPath } from "url";
 import { copy } from "fs-extra";
 import prompts from "prompts";
 import { execa } from "execa";
+import figlet from "figlet";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
+// ANSI rəng köməkçiləri (xarici asılılıq olmadan)
+const cyan = (s) => `\x1b[36m${s}\x1b[0m`;
+const dim = (s) => `\x1b[2m${s}\x1b[0m`;
+
+// 🧩 Banner — CLI açılışında göstərilir
+const printBanner = () => {
+  try {
+    console.log(cyan(figlet.textSync("Reactivite", { font: "Standard" })));
+  } catch {
+    // figlet uğursuz olsa sadə mətnə keç
+    console.log(cyan("\n  create-reactivite"));
+  }
+  console.log(dim("  Scaffold React / Next.js / Rspack apps · by Javid Salimov\n"));
+};
+
 (async () => {
+  printBanner();
+
   const { projectName } = await prompts({
     type: "text",
     name: "projectName",
@@ -33,6 +51,10 @@ const __dirname = path.dirname(__filename);
           "Next.js 16 (App Router, i18n, TanStack Query, orval, Zustand, husky)",
         value: "template2",
       },
+      {
+        title: "Rspack (minimal React + TypeScript starter)",
+        value: "template3",
+      },
     ],
     initial: 0,
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-reactivite",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "⚡ Scaffold modern frontend projects in seconds — pick a template: React + Vite or Next.js 16 (App Router). Both ship Tailwind v4, shadcn/ui, TypeScript and a clean, production-ready structure. The Next.js template adds i18n, TanStack Query, axios/orval, Zustand, husky and Vitest. Zero setup hassle.",
   "bin": {
     "create-reactivite": "./index.js"
@@ -9,12 +9,14 @@
   "files": [
     "index.js",
     "template/",
-    "template2/"
+    "template2/",
+    "template3/"
   ],
   "dependencies": {
     "prompts": "^2.4.2",
     "fs-extra": "^11.2.0",
-    "execa": "^7.1.0"
+    "execa": "^7.1.0",
+    "figlet": "^1.9.3"
   },
   "repository": {
     "type": "git",

package/template/src/App.tsx

@@ -5,6 +5,7 @@ import { createBrowserRouter } from "react-router";
 import { RouterProvider } from "react-router/dom";
 import Home from './pages/Homepage/Homepage';
 import DashboardPage from './pages/Dashboard/Dashboard';
+import { AuthorCredit } from './components/author-credit';
 const router = createBrowserRouter([
   {
     path: "/",
@@ -20,8 +21,12 @@ const router = createBrowserRouter([
   },
 ]);
 function App() {
-  return   <RouterProvider router={router} />
-
+  return (
+    <>
+      <RouterProvider router={router} />
+      <AuthorCredit />
+    </>
+  );
 }
 
 export default App

package/template/src/components/author-credit.tsx

@@ -0,0 +1,25 @@
+const links = [
+  { label: "GitHub", href: "https://github.com/javidselimov" },
+  { label: "LinkedIn", href: "https://www.linkedin.com/in/javidsalim/" },
+  { label: "npm", href: "https://www.npmjs.com/~ubuligan" },
+];
+
+export function AuthorCredit() {
+  return (
+    <div className="fixed bottom-4 right-4 z-50 flex items-center gap-3 rounded-full border bg-background/80 px-4 py-2 text-sm shadow-lg backdrop-blur">
+      <span className="font-medium">Javid Salimov</span>
+      <span className="text-muted-foreground">·</span>
+      {links.map((l) => (
+        <a
+          key={l.label}
+          href={l.href}
+          target="_blank"
+          rel="noreferrer"
+          className="text-muted-foreground transition-colors hover:text-foreground"
+        >
+          {l.label}
+        </a>
+      ))}
+    </div>
+  );
+}

package/template2/app/[locale]/layout.tsx

@@ -9,6 +9,7 @@ import { TranslationProvider } from '@/contexts/translation-context';
 import { Toaster } from '@/components/ui/sonner';
 import { QueryProvider } from '@/hoc/provider';
 import { AuthEventListener } from '@/components/AuthEventListener';
+import { AuthorCredit } from '@/components/author-credit';
 import { LOCALES, type Locale } from '@/config/constants';
 import { getDictionary } from './locales';
 
@@ -46,6 +47,7 @@ export default async function LocaleLayout({
             <TranslationProvider locale={locale} messages={messages}>
               <AuthEventListener />
               <Suspense fallback={null}>{children}</Suspense>
+              <AuthorCredit />
             </TranslationProvider>
             <Toaster />
           </ThemeProvider>

package/template2/components/author-credit.tsx

@@ -0,0 +1,25 @@
+const links = [
+  { label: 'GitHub', href: 'https://github.com/javidselimov' },
+  { label: 'LinkedIn', href: 'https://www.linkedin.com/in/javidsalim/' },
+  { label: 'npm', href: 'https://www.npmjs.com/~ubuligan' },
+];
+
+export function AuthorCredit() {
+  return (
+    <div className="fixed bottom-4 right-4 z-50 flex items-center gap-3 rounded-full border bg-background/80 px-4 py-2 text-sm shadow-lg backdrop-blur">
+      <span className="font-medium">Javid Salimov</span>
+      <span className="text-muted-foreground">·</span>
+      {links.map((l) => (
+        <a
+          key={l.label}
+          href={l.href}
+          target="_blank"
+          rel="noreferrer"
+          className="text-muted-foreground transition-colors hover:text-foreground"
+        >
+          {l.label}
+        </a>
+      ))}
+    </div>
+  );
+}