Hi

Hello, I created this project with the goal of quickly setting up a template using Nuxt and the “On-demand revalidation” configuration, integrated with a backend (currently only Pocketbase).

While researching, I discovered that “On-demand revalidation” is a very valid option for saving server resources in exchange for having more data in the cache, but this option requires integration with the backend you use in your project.

Workflow

1. The user visits a page

2. The server checks if that page exists in the cache

3. If it exists in the cache, Nitro returns the cached page, and Nitro checks in the background whether the backend data has changed by reviewing “the data block”; since the backend did not send any signal, Nitro returns “the data block” from the cache

4. If the page does not exist in the cache, it generates a new page, and Nitro checks if there is a “data block” in the cache; if there isn’t, it fetches the data from the backend

5. Nitro’s configuration ensures that when a fetch is performed, that data is stored in the cache; that “data block” will expire in one week unless the backend sends an event to reset it.

6. If the data changes on the backend, it sends an event to reset the cache in Nitro

You can run the script with bun, npm or pnpm

Example

npx nurev  

More info

https://codeberg.org/Serroda/nurev#how-it-works

Take a look and let me know what you think
Have a good day!

Hi there, I'm working on a new app with Vuejs 3 and I wonder what are the good practice to architecture the app and to handle guards, JWT token refresh, reactivity and not having spaghetti code.

I started with the basic Vuetify app and added Pinia and the vue-router. 🤠

One problem I want to solve is how to get the list to populate the first page with a list of objects, lets say a book list. Right now I created a store.books list and an action to call the API, according to the doc ( https://pinia.vuejs.org/core-concepts/actions.html ). But then I have to call the action when the user log in, or when the component is mounted, or when there is a refresh.

I found it not very DRY and just not smart, so I need some help and good doc to understand how to structure my app.

Thank you 😌

Thinking about leveling up your Vue.js app?

Switching to Nuxt.js could be the key to unlocking better performance and scalability!

We've been there—migrating our website to Nuxt.js—and now we're sharing practical tips and insights to make your transition smooth and stress-free.

Why Nuxt.js?

• Better SEO - Easily manage meta tags to boost your search rankings
• Faster Loading - Experience improved speed with server-side rendering (SSR)
• Simpler Development - Work more efficiently with an organized structure for smoother workflows

What You’ll Get in the Guide?

• Step-by-step guide to migrating large Vue.js apps to Nuxt.js.
• Tips for seamlessly adapting your codebase to Nuxt.js’s structure.
• Solutions to tackle common migration challenges.
• Best practices for a future-proof, scalable app.

If you’re a developer or part of a team aiming to improve your app’s performance, SEO, and overall user experience, this guide is for you.

Check Out the Full Guide!👇

https://canopas.com/how-to-migrate-large-applications-efficiently-from-vue-js-to-nuxt-js-bdd9e41f82a1

The future of #JavaScript toolchain looks very exciting!

The creator of @vuejs & @vite_js just announced voidzero.dev - unified tooling for JavaScript!

VoidZero promises a step forward in web development.

@youyuxi shared a blog announcement about what this means for the ecosystem.

Check it out here👇
https://voidzero.dev/posts/announcing-voidzero-inc

#voidzero #vuejs #vitejs

I was just thinking it would be cool if at conferences the @vuejs team gave out little bottles of condiments to attendees - Vue Sauce

Who doesn't like sauce?

The official blog for the Vue.js project

Hi Vue professionals! I'm the maintainer of Kellnr, the registry for Rust crates. I've created a UI in Vue, but my frontend skill are minimal. I would like to make the UI reactive to look good on mobile screens, too.

Is here some brave soul that can help me? I have no idea where to start.

I haven't found a good way to do this. Basically the props that you can pass as params, end up getting displayed in the url as resource or queries.

The above code makes the url look like "url/id/1"

What if i want to pass multiple props like "id" and " name" through router-link but don't want the url to have the "name" field?

Hopefully, someone can answer this. Thank you.

I'm really excited to share it. Before diving into development and investing more time into this project, I would love to hear your thoughts and get some initial feedback on the app's look.

If this concept receives enough positive interest, I plan to invest further by acquiring a domain and making it available for public use. It will be open source as well.

Thanks in advance!

The question is not really "what can you use?", but what have you actually used and what's your experience with that method or tool (Cordova, Ionic, etc)?

We have a Vue frontend and I'm getting some feedback when we upgrade to Vue3 we should move to React just for the ecosystem and dev availability. I thought Vue was a better/faster/easier response to react. What are your thoughts?