Build a webpage-to-PDF tool from scratch with Saavo

This tutorial series documents the full process of building an online product with the Saavo template, from defining requirements and designing features to deploying it. I also registered webpagetopdf.dev to make the process as close to a real project as possible.

A webpage-to-PDF tool may not be a product worth investing in over the long term, but its features are relatively simple and it covers every part of building a product: core functionality, users, quotas, payments, and deployment. Working through the full development process with this example will show whether the Saavo template can support taking a product from scratch to launch.

What you will build

The finished WebpageToPDF product includes three conversion modes, Quick Convert, Custom, and Visual Editor, along with sign-up and sign-in, daily quotas, Pro subscriptions, and a production deployment. Configuration for API conversion and credit packs is reserved for future extensions. Neither is available in the first release.

The first article follows the initial idea through prototype validation and the resulting scope changes. All subsequent articles use that revised feature scope.

Before you begin

The tutorial uses Windows, PowerShell, Cursor, and Codex for demonstrations. You can use whichever development tools you are familiar with. Before creating the actual project, you need access to the Saavo template, Git, and Node.js. See Prerequisites for details. You will configure the domain, payments, and other external services as you reach the relevant articles.

If you have not used Saavo before, you can read the Quickstart first to learn the basic workflow for creating a project, running it locally, and deploying it.

Reading order

1. Product design and prototype validation: Define the product direction, first-release scope, and PDF conversion approach for WebpageToPDF.
2. Create the project and configure branding: Create a Saavo project, initialize it locally, and configure the website copy and theme colors.
3. Migrate the PDF conversion features: Understand the project layers and migrate the prototype's PDF conversion endpoints and frontend components to Saavo.
4. Define plans and integrate entitlements: Configure the free and Pro plans, user quotas, pricing page, and permission checks.
5. Integrate Stripe payments: Configure Stripe Products, Prices, and webhooks, and connect the purchase flow to entitlement grants.
6. Complete the website and deploy: Complete the website pages and production configuration, deploy the PDF Worker and main site, and verify the launch.

For your first read, follow the articles in order. Each ends with a checklist and a link to the next article. If you are integrating a particular part into an existing project, you can go directly to that article after confirming that its prerequisite configuration is complete.