Remember last week when I mentioned moving the whole server logic from AWS into my Nuxt app? I hoped that it will not cause any issues. Well, it did. 🤦🏻♂️
The current server is configured with 512MB of RAM, but sending the weekly newsletter took more than 1GB of RAM, and my server crashed. I triggered the API endpoint on my local machine to send the newsletter, and it worked fine.
After careful consideration, I decided to move only the email sending process to an AWS Lambda function. This function is triggered by the Nuxt app, ensuring that the app is not hindered by the email sending process. This solution not only provides the server with sufficient resources to handle other requests but also proves to be a cost-effective alternative to upgrading the server. 🚀
👉🏻 In this talk, you get introduced to FormKit — a form-building framework — and how it can empower Vue developers to write consistent, accessible, even delightful forms.
👉🏻 Learn how to create functions that adapt to await usage, enhancing your understanding of Nuxt and empowering you to apply these patterns in your own projects.
Nuxt provides the setResponseStatus composable to set the status code (and optionally the status message) of the response.
This composable only works on the server and will have no effect on the client. Additionally, it can only be used in the Nuxt Context. The Nuxt context is only accessible in plugins, Nuxt hooks, Nuxt middleware, and setup functions (in pages and components).
eventevent will be undefinedundefined in the browser, so you can safely use this composable in your Nuxt context.
In my client's project, I used this composable to set the status code of the response to 410 when a product has expired. This way, the search engines will know that the product is no longer available and will remove it from the search results:
👉🏻 This post dives into the mechanics of Promises, their states (pending, fulfilled, rejected), and how to work with them using the .then() and .catch() methods.
Weekly Vue News #194 Reactive Time Ago View online Hi 👋 I'm on vacation this week, so no special news from my side — just some fresh Vue & Nuxt content for you! Enjoy this issue and have a lovely week ☀️ Vue 📕 Optimizing heavy operations in Vue with Web Worke...
Read this on my blog We made it to 200! Thanks for reading and supporting me over the last few years, it means a lot to me. Tomorrow is the last day of the Composable Design Patterns course launch and the 35% off discount. If you were hoping to pick it up, don't forget to check it out! As always, I've got some tips and links for you, and a new podcast episode. Enjoy, and have a great week! — Michael 🔥 Default Content with Slots You can provide fallback content for a slot, in case no content is provided: < !-- Child.vue --> < template > < div > < slot > Hey! You forgot to put something in the slot! < / slot > < / div > < / template > This content can be anything, even a whole complex component that provides default behaviour: < !-- Child.vue --> < template > < div > < slot name = "search" > < !-- Can...
Hey! In yesterday's email I shared what I think is the key feature to making Vue components highly reusable: Scoped slots. But scoped slots are hard to grasp, and even more difficult to master. So today, we're going to make sure we understand them on a deep, intuitive level. Then, I'm going to introduce you to the magic ✨ of scoped slots. The trick is to think of them as functions. Slots are just functions We're going to recreate the functionality of slots, but we'll use a regular Javascript function that only returns HTML. This is the code we'll replicate: <!-- Parent --> < template > < div class = "modal-container" > < div class = "modal" > Content in the Parent < Child class = "mb-4" v-slot = "{ text }" > ...
评论
发表评论