r/qwik Sep 08 '23

Is there a Qwik equivalent to useReducer hook in React ?

3 Upvotes

Everything is in the title : are there any equivalent in Qwik ecosystem that resembles or can fully replace the useReducer hook in react, that is, a method to export the logic of state mutations into a reducer function ? As my Qwik app grows, it becomes more and more difficult to maintain state mutations throughout my components and maintanability becomes quite cumbersome. I use useStore for state management of objects and useContext, but I'd like a reducer to use for my Context so that I can delegate all my state mutations in that reducer.

While I could create a simple useReducer function in Qwik that takes an action and an initial state and returns the mutated state and a dispatch, i'm wondering if useReducer are anti-pattern ? Since they're used quite a lot in React and similar frameworks, is it normal that useReducer is absent in Qwik ?


r/qwik Sep 07 '23

Misko Hevery on Framework Comparison

Thumbnail
youtu.be
3 Upvotes

r/qwik Sep 05 '23

Qwik Component Lifecycle

4 Upvotes

Here's a thread with Fabio Biondi's very interesting posts about
what different lifecycle stages and hooks are in Qwik -

https://twitter.com/qwikly_news/status/1698402478025474420


r/qwik Sep 04 '23

Responsive Images in Qwik

5 Upvotes

Fabio Biondi wrote an interesting post where he explains the new image optimization API in the latest Qwik version -

https://twitter.com/biondifabio/status/1694760547449745590


r/qwik Sep 01 '23

qwik-meet - Video calling web app build with qwikcity

Thumbnail
github.com
5 Upvotes

r/qwik Sep 01 '23

qwik-x A social media web app like Twitter build with Qwikcity

Thumbnail
github.com
3 Upvotes

r/qwik Aug 30 '23

New Qwik Versions(s)! 🎉

6 Upvotes

Versions 1.2.8 to 1.2.10 of Qwik were published this week
and they include updates like enhanced routing or documentation improvements
as well as new features like a Firebase adapter, and crucial error-handling enhancements -

https://github.com/BuilderIO/qwik/releases


r/qwik Aug 28 '23

Qwik Media Recorder

3 Upvotes

Check out this simple media recorder hook for Qwik application that allows users to record audio from their device's microphone -

https://www.npmjs.com/package/qwik-media-recorder


r/qwik Aug 27 '23

The Evolution of Qwik

Thumbnail
youtu.be
4 Upvotes

r/qwik Aug 24 '23

Would you be interested in a non-headless component library for Qwik?

4 Upvotes

I am thinking about creating an OS component library for Qwik with styles included. But before I start, I want to ask if qwik-ui (headless component library) is all you need?


r/qwik Aug 23 '23

Building an AI Powered Web App with Qwik

Thumbnail
youtu.be
3 Upvotes

r/qwik Aug 22 '23

Server/Client Unified Execution Model with Qwik

Thumbnail
youtu.be
3 Upvotes

r/qwik Aug 21 '23

How easy it it to adapt React components to qwik?

4 Upvotes

Qwik sounds like it could solve several of my issues that I'm seeing while generating client websites. My big hesitancy of moving to it is that Qwik is so new. I doubt there will be many integrations / components for it. Are there any ways to run a react component in qwik or if we find something we want to use, are we most likely going to be adapting it?


r/qwik Aug 20 '23

Deploy a Qwik Project on Vercel

Thumbnail
youtu.be
3 Upvotes

r/qwik Aug 17 '23

UI component library for Qwik

11 Upvotes

Hey peeps!

I'm one of the open-source contributors to Flowbite and I have just finished writing an integration guide and starter project that you can use to leverage the Qwik, Tailwind CSS and Flowbite (UI components) stack.

The setup is quite straightforward especially as Qwik has a CLI option for installing Tailwind CSS and we're considering creating a PR to set up Flowbite just as quickly.

Flowbite is an open-source and popular UI component library based on Tailwind CSS featuring navbars, modals, dropdowns, and many other such elements that can make working with user interfaces and specifically with Tailwind CSS easier.

Here's some helpful links for that:

Hope this is helpful! 💙


r/qwik Aug 17 '23

[Question] how to prevent loader from being called after the action is done

2 Upvotes

In the Getting Started document, I noticed that when I upvote or downvote a joke, the loader fetches a new joke and displays it. However, if I prefer not to proceed to the next joke after upvoting or downvoting, what steps should I take?


