@lazarv/create-react-server 0.0.0-experimental-d003259-20250211-2495688e

package/templates/Dockerfile.yarn

@@ -0,0 +1,71 @@
+# Define build argument for port with default value
+ARG PORT=3000
+
+# Stage 1: Build
+FROM node:20-alpine AS builder
+
+# Set working directory
+WORKDIR /app
+
+# Copy package files
+COPY package.json yarn.lock ./
+
+# Install yarn globally
+RUN --mount=type=cache,target=/root/.npm \
+  if grep -q "\"packageManager\":" "package.json"; then \
+  corepack enable && corepack prepare; \
+  else \
+  npm install -g yarn; \
+  fi
+
+# Install dependencies
+RUN --mount=type=cache,target=/usr/local/share/.cache/yarn \
+  yarn install --frozen-lockfile
+
+# Copy source files and .react-server directory
+COPY . .
+
+# Build the application
+RUN yarn build
+
+# Stage 2: Production
+FROM node:20-alpine AS runner
+
+# Forward the build argument
+ARG PORT
+ENV PORT=$PORT
+
+# Set working directory
+WORKDIR /app
+
+# Copy package files
+COPY --from=builder /app/package.json /app/yarn.lock ./
+
+# Install yarn globally
+RUN --mount=type=cache,target=/root/.npm \
+  if grep -q "\"packageManager\":" "package.json"; then \
+  corepack enable && corepack prepare; \
+  else \
+  npm install -g yarn; \
+  fi
+
+# Copy built files and .react-server from builder stage
+COPY --from=builder /app/package.json /app/yarn.lock ./
+COPY --from=builder /app/node_modules ./node_modules
+COPY --from=builder /app/.react-server ./.react-server
+
+# Prune dev dependencies
+RUN --mount=type=cache,target=/usr/local/share/.cache/yarn \
+  yarn install --production --frozen-lockfile
+
+# Run as non-root user
+RUN addgroup -g 1001 -S nodejs && \
+  adduser -S nodejs -u 1001 && \
+  chown -R nodejs:nodejs /app
+USER nodejs
+
+# Expose the port your app runs on
+EXPOSE ${PORT}
+
+# Start the application
+CMD ["yarn", "start", "--host"]

package/templates/README.docker.md

@@ -0,0 +1,15 @@
+# Build Docker image
+
+To build your application into a Docker image, run:
+
+```sh
+docker build -t <%=props.projectName %> .
+```
+
+# Run Docker container
+
+After building the Docker image, you can run the container with:
+
+```sh
+docker run --rm -ti -p <%=props.port %>:<%=props.port %> <%=props.projectName %>
+```

package/templates/README.md

