This channel is the best way to get updated and sold on the new features of nuxt. This looks great. I’d love on those videos that you talk a bit about the security (especially of api keys, it’s always the little worry that creeps around)
Trying my best to keep you up to date on them 🙌 I've covered the API key topic in my very first video (ua-cam.com/video/2tKOZc3Z1dk/v-deo.html) - is there anything missing from your POV which I should cover besides that?
@@TheAlexLichter hadn’t see that video ! It’s a good one. In the rendering modes video, I wondered if some rendering modes would change the readability of an api key that’s not public. I also wondered if there was a way to hide a non public key in a plugin to avoid creating an api layer (though now I don’t see the use case for that scenario)
Great. Would have bet for this topic to be covered from you this week ;-). I saw it first in vuejs amsterdam. Great to know that I can use it now in my projects.
Would calling load function multiple times have any side effects? Or would it be just a NOOP ? I used to manually store the now deprecated $script promise and would return if fhe script was not loaded yet, to prevent duplicate loading of script. Would this new approach suffice this kind of use case? Thanks for the video! ❤
That's nice! But lets take Hotjar as an example. There is a Hotjar Nuxt Module available. Should I rather use useScript or the available module? Do Nuxt modules (usually) use useScript under the hood?
As Nuxt Scripts is rather new, most modules won't support Nuxt Scripts at the time of writing. I see two ways there though: 1) If the module is doing not much on top besides configuration + loading the script, a nuxt/scripts registry script would be the way to go and the module wouldn't be needed 2) If the module does more beyond that (think of e.g. setting up a custom configuration, adding plugins and so on), then the module should use Nuxt/Scripts at some point 👍
instead setting up the trigger option, could we alternatively add @mouseover to the h1 and call the de-structured load function on mouseover? ie is the trigger config option doing anything additional/magical that I should be aware of?
Yes, you absolutely could! This is more for convenience 😊 The util is also more interesting if you use `trigger: 'visible'` (instead of rolling your own intersection observer), or even a combination of possible triggers
Link to the implementation of useScriptTriggerElement github.com/nuxt/scripts/blob/99626a261e26982101b92129eb833ffef9853967/src/runtime/composables/useScriptTriggerElement.ts#L49-L72
Hi Alexander, If it's possible, please make a video tutorial about nested dynamic route I mean like this: /categories/slug/slug to display like this: /categories/car/ferarri
nuxt scripts seem like complicated structure to write the code. I am still so much confuse after watch the docs and see youtube video told about nuxt scripts. But after saw your video I have a bit understand not all. Thanks for the video tutorials about the nuxt scripts.
What was shown here is more of a custom use case. Using a repository script is more straightforward (but IMO it is great it allows so much flexibility) You are welcome! 👌
Different use case. Scripts in a web worker still won't block the main thread. It is also on the roadmap for nuxt scripts github.com/nuxt/scripts/issues/182
im making a vue widget in vite which builds a js script, and i want to use it in a nuxt project, but whenever i import the script the HMR on the nuxt app stops working... any hints why this may be? is it maybe because Vue from the script is somehow interfeering with Vue from Nuxt? also if you have any tips for creating widgets in vue, that would be great!
Wanna give Nuxt Scripts a try?
Since Nuxt Scripts is in beta status - is it mature enough to use in production? Are there lots of changes to be expected?
This channel is the best way to get updated and sold on the new features of nuxt. This looks great.
I’d love on those videos that you talk a bit about the security (especially of api keys, it’s always the little worry that creeps around)
Trying my best to keep you up to date on them 🙌
I've covered the API key topic in my very first video (ua-cam.com/video/2tKOZc3Z1dk/v-deo.html) - is there anything missing from your POV which I should cover besides that?
@@TheAlexLichter hadn’t see that video ! It’s a good one.
In the rendering modes video, I wondered if some rendering modes would change the readability of an api key that’s not public. I also wondered if there was a way to hide a non public key in a plugin to avoid creating an api layer (though now I don’t see the use case for that scenario)
Perfectly for every web developer living in Europe
I'd even go further and say for all of them. Perf and privacy gains help us all 💚
That thumbnail though. Fits the „let’s dive right into it“
😁😁😁
Great. Would have bet for this topic to be covered from you this week ;-). I saw it first in vuejs amsterdam. Great to know that I can use it now in my projects.
Oh yes, indeed. The first announcement was earlier this year - really happy that it is out now 🎉
Would calling load function multiple times have any side effects? Or would it be just a NOOP ?
I used to manually store the now deprecated $script promise and would return if fhe script was not loaded yet, to prevent duplicate loading of script.
Would this new approach suffice this kind of use case?
Thanks for the video! ❤
That's nice! But lets take Hotjar as an example. There is a Hotjar Nuxt Module available. Should I rather use useScript or the available module? Do Nuxt modules (usually) use useScript under the hood?
As Nuxt Scripts is rather new, most modules won't support Nuxt Scripts at the time of writing. I see two ways there though:
1) If the module is doing not much on top besides configuration + loading the script, a nuxt/scripts registry script would be the way to go and the module wouldn't be needed
2) If the module does more beyond that (think of e.g. setting up a custom configuration, adding plugins and so on), then the module should use Nuxt/Scripts at some point 👍
instead setting up the trigger option, could we alternatively add @mouseover to the h1 and call the de-structured load function on mouseover? ie is the trigger config option doing anything additional/magical that I should be aware of?
Yes, you absolutely could! This is more for convenience 😊
The util is also more interesting if you use `trigger: 'visible'` (instead of rolling your own intersection observer), or even a combination of possible triggers
Link to the implementation of useScriptTriggerElement
github.com/nuxt/scripts/blob/99626a261e26982101b92129eb833ffef9853967/src/runtime/composables/useScriptTriggerElement.ts#L49-L72
@@TheAlexLichter oh nice! Thanks! Visible makes perfect sense. For the mouseover using the vue event listener seems more idiomatic to me
thanks bro
Sure thing 👌🏻
hey Alex, looking for ideas on the best way to write test for the server folder in Nuxt
Hi Alexander, If it's possible, please make a video tutorial about nested dynamic route I mean like this: /categories/slug/slug to display like this: /categories/car/ferarri
Sure! What would you like to know about nested dynamic routes?
@@TheAlexLichter I want to two slugs alongside together in route like this: /product-categories/slug/slug
nuxt scripts seem like complicated structure to write the code. I am still so much confuse after watch the docs and see youtube video told about nuxt scripts. But after saw your video I have a bit understand not all. Thanks for the video tutorials about the nuxt scripts.
What was shown here is more of a custom use case. Using a repository script is more straightforward (but IMO it is great it allows so much flexibility)
You are welcome! 👌
No need to use partytown anymore?
Different use case. Scripts in a web worker still won't block the main thread. It is also on the roadmap for nuxt scripts github.com/nuxt/scripts/issues/182
@@TheAlexLichter Great, thx!
Too many things are called "run"
Yes, that's true 🙈
Though everything except the `run: displayWidget` is the same "run"
im making a vue widget in vite which builds a js script, and i want to use it in a nuxt project, but whenever i import the script the HMR on the nuxt app stops working... any hints why this may be?
is it maybe because Vue from the script is somehow interfeering with Vue from Nuxt? also if you have any tips for creating widgets in vue, that would be great!
Difficult to say without a reproduction I'm afraid :/
Why nuxt has low attention.. :(
Good question! I think there are *a lot* of people using Nuxt already but especially people in the React ecosystem rarely look "outside of it" :/
This module is awesome
Right? Definitely a must-have!