@fastify/hotwire
TypeScript icon, indicating that this package has built-in type declarations

2.1.0 • Public • Published

@fastify/hotwire

CI NPM version js-standard-style

Do you enjoy writing applications with the hotwire pattern? We got you covered!

This plugin adds all the necessary utilities to Fastify for creating a fullstack application with Hotwire. Take a look at the example folder to see it in action!

Install

npm i @fastify/hotwire

Usage

Add the plugin to Fastify, with at least two options:

  • templates: the location of your folder with your templates
  • filename: the location of your html generator, any templating language is supported!
// in your fastify app
fastify.register(require('@fastify/hotwire'), {
  templates: join(__dirname, 'views'),
  filename: join(__dirname, 'worker.js')
})
// worker.js
module.exports = ({ file, data, fragment }) => {
  // your favorite templating library
  return 'generated html'
}

API

reply.render(filename, data)

Generates the entire initial page, it calls the worker with fragment: false

fastify.get('/', async (req, reply) => {
  return reply.render('filename', { data })
})

reply.turboGenerate.*(filename, target, data)

Every turbo stream action is supported: append, prepend, replace, update, remove. It generates and returns a turbo compatible fragment.

fastify.get('/', async (req, reply) => {
  const fragment = await reply.turboGenerate.append('filename', 'target', { data })
  // send it via SSE or websockets
})

reply.turboStream.*(filename, target, data)

Every turbo stream action is supported: append, prepend, replace, update, remove. It generates and send a turbo compatible fragment and configures the appropriate content type.

fastify.get('/', async (req, reply) => {
  return reply.turboStream.append('filename', 'target', { data })
})

License

MIT

Package Sidebar

Install

npm i @fastify/hotwire

Weekly Downloads

2

Version

2.1.0

License

MIT

Unpacked Size

19.1 kB

Total Files

16

Last publish

Collaborators

  • gurgunday
  • metcoder95
  • galvez
  • simenb
  • coopflow
  • simoneb
  • rafaelgss
  • starptech
  • delvedor
  • matteo.collina
  • allevo
  • jsumners
  • zekth
  • eomm
  • fox1t
  • airhorns
  • kibertoad
  • climba03003
  • is2ei
  • fdawgs