Merge pull request #77 from siguici/deno-adapter

➕ Add Deno adapter demo (#75)

apps/deno-demo/.gitignore

@@ -0,0 +1,21 @@
+# build output
+dist/
+
+# generated types
+.astro/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store

apps/deno-demo/astro.config.mjs

@@ -0,0 +1,12 @@
+import { defineConfig } from "astro/config";
+
+import deno from "@astrojs/deno";
+import react from "@astrojs/react";
+import qwik from "@qwikdev/astro";
+
+// https://astro.build/config
+export default defineConfig({
+  output: "server",
+  adapter: deno(),
+  integrations: [qwik({ include: "**/qwik/*" }), react({ include: "**/react/*" })]
+});

apps/deno-demo/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "astro-deno-demo",
+  "type": "module",
+  "version": "0.0.1",
+  "scripts": {
+    "dev": "astro dev",
+    "start": "astro dev",
+    "build": "astro check && astro build",
+    "preview": "deno run --allow-net --allow-read --allow-env ./dist/server/entry.mjs",
+    "astro": "astro"
+  },
+  "dependencies": {
+    "@astrojs/check": "^0.5.10",
+    "@astrojs/deno": "^5.0.1",
+    "@astrojs/react": "^3.0.10",
+    "@builder.io/qwik": "^1.5.1",
+    "@qwikdev/astro": "workspace:*",
+    "@types/react": "^18.2.64",
+    "@types/react-dom": "^18.2.21",
+    "astro": "^4.5",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "typescript": "^5.4.3"
+  }
+}

apps/node-demo/.vscode/extensions.json

@@ -0,0 +1,4 @@
+{
+  "recommendations": ["astro-build.astro-vscode"],
+  "unwantedRecommendations": []
+}

apps/node-demo/.vscode/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "command": "./node_modules/.bin/astro dev",
+      "name": "Development server",
+      "request": "launch",
+      "type": "node-terminal"
+    }
+  ]
+}

apps/node-demo/README.md

@@ -0,0 +1,47 @@
+# Astro Starter Kit: Minimal
+
+```sh
+npm create astro@latest -- --template minimal
+```
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/minimal)
+[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/minimal)
+[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/minimal/devcontainer.json)
+
+> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
+
+## 🚀 Project Structure
+
+Inside of your Astro project, you'll see the following folders and files:
+
+```text
+/
+├── public/
+├── src/
+│   └── pages/
+│       └── index.astro
+└── package.json
+```
+
+Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
+
+There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
+
+Any static assets, like images, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command                   | Action                                           |
+| :------------------------ | :----------------------------------------------- |
+| `npm install`             | Installs dependencies                            |
+| `npm run dev`             | Starts local dev server at `localhost:4321`      |
+| `npm run build`           | Build your production site to `./dist/`          |
+| `npm run preview`         | Preview your build locally, before deploying     |
+| `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
+| `npm run astro -- --help` | Get help using the Astro CLI                     |
+
+## 👀 Want to learn more?
+
+Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).

apps/node-demo/src/components/qwik/counter.tsx

@@ -0,0 +1,13 @@
+import { Slot, component$, useSignal } from "@builder.io/qwik";
+
+export const Counter = component$<{ initial: number }>((props) => {
+  const counter = useSignal(props.initial);
+
+  return (
+    <>
+      <button type="button" onClick$={() => counter.value++}>
+        <Slot /> {counter.value}
+      </button>
+    </>
+  );
+});

apps/node-demo/src/components/qwik/say-hi.tsx

@@ -0,0 +1,17 @@
+import { Slot, component$, sync$ } from "@builder.io/qwik";
+
+export const SayHi = component$(() => {
+  return (
+    <button
+      type="button"
+      onKeyDown$={sync$((e: KeyboardEvent): void => {
+        if (e.key === "ArrowDown") {
+          e.preventDefault();
+        }
+      })}
+    >
+      <Slot />
+      Say hi!
+    </button>
+  );
+});

apps/node-demo/src/components/qwik/test.tsx

@@ -0,0 +1,5 @@
+import { component$ } from "@builder.io/qwik";
+
+export const Test = component$(() => {
+  return <div>test</div>;
+});

apps/node-demo/src/components/react/react-counter.tsx

@@ -0,0 +1,12 @@
+/** @jsxImportSource react */
+import { useState } from "react";
+
+export const ReactCounter = () => {
+  const [count, setCount] = useState(0);
+
+  return (
+    <button type="button" onClick={() => setCount(count + 1)}>
+      {count}
+    </button>
+  );
+};

apps/node-demo/src/env.d.ts

@@ -0,0 +1 @@
+/// <reference types="astro/client" />

apps/node-demo/src/pages/index.astro

@@ -0,0 +1,23 @@
+---
+import { ViewTransitions } from "astro:transitions";
+import { Counter } from "@components/qwik/counter";
+import { SayHi } from "@components/qwik/say-hi";
+---
+
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+		<meta name="viewport" content="width=device-width" />
+		<meta name="generator" content={Astro.generator} />
+		<title>Astro</title>
+		<ViewTransitions />
+	</head>
+	<body>
+		<div style={{ height: '1000px' }}>
+			<Counter initial={5}>Yo</Counter>
+			<SayHi>John</SayHi>
+			<a href="/test">test</a>
+		</div>
+	</body>
+</html>

apps/node-demo/src/pages/test.astro

@@ -0,0 +1,21 @@
+---
+import { ViewTransitions } from "astro:transitions";
+import { Counter } from "@components/qwik/counter";
+---
+
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+		<meta name="viewport" content="width=device-width" />
+		<meta name="generator" content={Astro.generator} />
+		<title>Astro</title>
+		<ViewTransitions />
+	</head>
+	<body>
+		<div style={{ height: '1000px' }}>
+			<Counter initial={5} />
+            <a href="/">Back home</a>
+		</div>
+	</body>
+</html>

apps/node-demo/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "extends": "astro/tsconfigs/strict",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@components/*": ["./src/components/*"]
+    },
+
+    "jsx": "react-jsx",
+    "jsxImportSource": "@builder.io/qwik"
+  }
+}