@@ -0,0 +1,35 @@
+This is a [@lazarv/react-server](https://react-server.dev) project bootstrapped with [`create-react-server`](https://react-server.dev/guide/quick-start).
+
+## Getting Started
+
+First, run the development server:
+
+```sh
+<%=props.packageManager.run %> dev
+```
+
+Use the `--open` flag, the development server command menu or navigate to [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `<%=props.entrypoint%>`. The page auto-updates as you edit the file.
+
+## Build
+
+To build the application for production, run:
+
+```sh
+<%=props.packageManager.run %> build
+```
+
+The build output will be in the `.react-server` directory.
+
+To run the production server, run:
+
+```sh
+<%=props.packageManager.start %> start
+```
+
+## Learn More
+
+To learn more about [@lazarv/react-server](https://react-server.dev), take a look at the documentation or search the documentation using the development server.
+
+You can check out framework on [GitHub](https://github.com/lazarv/react-server) - your feedback and contributions are welcome!

package/templates/blank/package.json

@@ -0,0 +1,6 @@
+{
+  "scripts": {
+    "dev": "react-server ./src/App.jsx",
+    "build": "react-server build ./src/App.jsx"
+  }
+}

package/templates/blank/src/App.jsx

@@ -0,0 +1,5 @@
+import { version } from "@lazarv/react-server";
+
+export default function App() {
+  return <>{version}</>;
+}

package/templates/blank-ts/package.json

@@ -0,0 +1,6 @@
+{
+  "scripts": {
+    "dev": "react-server ./src/App.tsx",
+    "build": "react-server build ./src/App.tsx"
+  }
+}

package/templates/blank-ts/src/App.tsx

@@ -0,0 +1,5 @@
+import { version } from "@lazarv/react-server";
+
+export default function App() {
+  return <>{version}</>;
+}

package/templates/eslint.config.template.mjs

@@ -0,0 +1,98 @@
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+import babelParser from "@babel/eslint-parser";
+import { FlatCompat } from "@eslint/eslintrc";
+import js from "@eslint/js"; /*<%=props.eslint.typescript.import %>*/
+import jsxA11Y from "eslint-plugin-jsx-a11y"; /*<%=props.eslint.prettier.import %>*/
+import react from "eslint-plugin-react"; /*<%=props.eslint.reactCompiler.import %>*/
+import simpleImportSort from "eslint-plugin-simple-import-sort";
+import globals from "globals";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all,
+});
+
+export default [
+  {
+    ignores: [
+      "**/node_modules/",
+      "**/dist/",
+      "**/build/",
+      "**/.react-server/",
+      "**/.react-server*/",
+      "**/.vercel/",
+      "*.mdx",
+      "*.md",
+      "*.json",
+      "*-lock.*",
+    ],
+  },
+  ...compat.extends(
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react/jsx-runtime",
+    "plugin:jsx-a11y/recommended"
+    /*<%=props.eslint.prettier.compat %>*/
+  ),
+  {
+    plugins: {
+      react,
+      /*<%=props.eslint.reactCompiler.plugin %>*/
+      "simple-import-sort": simpleImportSort,
+      /*<%=props.eslint.prettier.plugin %>*/
+      "jsx-a11y": jsxA11Y,
+    },
+
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        ...globals.node,
+        Deno: "readonly",
+      },
+
+      parser: babelParser,
+      ecmaVersion: "latest",
+      sourceType: "module",
+
+      parserOptions: {
+        requireConfigFile: false,
+
+        babelOptions: {
+          presets: ["@babel/preset-react"],
+          plugins: ["@babel/plugin-syntax-import-assertions"],
+        },
+
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+    },
+
+    settings: {
+      react: {
+        version: "19.0.0",
+      },
+    },
+
+    rules: {
+      "react/prop-types": "off",
+      /*<%=props.eslint.reactCompiler.rules %>*/
+      "simple-import-sort/imports": [
+        "error",
+        {
+          groups: [["^\\u0000"], ["^node:"], ["^react"], ["^[^.]"], ["^\\."]],
+        },
+      ],
+
+      "no-async-promise-executor": "off",
+
+      /*<%=props.eslint.prettier.rules %>*/
+    },
+  },
+  /*<%=props.eslint.typescript.config %>*/
+];

package/templates/get-started/package.json

@@ -0,0 +1,6 @@
+{
+  "scripts": {
+    "dev": "react-server ./src/App.jsx",
+    "build": "react-server build ./src/App.jsx"
+  }
+}

package/templates/get-started/src/App.jsx

@@ -0,0 +1,60 @@
+import "./global.css";
+import Confetti from "./Confetti";
+
+export default function App() {
+  return (
+    <html lang="en" className="h-screen" suppressHydrationWarning>
+      <head></head>
+      <body
+        className="w-full min-h-full flex flex-col justify-center items-center dark:bg-zinc-900 dark:text-gray-400"
+        suppressHydrationWarning
+      >
+        <a href="https://github.com/lazarv/react-server" target="_blank">
+          <img
+            src="/github.svg"
+            alt="GitHub page"
+            className="absolute top-2 right-2 w-6 h-6"
+          />
+        </a>
+
+        <section className="flex flex-col mt-auto">
+          <div className="relative">
+            <img
+              src="/react-server.svg"
+              className="absolute h-[85%] top-1/2 -translate-x-full -translate-y-1/2 -ml-1"
+              alt="@lazarv/react-server logo"
+            />
+            <h2 className="text-xs font-semibold m-0 pt-0 border-none dark:text-yellow-500 mt-4 sm:mt-0">
+              @lazarv
+            </h2>
+            <h1 className="text-5xl font-semibold m-0 -mt-4 whitespace-nowrap sm:text-6xl dark:text-yellow-500">
+              react-server
+            </h1>
+          </div>
+
+          <p className="text-lg">
+            Welcome to your <b>@lazarv/react-server</b> app!
+          </p>
+        </section>
+
+        <Confetti className="mt-4" />
+
+        <p className="text-sm mt-4">
+          Try editing <b>src/App.jsx</b> and save to reload.
+        </p>
+
+        <p className="text-sm mt-auto mb-2">
+          Visit{" "}
+          <a
+            href="https://react-server.dev"
+            target="_blank"
+            className="text-indigo-500 dark:text-yellow-500"
+          >
+            react-server.dev
+          </a>{" "}
+          to learn more about <b>@lazarv/react-server</b>.
+        </p>
+      </body>
+    </html>
+  );
+}

package/templates/get-started/src/Button.jsx

@@ -0,0 +1,14 @@
+export default function Button({ className, children, ...props }) {
+  return (
+    <button
+      className={`${className} rounded-full p-1 inline-flex items-center text-black hover:no-underline from-rose-400 via-fuchsia-500 to-indigo-500 bg-gradient-to-r hover:drop-shadow`}
+    >
+      <div
+        {...props}
+        className="block rounded-full p-2 px-4 text-sm sm:text-base bg-white dark:bg-gray-900 dark:text-white hover:bg-transparent dark:hover:bg-transparent hover:text-white dark:hover:text-white"
+      >
+        {children}
+      </div>
+    </button>
+  );
+}

package/templates/get-started/src/Confetti.jsx

@@ -0,0 +1,19 @@
+"use client";
+
+import Button from "./Button";
+
+export default function Confetti(props) {
+  return (
+    <Button
+      {...props}
+      onClick={async () => {
+        const { default: confetti } = await import(
+          "https://esm.sh/canvas-confetti"
+        );
+        confetti();
+      }}
+    >
+      Celebrate!
+    </Button>
+  );
+}

package/templates/get-started/src/global.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/templates/get-started-ts/globals.d.ts

@@ -0,0 +1,3 @@
+declare module "https://esm.sh/canvas-confetti" {
+  export default function confetti(): void;
+}

package/templates/get-started-ts/package.json

@@ -0,0 +1,6 @@
+{
+  "scripts": {
+    "dev": "react-server ./src/App.tsx",
+    "build": "react-server build ./src/App.tsx"
+  }
+}

package/templates/get-started-ts/src/App.tsx

@@ -0,0 +1,66 @@
+import "~/global.css";
+
+import Confetti from "~/Confetti";
+
+export default function App() {
+  return (
+    <html lang="en" className="h-screen" suppressHydrationWarning>
+      <head></head>
+      <body
+        className="w-full min-h-full flex flex-col justify-center items-center dark:bg-zinc-900 dark:text-gray-400"
+        suppressHydrationWarning
+      >
+        <a
+          href="https://github.com/lazarv/react-server"
+          target="_blank"
+          rel="noreferrer"
+        >
+          <img
+            src="/github.svg"
+            alt="GitHub page"
+            className="absolute top-2 right-2 w-6 h-6"
+          />
+        </a>
+
+        <section className="flex flex-col mt-auto">
+          <div className="relative">
+            <img
+              src="/react-server.svg"
+              className="absolute h-[85%] top-1/2 -translate-x-full -translate-y-1/2 -ml-1"
+              alt="@lazarv/react-server logo"
+            />
+            <h2 className="text-xs font-semibold m-0 pt-0 border-none dark:text-yellow-500 mt-4 sm:mt-0">
+              @lazarv
+            </h2>
+            <h1 className="text-5xl font-semibold m-0 -mt-4 whitespace-nowrap sm:text-6xl dark:text-yellow-500">
+              react-server
+            </h1>
+          </div>
+
+          <p className="text-lg">
+            Welcome to your <b>@lazarv/react-server</b> app!
+          </p>
+        </section>
+
+        <Confetti className="mt-4" />
+
+        <p className="text-sm mt-4">
+          Try editing <b>src/App.tsx</b> and save to reload.
+        </p>
+
+        <p className="text-sm mt-auto mb-2">
+          Visit{" "}
+          <a
+            href="https://react-server.dev"
+            target="_blank"
+            className="text-indigo-500 dark:text-yellow-500"
+            rel="noreferrer"
+          >
+            react-server.dev
+          </a>{" "}
+          to learn more about <b>@lazarv/react-server</b>.
+        </p>
+      </body>
+    </html>
+  );
+}

package/templates/get-started-ts/src/Button.tsx

@@ -0,0 +1,18 @@
+export type ButtonProps = React.PropsWithChildren<
+  React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>
+>;
+
+export default function Button({ className, children, ...props }: ButtonProps) {
+  return (
+    <button
+      className={`${className} rounded-full p-1 inline-flex items-center text-black hover:no-underline from-rose-400 via-fuchsia-500 to-indigo-500 bg-gradient-to-r hover:drop-shadow`}
+    >
+      <div
+        {...props}
+        className="block rounded-full p-2 px-4 text-sm sm:text-base bg-white dark:bg-gray-900 dark:text-white hover:bg-transparent dark:hover:bg-transparent hover:text-white dark:hover:text-white"
+      >
+        {children}
+      </div>
+    </button>
+  );
+}

package/templates/get-started-ts/src/Confetti.tsx

@@ -0,0 +1,19 @@
+"use client";
+
+import Button, { type ButtonProps } from "~/Button";
+
+export default function Confetti(props: ButtonProps) {
+  return (
+    <Button
+      {...props}
+      onClick={async () => {
+        const { default: confetti } = await import(
+          "https://esm.sh/canvas-confetti"
+        );
+        confetti();
+      }}
+    >
+      Celebrate!
+    </Button>
+  );
+}

package/templates/get-started-ts/src/global.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/templates/nextjs/globals.d.ts

@@ -0,0 +1,3 @@
+declare module "https://esm.sh/canvas-confetti" {
+  export default function confetti(): void;
+}

package/templates/nextjs/react-server.config.json

@@ -0,0 +1,9 @@
+{
+  "root": "src/app",
+  "layouts": {
+    "include": ["**/layout.jsx"]
+  },
+  "pages": {
+    "include": ["**/page.jsx"]
+  }
+}

package/templates/nextjs/src/app/layout.tsx

@@ -0,0 +1,38 @@
+import "~/global.css";
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en" className="h-screen" suppressHydrationWarning>
+      <head></head>
+      <body
+        className="w-full min-h-full flex flex-col justify-center items-center dark:bg-zinc-900 dark:text-gray-400"
+        suppressHydrationWarning
+      >
+        <a
+          href="https://github.com/lazarv/react-server"
+          target="_blank"
+          rel="noreferrer"
+        >
+          <img
+            src="/github.svg"
+            alt="GitHub page"
+            className="absolute top-2 right-2 w-6 h-6"
+          />
+        </a>
+        {children}
+        <p className="text-sm mt-auto mb-2">
+          Visit{" "}
+          <a
+            href="https://react-server.dev"
+            target="_blank"
+            className="text-indigo-500 dark:text-yellow-500"
+            rel="noreferrer"
+          >
+            react-server.dev
+          </a>{" "}
+          to learn more about <b>@lazarv/react-server</b>.
+        </p>
+      </body>
+    </html>
+  );
+}

