Pricing Plan Management

Nexty.dev provides a visual pricing plan management solution that balances security and convenience.

Among similar Next.js SaaS boilerplates, payment modules typically only provide core workflow code. However, Nexty's payment module has built-in complete logic for both one-time payments and recurring subscriptions, including: adding credits upon payment, updating credits for subscription renewals, clearing credits for refunds, and supporting credit change history viewing.

Even this alone wouldn't be enough to demonstrate Nexty's unique advantages. To make it more convenient for our users to manage pricing plans, Nexty added pricing plan management functionality to the admin dashboard, freeing you from tedious multilingual JSON configuration for pricing plans.

Pricing Plans List

You can view core information of all pricing plans through the admin dashboard, including environment, card information, associated Stripe Price ID, payment method, status, and more. The action column supports editing, copying, and deletion. The Duplicate feature allows you to quickly create a similar card, helping you reduce many repetitive operations.

Create/Edit Page

On the create/edit pricing plan page, you can select the associated Stripe environment, card sorting, and whether to active. You can also see real-time preview - the preview style and content reflect what users will see after updates, ensuring you can double-check content completeness.

For Stripe integration, you only need to paste the Stripe Price ID to get accurate pricing information with one click. The code automatically determines whether the entered Price ID matches the Stripe environment selected above to prevent accidentally publishing test environment pricing to production, which would cause payment failures.

Card display information can all be configured through forms, including: price, package content, whether to highlight, button information. If it's a button that redirects to an external link, you can also configure the link, which won't trigger the payment process.

To make multilingual card configuration more convenient, this page supports two ways to generate multilingual cards:

• Click Generate Template to generate JSON structure based on form information. You can translate it elsewhere and then copy it back.
• If .env or .env.local has translation-related environment variables configured, the Translate by AI button will be available. Clicking it will automatically generate multilingual pricing JSON data based on the form.

Good to know:

When Language JSON is not empty, the pricing plan content will render JSON data. So when you modify the above form again, you should synchronously update the Language JSON so that the card renders the latest updates.

This page also provides Benefits JSON, which can be used to define paid user benefits. When your product offers more complex services, you can extend benefit information through Benefits JSON and apply it in code, eliminating the need to modify the original database design.

When you update pricing information, it will immediately sync to the user page. By default, it displays monthly, yearly, and one-time payments. You can also use the PricingAll component provided in the code to directly display all active pricing plans.

Visual pricing management is one of Nexty's core highlights and the feature I'm most satisfied with. With this functionality, our users no longer need to modify code when updating pricing - they can complete data updates in one minute through admin interface operations.