Check out the requery-js website for more information.
requery.dev

Learn how to build your first requery-js Web Component in less than 60 seconds. ⚡️

#javascript #webcomponents

I was trying to find the best way to highlight how requery-js is changing Web Component development.

The answer was already in the GitHub Repository.

Languages
🔵 TypeScript 62.4%
🟠 HTML 36.6%
🟡 JavaScript 1%

36.6% HTML is almost unheard of when working with JS frameworks.

Thanks 🙌, I don’t have a dev/contribution guide yet 😅 but I am open to contributions.

My todo list includes:
- Proper docs
- Automate tests
- Contributions guide
- Add to js-framework-benchmark (I have the keyed and non-keyed src)

This is my first solo OS project so I'm learning as I go.

Thanks, Daniel, let me know what you think if you get the chance to take it for a spin. 🤓

requery-js — JavaScript Web Component Framerwork The next-generation JavaScript Web Component framework for visual developers. Supercharge your low-code projects with powerful reactivity.

Want to learn more?
requery.dev

counter.js

counter.html

GitHub - 0xJJW/requery-js: A Web Component framework that works with raw HTML A Web Component framework that works with raw HTML - 0xJJW/requery-js

There is a new JavaScript Framework in town, and it's not react-based

Introducing requery-js, a fast ⚡open-source #WebComponent framework built on @vue/reactivity

🚫 Build steps, JSX or String literals
✅ Decouple HTML & JS/TS
✅ Reactive query language

github.com/0xJJW/requer...

#Webflow

I have been working on a fun cloneable to demonstrate how to build advanced web components in #Webflow.

The main focus of this demo will be nested components communicating between components and using multiple instances of the same component.

Here is a preview for the eagle-eyed amongst you.

Absolutely, as there is no build process.

My favourite use case is using V0 to create HTML-only components and then converting them to real Web Components using ReQuery.

You can then paste the same HTML back into V0 without it messing with your JS logic, as it's decoupled.

Yes 👍

It is built on Vue-reactivity and takes a lot of inspiration from Vue.

The main difference is that rather than using many HTML directives (v-for, v-text, etc.), you use one attribute as a ref, ‘rq’, and then you can access those via .query() and chain.

component.query(”btn”).bind(…).on(…)

ReQuery + VDE for Webflow Use Loom to record quick videos of your screen and cam. Explain anything clearly and easily – and skip the meeting. An essential tool for hybrid workplaces.

The repo is currently private; it should be public by Christmas.

The only up-to-date video I have is this loom.
www.loom.com/share/bd3a26...

Lit and Fast rely on template literals, consolidating your markup with state/ logic.

The goal with ReQuery is to build a library that lets you decouple your HTML templates and JavaScript when building Web components. It's for developers using tools like Webflow, where you have "Raw HTML".

We are getting close to the launch of ReQuery, our new JavaScript Framework for building reactive Web Components on top of raw HTML templates.

Perfect for #Webflow developers looking to create interactive components.

Here are the results from our latest benchmark.

ReQuery + VDE for Webflow Use Loom to record quick videos of your screen and cam. Explain anything clearly and easily – and skip the meeting. An essential tool for hybrid workplaces.

What is a VDE? It's like DevLink but the other way around.

Check out the short video below to see how easy it is to convert a native #Webflow component into a Reactive Web Component.

www.loom.com/share/bd3a26...

Get more from 0xJJW on Patreon Fullstack developer and low-code advocate

4/ ReQuery will be my biggest contribution to the open-source community, and I'd like to share more from behind the scenes, including early access, in the coming weeks.

Want to support the project? Check out my Patreon for early access & a monthly Q&A.

www.patreon.com/c/0xjjw

3/ We don't like writing docs just as much as you don't like reading them.

So, we built an IDE (VDE) that lets you load Webflow components, add reactivity, remix and commit.

Our VDE will provide users with remixable examples and allow you to add reactivity to your Webflow components.

Learn more 👇

2/ To tackle the first two problems, we made four HUGE 🦕 changes to Aurora.

1️⃣ Switched from Preact Signals to Vue Reactivity 💚
2️⃣ Components are now native Web Components 🤓
3️⃣ Simplified the syntax (jQuery style) 🕺
4️⃣ Renamed the Lib to ReQuery 🔥

1/ Before we dive into the VDE, let's explain what we learnt from the initial feedback surrounding Aurora.

1️⃣ Signals are not a good choice for Visual Developers
2️⃣ The nested syntax was not popular
3️⃣ Users don't like reading docs

We built an IDE or, better put, a Visual Development Environment (VDE) for creating Web Components in #webflow

Why? We want to offer users of our Reactive Query Language/ Library the best experience possible.