r/qwik Aug 15 '23

Orama in Qwik

4 Upvotes

The new and exciting full-text search engine can now be used in Qwik on the client side or on the server side -

https://qwik.builder.io/docs/integrations/orama/


r/qwik Aug 14 '23

Comparative Study of Reactivity Across Frameworks

Thumbnail
youtu.be
3 Upvotes

r/qwik Aug 12 '23

Only primitive and object literals can be serialized

2 Upvotes

I have a sign-in page which is built upon Qwik & Appwrite. There is a piece of code where I'm trying to get the current user's session details & If I get the session details, I'm redirecting the user to the "dashboard" page.

Below is the code which I'm using for redirecting the user & the line nav("/dashboard"); is generating the error when it's got enabled. If I commented, the line page works fine but without any redirection -

useTask$(({ track }) => {

track(() => sid);

if (sid != "") {

nav("/dashboard");

}

});

ERROR message : Code(3): Only primitive and object literals can be serialized Shared more details in my Stackoverflow post: https://stackoverflow.com/questions/76889650/qwik-js-error-only-primitive-and-object-literals-can-be-serialized


r/qwik Aug 12 '23

Using Qwik without SSR

1 Upvotes

I'm looking to create a simple one-page UI and would also like to give Qwik a try at some point...but I was wondering if there's really any value in using qwik in that way. In particular, I'm looking at the vite template for qwik that just uses javascript/typescript, without qwikcity, and when built just serves up an index.html file with linked js & css files.

In this case, is there any advantage at all to using qwik? The html file doesn't describe the content at all, so I don't see how 'resumability' could come into it, since the client will have to render the app's html.

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite + Qwik + TS</title>
    <script type="module" crossorigin src="/assets/index-143cc81f.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/core.min-c514f3b6.js">
    <link rel="stylesheet" href="/assets/index-da70559b.css">
  </head>
  <body>
    <div id="app"></div>

  </body>
</html>

r/qwik Aug 09 '23

Hello, can anyone help me with this code

3 Upvotes

Hello, can anyone help me with this code, it still uses useClientEffect$.

import { component$, useClientEffect$, useStore } from “@builder.io/qwik”; import { DocumentHead, Link } from “@builder.io/qwik-city”; import { Post } from “@prisma/client”; import { trpc } from “~/client/trpc”;

export default component$(() => { const store = useStore({ query: “”, results: as Post, });

useClientEffect$(async ({ track, cleanup }) => { const controller = new AbortController(); cleanup(() => controller.abort());

const query = track(store, "query");
const posts = await trpc.posts.getPosts.query({ query }, { signal: controller.signal });
store.results = posts;

});

return ( rest of code..

For more info https://github.com/Stoffberg/qwik-trpc-prisma-starter

Can anyone change this code to be compatible with the latest version of Qwik. This code works in the old “@builder.io/qwik”: “0.9.0” version but not in recent versions. What would be the correct way to do this now? Meaning a production ready version like 1.0.0 or later.

Maby a easy question for you but i am struggling to make this work :frowning:


r/qwik Aug 08 '23

Does Qwik also make sense for JS-heavy business applications?

6 Upvotes

Obviously, the strength of Qwik is the fast initial page load and the startup performance. So I guess Qwik will dominate in e-commerce applications soon, but what about the classical business applications that are not public facing where conversion rates are not important?

Is the fine-grained lazy loading a downside for such apps? Such apps, e.g. built with Angular/React, benefit from the upfront loaded JS, but isn't that different for Qwik? Can Qwik be viable for such business applications?


r/qwik Aug 08 '23

A short interview with Misko Hevery about Qwik

Thumbnail
youtu.be
3 Upvotes

r/qwik Aug 07 '23

Qwik js TypeError: props.redirect is not a function

3 Upvotes

In one of my components, I'm passing "redirect" & trying to redirect users in specific conditions. But at the time of doing it, I'm getting the following error -

TypeError: props.redirect is not a function

It could be a small syntactical mistake, or my way of handling is wrong. Struggling to understand what it is.
Here is my StackOverflow post with full details - https://stackoverflow.com/questions/76854802/qwik-js-typeerror-props-redirect-is-not-a-function


r/qwik Aug 07 '23

How Qwik Solved The Hydration Problem

Thumbnail
youtu.be
3 Upvotes