package/templates/nextjs/src/app/page.tsx

@@ -0,0 +1,33 @@
+import Confetti from "~/components/Confetti";
+
+export default function Page() {
+  return (
+    <>
+      <section className="flex flex-col mt-auto">
+        <div className="relative">
+          <img
+            src="/react-server.svg"
+            className="absolute h-[85%] top-1/2 -translate-x-full -translate-y-1/2 -ml-1"
+            alt="@lazarv/react-server logo"
+          />
+          <h2 className="text-xs font-semibold m-0 pt-0 border-none dark:text-yellow-500 mt-4 sm:mt-0">
+            @lazarv
+          </h2>
+          <h1 className="text-5xl font-semibold m-0 -mt-4 whitespace-nowrap sm:text-6xl dark:text-yellow-500">
+            react-server
+          </h1>
+        </div>
+
+        <p className="text-lg">
+          Welcome to your <b>@lazarv/react-server</b> app!
+        </p>
+      </section>
+
+      <Confetti className="mt-4" />
+
+      <p className="text-sm mt-4">
+        Try editing <b>src/app/page.tsx</b> and save to reload.
+      </p>
+    </>
+  );
+}

package/templates/nextjs/src/components/Button.tsx

@@ -0,0 +1,18 @@
+export type ButtonProps = React.PropsWithChildren<
+  React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>
+>;
+
+export default function Button({ className, children, ...props }: ButtonProps) {
+  return (
+    <button
+      className={`${className} rounded-full p-1 inline-flex items-center text-black hover:no-underline from-rose-400 via-fuchsia-500 to-indigo-500 bg-gradient-to-r hover:drop-shadow`}
+    >
+      <div
+        {...props}
+        className="block rounded-full p-2 px-4 text-sm sm:text-base bg-white dark:bg-gray-900 dark:text-white hover:bg-transparent dark:hover:bg-transparent hover:text-white dark:hover:text-white"
+      >
+        {children}
+      </div>
+    </button>
+  );
+}

