Build SaaS Apps With Confidence on NuxtHub with Gavarnie
Note
This starter was crafted during my free time. If you find it useful, please consider supporting my work.
TL;DR: Gavarnie
Before exploring this starter, let me share the motivation behind its creation.
Several months ago, Sébastien Chopin, the creator of Nuxt, introduced NuxtHub, a platform to deploy and manage Nuxt applications, powered by Cloudflare. Briefly, you can create applications by leveraging Cloudflare infrastructure like D1 (database) and R2 (storage), enabling easy deployment and management. It's akin to Vercel or Netlify but for Nuxt applications, and I find it exceptional.
However, this operates on what's known as the edge, which differs from traditional application deployment methods like VPS. The edge uses workers, similar to web workers in your browser, but on the server side. This system allows for cost-effective and speedy deployment, though it comes with several constraints such as available APIs and limited compute time. It's a trade-off.
The edge introduces a new conceptual approach where limitations necessitate innovative solutions. While challenges exist, rest assured, you can still achieve your desired outcomes. This new landscape requires building a comprehensive ecosystem around it. Do not expect ready-to-use solutions for everything; I'll expand on this in another post.
Gradually, the edge should be mastered.
Here is where Gavarnie makes its entrance.
Gavarnie
Gavarnie is a starter intended for use with NuxtHub, specifically on the Cloudflare infrastructure. If you require compatibility with Supabase, Turso, or Vercel, this may not be the right fit. It features pre-configured social authentication with multiple providers, email verification, and prioritizes architectural and security best practices.
The most important, it's free and open-source, allowing you to commence your SaaS project now or leverage it for learning and to foster ecosystem development.
Indeed, one of my objectives with Gavarnie is not to create just another starter but to further the initiative to advance Nuxt and NuxtHub. I am convinced that by establishing common, robust foundations, we can collectively strengthen the ecosystem surrounding NuxtHub and the edge. Thus, Gavarnie serves as a starting point, not an end, and it's up to us to nurture its growth. Please, join me in enhancing it.
Gavarnie is a beginning, not a conclusion.
Features
Gavarnie is developed on Nuxt and NuxtHub. These two serve as the backbone of this project, with all elements constructed around them.
In its current form, Gavarnie enables users to create an account using their social profiles (GitHub and Twitch), link social accounts, change their email address using a verification mechanism, update their profile and display picture, and delete their account.
The email service is facilitated by Resend, simplifying email transactions.
The user interface is powered by Nuxt UI Pro, a UI toolkit provided by the Nuxt team for Nuxt applications.
Social authentication is offered via the nuxt-auth-utils module, which simplifies social authentication in Nuxt. It supports several providers such as Google, Facebook, Twitter, GitHub, among others.
Moreover, I incorporated the Nuxt Security module to enhance application security. This starter includes pre-configured CSP, a CSRF which I plan to improve, and a rate limiter to prevent abuse of sensitive endpoints.
Gavarnie is a continuation to bring full-stack capabilities to Nuxt applications.
Nuxt Going Full-Stack: How to Handle Authorization?Nuxt Going Full-Stack: How to Streamline Form Validation?Explore the gavarnie repository to discover more about its features and how to use them.
Step by Step
This marks just the beginning of the journey.
Gavarnie is a dynamic project that will evolve. We can envision incorporating better session management, an admin dashboard, an API token system, a billing solution, and more. The opportunities are vast, and it's up to us to drive its development.
Having acquainted yourself with gavarnie, feel free to explore it, extend it, experiment, and create practical applications with it.
Do not hesitate to give a star, start a discussion on the GitHub repository for any questions or suggestions to enhance the starter! 💛
Thanks for reading! My name is Estéban, and I love to write about web development.
I've been coding for several years now, and I'm still learning new things every day. I enjoy sharing my knowledge with others, as I would have appreciated having access to such clear and complete resources when I first started learning programming.
If you have any questions or want to chat, feel free to comment below or reach out to me on Bluesky, X, and LinkedIn.
I hope you enjoyed this article and learned something new. Please consider sharing it with your friends or on social media, and feel free to leave a comment or a reaction below—it would mean a lot to me! If you'd like to support my work, you can sponsor me on GitHub!