https://github.com/herudi/hx-page

Effortless Htmx in Deno.
https://github.com/herudi/hx-page

deno denodeploy deploy htmx nextjs

Last synced: 4 months ago
JSON representation

Effortless Htmx in Deno.

• Host: GitHub
• URL: https://github.com/herudi/hx-page
• Owner: herudi
• License: mit
• Created: 2024-01-25T04:33:32.000Z (over 1 year ago)
• Default Branch: master
• Last Pushed: 2024-01-29T09:11:26.000Z (over 1 year ago)
• Last Synced: 2025-01-10T19:57:06.618Z (5 months ago)
• Topics: deno, denodeploy, deploy, htmx, nextjs
• Language: TypeScript
• Homepage: https://hxp.deno.dev
• Size: 23.4 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# HX-Page

Effortless [Htmx](https://htmx.org) in [Deno](https://deno.com).

## Features

- NextJS Router like.

- Helmet Support.

- AsyncComponent support.

- Middleware support : `ETag`, `cache-control`, `twind` and more.

- Including Hooks : `useRequestEvent`, `useRouter`, `useBody` and more.

## Starter

```bash

deno run -Ar https://hxp.deno.dev my_app

```

```bash

cd my_app

// dev

deno task dev

// prod

deno task start

```

## Code Snippet

```tsx

// pages/todo.tsx

import { FC, Helmet, hx, useBody } from "hxp";

type Todo = { text: string };

const addTodo = hx.post(async () => {

  const todo = useBody();

  // example save todo to db.

  await db.todo.save(todo);

  return 
{todo.text}
;

});


const Todo: FC = async () => {

  // example load todos from db.

  const todos = await db.todo.findAll();

  return (

    <>

      

        Todo

      

      

        

        Submit

      

      


        {todos.map((todo) => 
{todo.text}
)}

      

    >

  );

};


export default Todo;

```

## Deploy

```bash

// generate page first

deno task pages

// deploy

deployctl deploy --prod --project=my_app main.ts

```

more => https://hxp.deno.dev

## License

[MIT](LICENSE)