Jumpstart your next SaaS application with UpNext

Jason Lee
3 min readMay 13, 2021

A comprehensive Visual Studio Code extension that offers an end-to-end full stack SaaS template out of the box

Introduction

Software as a service (SaaS) applications are taking the world by storm but they are difficult to set up due to the plethora of technologies and services needed to create one, which can deter developers from ever getting one started. We wanted to create an avenue for fellow engineers to skip the set up phase altogether and skip straight to developing their products. Enter UpNext.

What’s UpNext?

UpNext is a Visual Studio Code extension that offers a full stack SaaS application boilerplate which seamlessly incorporates various technologies into the purposefully designed tech stack shown below:

Why our tech stack will work for you:

Client:

We use the React framework Next.js which has hybrid optimization for both static site generation and server side rendering giving any user a highly performant client-side experience. We utilize Next.js to its full potential as it handles routing through the use of next/router and next/link allowing for lighting-fast page redirection and loading. Additionally, we incorporated next-auth to give users a simple yet highly effective implementation of OAuth which gives users access to multiple well-known providers including GitHub, Facebook, Twitter, and Google. On top of that, Next.js has extensive TypeScript support in the form of automatic configuration and compilation, effectively eliminating the user’s need to set up their own compiler. Lastly, we included built-in payment functionality by leveraging Stripe API to allow developers to monetize their creations.

Server:

Our tech stack allows us to supply developers with three different server options to choose from in the form of Express, Apollo, or Next’s native serverless API routing. Doing so enables the user to choose the right server system based on their personal needs rather than morphing their application to fit our boilerplate.

Database:

UpNext onboards SQLite as a lightweight database solution for the user, which can be interacted with in two ways. First, the user can use the express server to make queries to the database in a RESTful fashion. Second, for added scalability, the user can take advantage of the Apollo Server to create GraphQL queries. We incorporated CRUD functionality using the Prisma ORM in the GraphQL resolvers, making for precise and efficient database queries and eliminating the problem of over and under fetching. Providing these options reiterates the fact that UpNext gives the power to the developer to choose whichever method best fits their use cases.

How can I get UpNext?

The UpNext Visual Studio Code extension can be found on the Marketplace.

How do I get started?

The real beauty of UpNext lies in its ease of use. After installation, simply open up your git repository using VSCode. Using the command palette, select our custom “Create Boilerplate” command and grab a coffee as you watch your SaaS skeleton get constructed right before your eyes.

How can I contribute?

UpNext is an open source application, feel free to check out our source code here! Contribution also comes in the form of reporting bugs and giving feedback.

The UpNext Team:

Andrew Kim: GitHub | LinkedIn

Hyesung Peter Lee: GitHub | LinkedIn

Jason Lee: GitHub | LinkedIn

Jorge Carlos “JC” Fernandez: GitHub | LinkedIn

Kai Evans: GitHub | LinkedIn

--

--