package/templates/nextjs/src/components/Confetti.tsx

@@ -0,0 +1,19 @@
+"use client";
+
+import Button, { type ButtonProps } from "~/components/Button";
+
+export default function Confetti(props: ButtonProps) {
+  return (
+    <Button
+      {...props}
+      onClick={async () => {
+        const { default: confetti } = await import(
+          "https://esm.sh/canvas-confetti"
+        );
+        confetti();
+      }}
+    >
+      Celebrate!
+    </Button>
+  );
+}

package/templates/nextjs/src/global.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/templates/package.css.json

@@ -0,0 +1,5 @@
+{
+  "devDependencies": {
+    "typescript-plugin-css-modules": "^3.1.0"
+  }
+}

package/templates/package.eslint.json

@@ -0,0 +1,19 @@
+{
+  "scripts": {
+    "lint": "eslint"
+  },
+  "devDependencies": {
+    "@babel/eslint-parser": "^7.25.9",
+    "@babel/plugin-syntax-import-assertions": "^7.25.9",
+    "@babel/preset-react": "^7.25.9",
+    "@eslint/eslintrc": "^3.1.0",
+    "@eslint/js": "^9.13.0",
+    "eslint": "^9.13.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-jsx-a11y": "^6.10.1",
+    "eslint-plugin-prettier": "^5.2.1",
+    "eslint-plugin-react": "^7.37.2",
+    "eslint-plugin-simple-import-sort": "^12.1.1",
+    "globals": "^15.11.0"
+  }
+}

package/templates/package.eslint.ts.json

@@ -0,0 +1,7 @@
+{
+  "devDependencies": {
+    "@types/node": "^20.12.12",
+    "@typescript-eslint/eslint-plugin": "^8.11.0",
+    "@typescript-eslint/parser": "^8.11.0"
+  }
+}

package/templates/package.json

@@ -0,0 +1,12 @@
+{
+  "version": "0.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "react-server",
+    "build": "react-server build",
+    "start": "react-server start"
+  },
+  "dependencies": {},
+  "devDependencies": {}
+}