Getting started

Before we can start implementing the Supaboost template, a couple of other setups need to be completed. In this part of the documentation, we will go through the different parts of the implementation that require third-party setup.

We will look at how to create your store in Lemon Squeezy, your database in Supabase and the UI frameworks TailwindCSS and Shadcn UI (which uses Radix-UI).

Next.js

What is Next.js

Next.js is a powerful and widely adopted open-source React framework that simplifies the development of server-side rendered (SSR) and static websites. With built-in features like automatic code splitting, server-side rendering, and static site generation, Next.js offers improved performance, SEO, and developer productivity. It allows developers to focus on building rich, interactive web applications while handling the complexities of routing and server-side rendering seamlessly, making it an excellent choice for creating modern, scalable, and high-performance web projects.

Why do we use Next.js

With Server Side Rendering and the new App router, we are able to generate new pages and logic quickly. With built in Router, Fetching, API routes, you will have access to the strong technical foundation. Together with constant updates to the functionality, we can make sure we are using cutting edge technology.

Supabase

What is Supabase

Supabase is an open-source platform that simplifies backend development for web and mobile applications. By combining a powerful PostgreSQL database with real-time capabilities, automatic scaling, and built-in authentication, Supabase empowers developers to create feature-rich, secure, and scalable applications without compromising on simplicity and transparency.

Why do we use Supabase

When you want to create a new project, you have to update and maintain the Frontend & Backend of your application. By leveraging the API and Relational Database (PostgreSQL) of Supabase, we can mainly focus on the Frontend. With the easy to use API for fetching, updating and creating we will be able to directly test and apply new functionality. With a very generous free tier, not only will Supabase help you get setup, you will also be able to start earning that sweet MRR before you have to pay for Supabase.

Lemon Squeezy

What is Lemon Squeezy

Lemon Squeezy is an all-in-one platform for running a SaaS business. As a payment processor, they are able to provide founders with payments, subscription, tax compliance (globally), fraud prevention, multi-currency support, failed payment recorvery and much more.

Why do we use Lemon Squeezy

With the recent outrage in regards to Stripe, for Supaboost we have decided Lemon Squeezy would be the perfect alternative. In future we hope to provide multiple different payment processors, to give you the freedom of processors. For now we decided to provide you our favorite solution!

TailwindCSS and Shadcn UI

What is TailwindCSS

Tailwind CSS is a highly popular utility-first CSS framework that streamlines web development by providing a set of pre-designed, low-level utility classes. Unlike traditional frameworks, it encourages rapid development by enabling developers to compose custom UI components without the need to write custom CSS. By utilizing a configuration-based approach, Tailwind CSS allows for easy customization and consistency, making it a favored choice for building modern, responsive, and efficient web applications.

What is Shadcn UI

Shadcn UI is an Open Source collection of components. These beautifully designed components can be copied and pasted into your applications. As you will see, a lot of the layout we use is generated using the beautiful examples created by Shadcn. As this is a collection of components, we have the freedom of updating the components as we see fit. Shadcn is largely black and white, but with custom updates to the components, you can add color yourself.

Bonus: Supaboost is using Shadcn TX for the documentation!