> ## Documentation Index
> Fetch the complete documentation index at: https://docs.shuttle.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# SaaS Starter Template

> Learn how you can deploy a fully working SaaS template using Next.js & Rust.

We've created a SaaS template that you can use to get started quickly with a fullstack Rust + Next.js app.

The design of the template is based on a sales-oriented Customer Relationship Management (CRM) tool where
users will be able to view their customers, sales records as well as some analytics.

![SaaS frontend example collage](https://bear-images.sfo2.cdn.digitaloceanspaces.com/joshmo-1684444919-0.png)

## Features

* Take subscription payments with Stripe
* Email session-based login
* Mailgun (email subscription, welcome email etc)
* Pre-configured frontend routes for easy transition
* Examples of how to implement simple dashboard analytics

## Pre-requisites

* Rust
* Node.js/NPM.
* Typescript.
* [cargo-shuttle](https://www.shuttle.dev)

## Getting Started

* Initialize the template with:

  ```sh theme={null}
  shuttle init --from shuttle-hq/shuttle-examples --subfolder fullstack-templates/saas
  ```

* cd into the folder

* Run `npm i` to install the dependencies on the frontend.

* Set your secrets in the Secrets.toml file at the `Cargo.toml` level of your backend folder. Unset secrets will default
  to "None" to prevent automatic crashing of the web service, but some services may not work.

## Development Scripts

* **Using `dev` for Development:**
  * Run `npm run dev` to start your application with live reload capabilities. This script uses `turbowatch` to
    monitor changes in both the frontend and backend.
  * Visit `http://localhost:8000` once the app has built.
  * If you prefer using `cargo-watch` instead of `turbowatch`, the watch feature can be disabled in
    the `turbowatch.ts` file.
* **Frontend-Focused Development with `next-dev`:**
  * For a frontend-specific development workflow, use `npm run next-dev`.
  * This script runs Next.js in a development mode optimized for faster builds and reloads, enhancing your frontend
    development experience.
* **Analyzing Bundle Size with `analyze`:**
  * The `analyze` script is designed to provide insights into the bundle size of your Next.js application.
  * Run `npm run analyze` to generate a detailed report of the size of each component and dependency in your bundle.
  * This is particularly useful for identifying large dependencies or components that could be optimized for better
    performance.

## Troubleshooting

* If you change the migrations after running locally or deploying, you will need to go into the database itself and
  delete the tables. You can do this easily with something
  like [psql](https://www.postgresql.org/docs/current/app-psql.html) or [pgAdmin](https://www.pgadmin.org/).
* If connecting to external services like Stripe doesn't work, try checking your Secrets.toml file.
* Shuttle connects by default to port 8000 - if you're currently already using something at port 8000, you can add
  the `--port <port-number>` to the `shuttle run` command to change this.