diff --git a/astro.config.mjs b/astro.config.mjs
index 9842038..fd4663b 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -4,6 +4,7 @@ import mdx from '@astrojs/mdx';
import sitemap from '@astrojs/sitemap';
import solid from '@astrojs/solid-js';
import partytown from '@astrojs/partytown';
+import vercel from '@astrojs/vercel/serverless';
import { defineAstro } from 'qgp';
import { common } from './qgp.config.mjs';
@@ -13,5 +14,7 @@ export default defineConfig({
site: 'https://qgp.app',
integrations: [mdx(), sitemap(), solid(), partytown({ config: { forward: ['dataLayer.push'] } })],
vite: defineAstro(common, {}),
+ output: 'server',
server: { port: 3000 },
+ adapter: vercel(),
});
diff --git a/package.json b/package.json
index 1b604eb..6914471 100644
--- a/package.json
+++ b/package.json
@@ -20,10 +20,14 @@
"@astrojs/rss": "^2.1.0",
"@astrojs/sitemap": "^1.0.1",
"@astrojs/solid-js": "^2.0.2",
+ "@astrojs/vercel": "^3.2.0",
+ "@qgp-js/bling": "^0.4.3",
"@solidjs/router": "^0.7.0",
"@tailwindcss/typography": "^0.5.9",
"@total-typescript/ts-reset": "^0.3.2",
+ "@types/jquery": "^3.5.16",
"astro": "^2.0.10",
+ "jquery": "^3.6.4",
"npm-run-all": "^4.1.5",
"qgp": "0.0.12",
"solid-element": "^1.6.3",
diff --git a/qgp.config.mjs b/qgp.config.mjs
index 9265dca..ad729d3 100644
--- a/qgp.config.mjs
+++ b/qgp.config.mjs
@@ -2,9 +2,11 @@
import solid from 'vite-plugin-solid';
import { defineCommon, defineVite } from 'qgp';
import checker from 'vite-plugin-checker';
+import { bling } from '@qgp-js/bling/vite';
export const common = defineCommon({
vite: {
+ plugins: [bling()],
build: {
sourcemap: true,
},
diff --git a/src/components/jquery/app.ts b/src/components/jquery/app.ts
new file mode 100644
index 0000000..b553092
--- /dev/null
+++ b/src/components/jquery/app.ts
@@ -0,0 +1,36 @@
+import { fetch$ } from '@qgp-js/bling';
+import $ from 'jquery';
+
+export const increment = fetch$(
+ async function ({ count, button }: { count: number; button: '+' | '-' }) {
+ // await new Promise((r) => setTimeout(r, 1000));
+ return {
+ count: count + (button === '+' ? 1 : -1),
+ };
+ },
+ {
+ method: 'POST',
+ }
+);
+
+const run = () => {
+ const div = $('.counter');
+ const pre = div.find('pre');
+ let count = Number(div[0].dataset.count || 0);
+ div.find('button').on('click', async function () {
+ const res = await increment({ count, button: $(this).text() as '+' | '-' });
+ count = res.count;
+ pre.text(count);
+ });
+};
+
+typeof document === 'object' && run();
+
+export const registerHandler = (x: number) => {
+ // this is done during SSR so that bling server know that we have a handler for this route
+ // it's not necessary to do it in the real app that uses real SSR, this is jQuery 😅
+ // otherise this function is not getting included into server bundle
+ if (x) {
+ increment;
+ }
+};
diff --git a/src/pages/[...bling].ts b/src/pages/[...bling].ts
new file mode 100644
index 0000000..fb28940
--- /dev/null
+++ b/src/pages/[...bling].ts
@@ -0,0 +1,18 @@
+import type { APIRoute } from 'astro';
+import { handleEvent, hasHandler } from '@qgp-js/bling/server';
+
+export const all: APIRoute = async ({ params, request }) => {
+ console.log('params', params);
+ const id = params.bling;
+ if (hasHandler('/' + id)) {
+ const res = await handleEvent({ request });
+ if (!res) {
+ throw new Error('failed to handle event');
+ }
+ return res;
+ }
+ return new Response(null, {
+ status: 404,
+ statusText: 'Not found',
+ });
+};
diff --git a/src/pages/jquery/index.astro b/src/pages/jquery/index.astro
new file mode 100644
index 0000000..2a767eb
--- /dev/null
+++ b/src/pages/jquery/index.astro
@@ -0,0 +1,26 @@
+---
+import { registerHandler } from '../../components/jquery/app';
+
+registerHandler(0);
+
+const initialCount = 1;
+---
+
+
+ Demo jQuery
+
+
+
{ initialCount }
+
+