463 lines
22 KiB
HTML
463 lines
22 KiB
HTML
<h1 id="awesome-preact-awesome">Awesome Preact <a
|
||
href="https://github.com/sindresorhus/awesome"><img
|
||
src="https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg"
|
||
alt="Awesome" /></a></h1>
|
||
<p><a
|
||
href="https://preactjs.com"><img src="https://rawgit.com/ooade/awesome-preact/master/preact-logo.svg" align="right" width="100"></a></p>
|
||
<blockquote>
|
||
<p>A curated list of amazingly awesome things regarding <a
|
||
href="https://github.com/developit/preact">Preact</a> ecosystem
|
||
:star2:</p>
|
||
</blockquote>
|
||
<p><a href="https://github.com/developit/preact">Preact</a> is a fast
|
||
3kb React alternative with the same ES6 API. Components & Virtual
|
||
DOM.</p>
|
||
<h2 id="contents">Contents</h2>
|
||
<ul>
|
||
<li><a href="#community">Community</a></li>
|
||
<li><a href="#toolkits">Toolkits</a></li>
|
||
<li><a href="#boilerplates">Boilerplates</a></li>
|
||
<li><a href="#routing">Routing</a></li>
|
||
<li><a href="#components">Components</a></li>
|
||
<li><a href="#libraries">Libraries</a></li>
|
||
<li><a href="#testing-utils">Testing Utils</a></li>
|
||
<li><a href="#articles">Articles</a></li>
|
||
<li><a href="#example-apps">Example Apps</a></li>
|
||
<li><a href="https://preactjs.com/about/we-are-using">Real Apps</a></li>
|
||
<li><a href="#related-libraries">Related Libraries</a></li>
|
||
<li><a href="#tips">Tips</a></li>
|
||
</ul>
|
||
<h3 id="community">Community</h3>
|
||
<ul>
|
||
<li><a href="https://chat.preactjs.com/">Slack</a> (Discussion
|
||
Forum)</li>
|
||
<li><a href="https://stackoverflow.com/questions/tagged/preact">Stack
|
||
Overflow</a></li>
|
||
<li><a href="https://github.com/developit/preact">Github</a></li>
|
||
<li><a href="https://twitter.com/preactjs">Twitter</a></li>
|
||
</ul>
|
||
<h3 id="toolkits">Toolkits</h3>
|
||
<ul>
|
||
<li><a href="https://github.com/developit/preact-cli">Preact CLI</a> -
|
||
Build a Preact Progressive Web App in seconds.</li>
|
||
<li><a href="https://github.com/vitejs/vite">Vite</a> - Fast native-ESM
|
||
powered web dev build tool for Preact, Vue or React.</li>
|
||
<li><a href="https://github.com/insin/nwb">nwb</a> - Quick Development
|
||
with React, Inferno or Preact.</li>
|
||
<li><a href="https://github.com/timarney/react-app-rewired">React App
|
||
Rewire Preact</a> - Use Preact with create-react-app without
|
||
ejecting.</li>
|
||
<li><a href="https://github.com/SaraVieira/preact-cli-postcss">Preact
|
||
CLI PostCSS</a> - It removes the default postcss config on Preact CLI,
|
||
so you can use postcss.config.js.</li>
|
||
<li><a href="https://github.com/just-boris/create-preact-app">Create
|
||
Preact App</a> - Create Preact apps with no build configuration.</li>
|
||
<li><a
|
||
href="https://github.com/storybooks/storybook/tree/next/app/preact">Storybook
|
||
Preact</a> - Storybook for Preact is a UI development environment for
|
||
your Preact components.</li>
|
||
</ul>
|
||
<h3 id="boilerplates">Boilerplates</h3>
|
||
<ul>
|
||
<li><a href="https://github.com/developit/preact-boilerplate">Official
|
||
Boilerplate</a> - Ready-to-rock Preact starter project, powered by
|
||
Webpack.</li>
|
||
<li><a href="https://github.com/ooade/PreactSimpleStarter">Preact Simple
|
||
Starter</a> - PWA Simple Starter with Preact, Preact-mdl and
|
||
Webpack2.</li>
|
||
<li><a href="https://github.com/lukeed/preact-starter">Preact Offline
|
||
Starter</a> - Webpack2 boilerplate for building SPA / PWA / offline
|
||
front-end apps with Preact.</li>
|
||
<li><a
|
||
href="https://github.com/nickytonline/ts-preact-starter">TypeScript
|
||
Preact Starter</a> - Barebones starter project for Preact with
|
||
TypeScript.</li>
|
||
<li><a
|
||
href="https://github.com/bmitchinson/preact-typescript-pwa-starter">TypeScript
|
||
PWA Preact Starter</a> - PWA Starter with TypeScript and SASS
|
||
(131kb)</li>
|
||
<li><a
|
||
href="https://github.com/yoctopuce-examples/electron-typescript-preact-boilerplate">Electron
|
||
TypeScript Preact Boilerplate</a> - Electron starter project with
|
||
TypeScript and Preact support, powered by esbuild.</li>
|
||
<li><a
|
||
href="https://github.com/kolodziejczakM/preact-modern-startupper">Preact
|
||
Modern Startupper</a> - PWA boilerplate with support for TypeScript,
|
||
Goober, Unistore and Plop.</li>
|
||
<li><a href="https://github.com/csbun/preact-redux-ssr-example">Preact
|
||
Redux SSR Example</a> - Server-side Rendering with Redux Example.</li>
|
||
<li><a href="https://github.com/ezekielchentnik/preact-pwa">Preact
|
||
PWA</a> - PWA focused on raw performance, server side rendering,
|
||
prerendering, redux, express, rollup.</li>
|
||
<li><a href="https://github.com/debdut/preact-chrome-extension">Preact
|
||
Chrome Extension</a> - A Full Feature Preact Chrome Extension Starter
|
||
Kit.</li>
|
||
<li><a href="https://github.com/PiyushSuthar/preact-webext">Preact Web
|
||
Extension</a> - ⚡️ WebExtension Vite Starter Template with Preact.</li>
|
||
<li><a
|
||
href="https://github.com/ernest-rudnicki/preact-neutralino-typescript-starter">Preact
|
||
Neutralino TypeScript Starter</a> - Starter project for building
|
||
lightweight desktop applications with Preact and neutralino.js.</li>
|
||
<li><a href="https://github.com/nesterow/minizavr">Simple Deno
|
||
Starter</a> - Tiny starter template with Preact and Deno for building
|
||
single page applications.</li>
|
||
</ul>
|
||
<h3 id="routing">Routing</h3>
|
||
<ul>
|
||
<li><a href="https://github.com/developit/preact-router">Preact
|
||
Router</a> - URL router for Preact.</li>
|
||
<li><a href="https://github.com/mjanssen/preact-route-async">Preact
|
||
Route Async</a> - A (440b gzip) route component that enables async
|
||
loading of page-components.</li>
|
||
<li><a href="https://github.com/molefrog/wouter">Wouter</a> - A tiny
|
||
(1KB gzip) router for Preact/React with React Router-like API.</li>
|
||
</ul>
|
||
<h3 id="components">Components</h3>
|
||
<ul>
|
||
<li><a
|
||
href="https://github.com/prateekbh/preact-material-components">Preact
|
||
Material Components</a> - Preact wrapper for “Material Components for
|
||
the web”.</li>
|
||
<li><a href="https://github.com/lukeed/preact-scroll-header">Preact
|
||
Scroll Header</a> - A (800b gzip) header that will show/hide while
|
||
scrolling for Preact.</li>
|
||
<li><a href="https://github.com/lukeed/preact-progress">Preact
|
||
Progress</a> - Simple and lightweight (~590 bytes gzip) progress bar
|
||
component for Preact.</li>
|
||
<li><a href="https://github.com/preactjs/preact-compat">Preact
|
||
Compat</a> - Use any React library with Preact <em>(<a
|
||
href="https://github.com/developit/preact-compat-example">full
|
||
example</a>)</em>.</li>
|
||
<li><a href="https://github.com/preactjs/preact-render-to-string">Preact
|
||
Render To String</a> - Universal rendering.</li>
|
||
<li><a href="https://github.com/developit/preact-markup">Preact
|
||
Markup</a> - Render HTML & Custom Elements as JSX &
|
||
Components.</li>
|
||
<li><a href="https://github.com/developit/preact-portal">Preact
|
||
Portal</a> - Render Preact components into (a) SPACE.</li>
|
||
<li><a href="https://github.com/developit/preact-richtextarea">Preact
|
||
Richtextarea</a> - Simple HTML editor component.</li>
|
||
<li><a href="https://github.com/developit/preact-token-input">Preact
|
||
Token Input</a> - Text field that tokenizes input, for things like
|
||
tags.</li>
|
||
<li><a href="https://github.com/developit/preact-virtual-list">Preact
|
||
Virtual List</a> - Easily render lists with millions of rows (<a
|
||
href="https://jsfiddle.net/developit/qqan9pdo/">demo</a>).</li>
|
||
<li><a href="https://github.com/developit/preact-cycle">Preact Cycle</a>
|
||
- Functional-reactive paradigm for Preact.</li>
|
||
<li><a href="https://download.github.io/preact-layout/">Preact
|
||
Layout</a> - Small and simple layout library.</li>
|
||
<li><a href="https://github.com/matthewmueller/preact-socrates">Preact
|
||
Socrates</a> - Preact plugin for <a
|
||
href="http://github.com/matthewmueller/socrates">Socrates</a>.</li>
|
||
<li><a href="https://github.com/xialvjun/preact-flyd">Preact Flyd</a> -
|
||
Use <a href="https://github.com/paldepind/flyd">flyd</a> FRP streams in
|
||
Preact + JSX.</li>
|
||
<li><a href="https://github.com/download/preact-i18nline">Preact
|
||
I18nline</a> - Integrates the ecosystem around <a
|
||
href="https://github.com/everydayhero/i18n-js">i18n-js</a> with Preact
|
||
via <a href="https://github.com/download/i18nline">i18nline</a>.</li>
|
||
<li><a href="https://github.com/luisvinicius167/preact-mui">Preact
|
||
MUI</a> - The MUI CSS Preact library.</li>
|
||
<li><a href="https://github.com/developit/preact-mdl">Preact MDL</a> -
|
||
Use <a href="https://getmdl.io">MDL</a> as Preact components.</li>
|
||
<li><a href="https://github.com/developit/preact-photon">Preact
|
||
Photon</a> - Build beautiful desktop UI with <a
|
||
href="http://photonkit.com">photon</a>.</li>
|
||
<li><a
|
||
href="https://github.com/ld0rman/preact-classless-component">Preact
|
||
Classless Component</a> - Create preact components without the class
|
||
keyword.</li>
|
||
<li><a href="https://github.com/queckezz/preact-hyperscript">Preact
|
||
Hyperscript</a> - Hyperscript-like syntax for creating elements.</li>
|
||
<li><a href="https://github.com/tkh44/shallow-compare">Shallow
|
||
Compare</a> - Simplified <code>shouldComponentUpdate</code> helper.</li>
|
||
<li><a href="https://github.com/vutran/preact-codemod">Preact
|
||
Codemod</a> - Transform your React code to Preact.</li>
|
||
<li><a href="https://github.com/download/preact-helmet">Preact
|
||
Helmet</a> - A document head manager for Preact.</li>
|
||
<li><a href="https://github.com/NekR/preact-delegate">Preact
|
||
Delegate</a> - Delegate DOM events.</li>
|
||
<li><a href="https://github.com/gufsky/preact-no-ssr">Preact No SSR</a>
|
||
- Skip Server Side Rendering of Components.</li>
|
||
<li><a href="https://github.com/matthewmueller/preact-head">Preact
|
||
Head</a> - Standalone, declarative <Head /> for Preact.</li>
|
||
<li><a href="https://github.com/ooade/preact-side-effect">Preact Side
|
||
Effect</a> - Create components whose nested prop changes map to a global
|
||
side effect.</li>
|
||
<li><a href="https://github.com/KwanMan/preact-tiny-atom">Preact Tiny
|
||
Atom</a> - Preact Integration with <a
|
||
href="https://github.com/qubitproducts/tiny-atom">Tiny Atom</a>.</li>
|
||
<li><a href="https://github.com/juliangruber/preact-level-list">Preact
|
||
Level List</a> - Live updating leveldb list component for Preact.</li>
|
||
<li><a href="https://github.com/bboydflo/flagstrap-preact">Preact
|
||
Country Picker</a> - Country picker based on bootstrap 3 made for
|
||
Preact.</li>
|
||
<li><a href="https://github.com/ajainvivek/preact-fluid">Preact
|
||
Fluid</a> - A minimal UI kit for Preact.</li>
|
||
<li><a href="https://github.com/ForsakenHarmony/preact-feather">Preact
|
||
Feather Icons</a> - Feather icons for Preact.</li>
|
||
<li><a
|
||
href="https://github.com/Sobesednik/preact-animate-on-change">Preact
|
||
Animate On Change</a> - Add CSS3 animation when properties change.</li>
|
||
<li><a href="https://github.com/prateekbh/preact-async-route">Preact
|
||
Async Route</a> - Async route component for preact-router.</li>
|
||
<li><a href="https://github.com/mobiushorizons/mu-forms">MU Forms</a> -
|
||
Dead simple form library for (P)React.</li>
|
||
<li><a href="https://github.com/ooade/pimg">Pimg</a> - Progressive Image
|
||
Component; Used for lazy loading images.</li>
|
||
<li><a href="https://github.com/haensl/preact-component-console">Preact
|
||
Component Console</a> - Console Emulator. Simulates typing via dynamic
|
||
delays.</li>
|
||
<li><a href="https://github.com/DenysVuika/preact-translate">Preact
|
||
Translate</a> - Minimalistic translate (i18n) library for Preact.</li>
|
||
<li><a href="https://github.com/TimDaub/preact-touchable-dock">Preact
|
||
Dock</a> - Simple DnD and touch-enabled Dock for Preact apps.</li>
|
||
<li><a href="https://github.com/matteobruni/tsparticles#preact">Preact
|
||
Particles</a> - Lightweight component to easily add cool particles
|
||
animations to websites.</li>
|
||
<li><a href="https://github.com/webyom/pant">Pant</a> - Mobile UI
|
||
Components built on Preact <em>(<a
|
||
href="https://webyom.github.io/pant">docs and demos</a>)</em>. Ported
|
||
from awesome Vue components of <a
|
||
href="https://github.com/youzan/vant">Vant</a>.</li>
|
||
<li><a href="https://github.com/fakundo/preact-transitioning">Preact
|
||
Transitioning</a> - Exposes Preact components for easily implementing
|
||
basic CSS animations and transitions.</li>
|
||
<li><a href="https://github.com/TimDaub/preact-nominal-allocator">Preact
|
||
Nominal Allocator</a> - A numerical input element that can also
|
||
manipulated with two buttons (-/+).</li>
|
||
<li><a href="https://github.com/nesterow/tailored">Tailored
|
||
Components</a> - Unstyled components and hooks for Preact &
|
||
Deno.</li>
|
||
<li><a href="https://shelacek.bitbucket.io/plotery">Plotery</a> - Fast
|
||
and lightweight charting library.</li>
|
||
<li><a href="https://shelacek.bitbucket.io/formica">Formica</a> - Simple
|
||
declarative forms for Preact.</li>
|
||
</ul>
|
||
<h3 id="libraries">Libraries</h3>
|
||
<ul>
|
||
<li><a href="https://github.com/concretesolutions/redux-zero">Redux
|
||
Zero</a> - A lightweight state container based on Redux with a single
|
||
store and no reducers.</li>
|
||
<li><a href="https://github.com/developit/unistore">Unistore</a> - 350b
|
||
/ 650b state container with component actions for Preact &
|
||
React.</li>
|
||
<li><a href="https://github.com/UnwrittenFun/fpreact">FPreact</a> -
|
||
Provides an alternative api for creating preact components, heavily
|
||
inspired by elm.</li>
|
||
<li><a href="https://proppyjs.com">ProppyJS - A tiny library for
|
||
functional props composition</a></li>
|
||
<li><a href="https://github.com/Autodesk/clearx">ClearX</a> - Fast &
|
||
Effortless state management for React, Preact and Inferno with zero
|
||
learning curve.</li>
|
||
<li><a
|
||
href="https://github.com/FormidableLabs/urql/tree/master/packages/preact-urql">Preact-urql</a>
|
||
- Use <a href="https://github.com/FormidableLabs/urql">urql</a> with
|
||
Preact core + hooks.</li>
|
||
<li><a
|
||
href="https://github.com/JoviDeCroock/hooked-head">hooked-head</a> -
|
||
Hooks to manipulate the <code><head></code> section of the DOM.
|
||
This has a subpackage with core preact support (using
|
||
<code>preact/hooks</code>).</li>
|
||
<li><a href="https://github.com/teafuljs/teaful">Teaful</a> - Tiny
|
||
(800B), easy and powerful (P)React state management.</li>
|
||
<li><a href="https://github.com/nanostores/nanostores">Nano Stores</a> -
|
||
A tiny (199 bytes) state manager with many atomic tree-shakable
|
||
stores.</li>
|
||
<li><a href="https://github.com/fabian-hiller/modular-forms">Modular
|
||
Forms</a> - Modular, type-safe and signal based form library for
|
||
Preact.</li>
|
||
<li><a href="https://github.com/Marcisbee/exome">exome</a> - Simple
|
||
proxy based state manager for deeply nested states.</li>
|
||
<li><a href="https://fastro.deno.dev">Fastro</a> - Fast & Modular
|
||
SSR Web Framework for Deno, TypeScript, Preact & Tailwind.</li>
|
||
</ul>
|
||
<h3 id="testing-utils">Testing Utils</h3>
|
||
<ul>
|
||
<li><a href="https://github.com/developit/preact-jsx-chai">Preact JSX
|
||
Chai</a> - JSX assertion testing <em>(no DOM, right in Node)</em>.</li>
|
||
<li><a href="https://github.com/mzgoddard/preact-render-spy">Preact
|
||
Render Spy</a> - Render Preact components with access to the produced
|
||
virtual dom for testing.</li>
|
||
<li><a href="https://github.com/windyGex/preact-test-utils">Preact Test
|
||
Utils</a> - Mock react-test-utils enzyme in preact.</li>
|
||
<li><a
|
||
href="https://github.com/antoaravinth/preact-testing-library">Preact
|
||
Testing Library</a> - Simple and complete Preact DOM testing utilities
|
||
that encourage good testing practices.</li>
|
||
<li><a href="https://github.com/mwood23/preact-island">Preact Island</a>
|
||
- Render your Preact component as a widget on any web page with
|
||
ease.</li>
|
||
</ul>
|
||
<h3 id="articles">Articles</h3>
|
||
<ul>
|
||
<li><a href="https://jasonformat.com/wtf-is-jsx/">WTF is JSX</a></li>
|
||
<li><a
|
||
href="https://medium.com/@rajaraodv/the-inner-workings-of-virtual-dom-666ee7ad47cf">The
|
||
Inner Workings of Virtual DOM</a></li>
|
||
<li><a
|
||
href="https://medium.com/@rajaraodv/using-preact-instead-of-react-70f40f53107c">Using
|
||
Preact Instead of React</a></li>
|
||
<li><a
|
||
href="https://medium.com/@asolove/preact-internals-1-the-easy-parts-3a081fa36205#.twnc3doig">Preact
|
||
Internals #1: The Easy Parts</a></li>
|
||
<li><a
|
||
href="https://medium.com/@asolove/preact-internals-2-the-component-model-36a05e32957b#.8zyec2y9v">Preact
|
||
Internals #2: The Component Model</a></li>
|
||
<li><a
|
||
href="https://dandenney.com/posts/front-end-dev/building-a-small-pwa-with-preact-and-firebase">Building
|
||
a Small PWA with Preact and Firebase</a></li>
|
||
<li><a
|
||
href="https://auth0.com/blog/preact-authentication-tutorial">Authentication
|
||
with Auth0</a></li>
|
||
</ul>
|
||
<h3 id="example-apps">Example Apps</h3>
|
||
<ul>
|
||
<li><a href="https://github.com/kristoferbaxter/preact-hn">Preact HN</a>
|
||
- Demonstration of Preact used to build Hacker News as a PWA.</li>
|
||
<li><a href="https://github.com/developit/preact-todomvc">TodoMVC</a> -
|
||
TodoMVC done in Preact. Under 6kb and fast.</li>
|
||
<li><a href="https://github.com/lukeed/colors-app">Colors App</a> - PWA
|
||
for copying values from popular color palettes. Supports HEX, RGB, and
|
||
HSL formats.</li>
|
||
<li><a href="https://github.com/jordic/tracks_preact/">Tracks</a> - PWA
|
||
for tracking things in general. Gdrive Sync.</li>
|
||
<li><a href="https://github.com/kvartborg/hueify">Hueify</a> - Simple
|
||
controller for your Philips Hue lights.</li>
|
||
<li><a href="https://github.com/sobstel/golazon">Golazon</a> - Football
|
||
data mnmlist way.</li>
|
||
<li><a
|
||
href="https://github.com/ibm-watson-data-lab/shopping-list-preact-pouchdb">Shopping
|
||
List</a> - Progressive Web App Built Using Preact and PouchDB.</li>
|
||
<li><a href="https://github.com/code-and-comment/code-and-comment">Code
|
||
and Comment</a> - The application to add the comments to a file in
|
||
Github (<a
|
||
href="https://code-and-comment.github.io/code-and-comment/">demo</a>).</li>
|
||
<li><a href="https://play.cash">Play.cash</a> :notes: <em>(<a
|
||
href="https://github.com/feross/play.cash">GitHub Project</a>)</em></li>
|
||
<li><a href="https://www.songsterr.com">Songsterr</a> 🎼 Using Preact X
|
||
in production since 10.0 alpha</li>
|
||
<li><a href="https://bitmidi.com/">BitMidi</a> 🎹 Wayback machine for
|
||
free MIDI files <em>(<a
|
||
href="https://github.com/feross/bitmidi.com">GitHub
|
||
Project</a>)</em></li>
|
||
<li><a href="https://www.ultimate-guitar.com">Ultimate Guitar</a>
|
||
🎸speed boosted by Preact.</li>
|
||
<li><a href="http://esbench.com">ESBench</a> is built using Preact.</li>
|
||
<li><a href="https://bigwebquiz.com">BigWebQuiz</a> <em>(<a
|
||
href="https://github.com/jakearchibald/big-web-quiz">GitHub
|
||
Project</a>)</em></li>
|
||
<li><a href="http://nectarine.rocks">Nectarine.rocks</a> <em>(<a
|
||
href="https://github.com/developit/nectarine">GitHub Project</a>)</em>
|
||
:peach:</li>
|
||
<li><a href="https://oss.ninja">OSS.Ninja</a> <em>(<a
|
||
href="https://github.com/developit/oss.ninja">GitHub
|
||
Project</a>)</em></li>
|
||
<li><a href="https://gurivr.com">GuriVR</a> <em>(<a
|
||
href="https://github.com/opennewslabs/guri-vr">GitHub
|
||
Project</a>)</em></li>
|
||
<li><a href="https://use-the-platform.com/offline-gallery/">Offline
|
||
Gallery</a> <em>(<a
|
||
href="https://github.com/vaneenige/offline-gallery/">GitHub
|
||
Project</a>)</em> :balloon:</li>
|
||
<li><a href="https://use-the-platform.com/periodic-weather/">Periodic
|
||
Weather</a> <em>(<a
|
||
href="https://github.com/vaneenige/periodic-weather/">GitHub
|
||
Project</a>)</em> :sunny:</li>
|
||
<li><a href="http://nbrugby.com">Rugby News Board</a> <em><a
|
||
href="https://github.com/rugby-board/rugby-board-node">(GitHub
|
||
Project)</a></em></li>
|
||
<li><a href="https://preact.gallery/">Preact Gallery</a> an 8KB photo
|
||
gallery PWA built using Preact.</li>
|
||
<li><a href="https://use-the-platform.com/rainbow-explorer/">Rainbow
|
||
Explorer</a> Preact app to translate real life color to digital color
|
||
<em>(<a href="https://github.com/vaneenige/rainbow-explorer">Github
|
||
project</a>)</em>.</li>
|
||
<li><a href="https://carlosqsilva.github.io/YASCC/#/">YASCC</a> Yet
|
||
Another SoundCloud Client <em>(<a
|
||
href="https://github.com/carlosqsilva/YASCC">Github
|
||
project</a>)</em>.</li>
|
||
<li><a href="https://preact-journal.herokuapp.com/">Journalize</a> 14k
|
||
offline-capable journaling PWA using preact. <em>(<a
|
||
href="https://github.com/jpodwys/preact-journal">Github
|
||
project</a>)</em>.</li>
|
||
<li><a href="https://proxx.app">Proxx</a> A game of proximity by
|
||
GoogleChromeLabs using preact. <em>(<a
|
||
href="https://github.com/GoogleChromeLabs/proxx">Github
|
||
project</a>)</em>.</li>
|
||
<li><a href="https://webmaker.app">Web Maker</a> An offline and blazing
|
||
fast frontend playground built using Preact. <em>(<a
|
||
href="https://github.com/chinchang/web-maker">Github
|
||
project</a>)</em>.</li>
|
||
<li><a href="https://www.intergram.xyz">Intergram</a> A live chat widget
|
||
linked to your Telegram messenger built using Preact. <em>(<a
|
||
href="https://github.com/idoco/intergram">Github project</a>)</em>.</li>
|
||
<li><a href="https://vanilla-preact.surge.sh">Preact App in ES6 without
|
||
Babel or JSX</a> <em>(<a
|
||
href="https://github.com/safdarjamal/vanilla-preact/">GitHub
|
||
Project</a>)</em>.</li>
|
||
<li><a href="https://code2k.github.io/ghfresh/">GHFresh</a> Monitor
|
||
GitHub repository releases – Prerendering with Preact. Built with Preact
|
||
Compat, TypeScript, Material-UI and Redux Toolkit. <em>(<a
|
||
href="https://github.com/code2k/ghfresh">GitHub Project</a>)</em>.</li>
|
||
<li><a href="https://passwords-fountain.com/">Passwords Fountain</a> -
|
||
modern & performant password manager interface which works
|
||
everywhere <em>(<a
|
||
href="https://github.com/kolodziejczakM/passwords-fountain">Github
|
||
project</a>)</em>.</li>
|
||
<li><a href="https://macos-preact.now.sh">macOS Web</a> - macOS Big Sur
|
||
Desktop experience for Web, built with Preact and Vite <em>(<a
|
||
href="https://github.com/PuruVJ/macos-preact">Github
|
||
project</a>)</em>.</li>
|
||
<li><a href="https://cinemate.me">Cinemate</a> - Movie Recommender
|
||
System built with Preact and TypeScript. Backend written in Rust.</li>
|
||
<li><a href="https://win11.vercel.app">Windows 11 Web</a> - Awe-amazing
|
||
Windows 11 clone for the web! ⚡ <em>(<a
|
||
href="https://github.com/PiyushSuthar/Windows-11-Web">Github
|
||
project</a>)</em>.</li>
|
||
<li><a href="https://miftikcz.github.io/idea-keeper-2">Idea Keeper</a>
|
||
:brain: Highly extensible and minimalistic idea keeping app <em>(<a
|
||
href="https://github.com/MiftikCZ/idea-keeper-2">GitHub
|
||
Project</a>)</em>.</li>
|
||
<li><a href="https://trellith.sakih.net/">Trellith</a> - Tiny Trello
|
||
Clone PWA (<a href="https://github.com/sakihet/trellith">GitHub
|
||
Project</a>).</li>
|
||
<li><a href="https://gladysassistant.com/">Gladys Assistant</a> - A
|
||
privacy-first, open-source home assistant <em>(<a
|
||
href="https://github.com/GladysAssistant/Gladys">GitHub
|
||
Project</a>)</em>.</li>
|
||
</ul>
|
||
<h3 id="related-libraries">Related Libraries</h3>
|
||
<ul>
|
||
<li><a href="https://github.com/facebook/react">React</a> - A
|
||
declarative, efficient, and flexible JavaScript library for building
|
||
user interfaces.</li>
|
||
<li><a href="https://github.com/infernojs/inferno">Inferno</a> - An
|
||
extremely fast, React-like JavaScript library for building modern user
|
||
interfaces.</li>
|
||
<li><a href="https://github.com/alibaba/rax">Rax</a> - A universal
|
||
React-compatible render engine.</li>
|
||
</ul>
|
||
<h3 id="tips">Tips</h3>
|
||
<p>Contribute some ;)</p>
|
||
<table style="width:6%;">
|
||
<colgroup>
|
||
<col style="width: 5%" />
|
||
</colgroup>
|
||
<tbody>
|
||
<tr class="odd">
|
||
<td>### Contribution Your contributions and suggestions are welcome
|
||
anytime. Build great stuffs with Preact, share with us ;) <br/> Make
|
||
sure you follow the <a href="/contributing.md">guidelines</a>. Thank
|
||
you!</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<h3 id="license">License</h3>
|
||
<p><a href="http://creativecommons.org/publicdomain/zero/1.0/"><img
|
||
src="http://mirrors.creativecommons.org/presskit/buttons/88x31/svg/cc-zero.svg"
|
||
alt="CC0" /></a></p>
|
||
<p><a href="https://github.com/preactjs/awesome-preact">preact.md
|
||
Github</a></p>
|