Libraries & Add-ons

A collection of modules built to work wonderfully with Preact.

💁 Built one of your own? Add it!

Add-Ons

• 🔁 **preact-cycle**: Functional-reactive paradigm for Preact
• 📄 **preact-render-to-string**: Universal rendering.
• ⏲ **relaks**: Create components with render methods that return asynchronously.
• 🔩 **express-preact-views**: Express View Engine.
• 💾 **Prefresh**: Fast-Refresh for Preact.
• 📑 **adonis-preact**: Use Preact in Adonisjs

Components

• 🌎 **preact-router**: URL routing for your components
• 📑 **preact-markup**: Render HTML & Custom Elements as JSX & Components
• 🛰 **preact-portal**: Render Preact components into (a) SPACE 🌌
• 📝 **preact-richtextarea**: Simple HTML editor component
• 🔖 **preact-token-input**: Text field that tokenizes input, for things like tags
• 📇 **preact-virtual-list**: Easily render lists with millions of rows (demo)
• 📐 **preact-layout**: Small and simple layout library
• 👷 **preact-helmet**: A document head manager for Preact
• ↕ **preact-custom-scrollbars**: Fully customizable scrollbars, for frictionless native browser scrolling
• 🧱 **@modular-forms/preact**: Modular and type-safe form library

Integrations

• 💭 **preact-socrates**: Preact plugin for Socrates
• 🚣 **preact-flyd**: Use flyd FRP streams in Preact + JSX
• 💬 **preact-i18nline**: Integrates the ecosystem around i18n-js with Preact via i18nline.
• 💠 **Capacitor**: Turn your Preact app into a Native iOS/Android App and PWA.
• :ice_cube: **Kretes**: Build full-stack TypeScript apps using Preact and Node.js
• 🏝: **preact-island**: Run your Preact widget on any website with reactive props.

GUI Toolkits

• 🎴 **@mui/material**: the React UI library you always wanted. Follow your own design system, or start with Material Design.
• 👍 **preact-material-components**: Material Components for the Web (supersedes MDL)
• 🔳 **preact-mdl**: Use MDL as Preact components
• 🚀 **preact-photon**: build beautiful desktop UI with photon
• 🐧 **preact-weui**: Weui for Preact
• 💅 **preact-fluid**: Fluid minimal UI kit for Preact
• 📖 **storybook-preact**: Storybook for Preact is a UI development environment for your Preact components

Testing

• 🔬 **preact-jsx-chai**: JSX assertion testing (no DOM, right in Node)
• ✅ **unexpected-preact**: JSX assertions, events, snapshots in Jest (DOM, works under Node jsdom or out-of-the-box in Jest) - docs

Utilities

• 🎩 **preact-classless-component**: create preact components without the class keyword
• 🔨 **preact-hyperscript**: Hyperscript-like syntax for creating elements
• ✅ **shallow-compare**: simplified shouldComponentUpdate helper.
• 📶 **@deepsignal/preact**: Extension of @preact/signals for full state management