June 2022 Summaries

The newly launched use-stripe-subscription package simplifies the implementation of Stripe billing for frontend developers by providing a set of tools and features, such as the useSubscription() React hook that returns available subscription products and manages subscription sessions, all without exposing the secret key to the frontend. Built by Clerk, the package aims to replace the often in-house developed solutions with a secure and open-source alternative that integrates seamlessly with any authentication and user management system. It leverages Stripe's Customer and Customer Portal Configuration objects to securely authorize actions users can perform on their own, ensuring frontend APIs are self-serve and protected from unauthorized access. The package eliminates the need for webhooks by making just-in-time API requests to Stripe for updated data, although this approach may encounter Stripe's API rate limits, leading to future enhancements involving robust caching solutions.

Clerk offers a comprehensive solution for building authentication systems, providing user management features such as authentication, authorization, and profile management, which simplifies the process of creating and testing authentication flows. The tutorial guides users through implementing a user profile switcher using Clerk with Next.js, highlighting Clerk's capabilities such as multi-session authentication that facilitates seamless account switching. Users are instructed on setting up a project with Next.js, creating sign-up and sign-in pages using Clerk's prebuilt components, and implementing an authentication flow with conditional rendering based on user sign-in status. The tutorial also explains how to authenticate API endpoints using Clerk's withAuth function to ensure secure user interactions. By following the tutorial, users learn to build a Next.js application that supports multisession handling, allowing for smooth account management and integration of social logins and multifactor authentication using the Clerk SDK.

In March 2022, Remix introduced Remix Stacks, a feature of the Remix CLI that allows developers to generate projects from pre-created templates named after music genres. Clerk utilized this opportunity to create the "New Wave Stack," combining Remix’s development tools with Clerk’s user management and authentication platform. This custom stack integrates Netlify for deployment, Clerk for authentication, Fauna for database management, and Tailwind for styling, aiming to streamline the developer experience by providing production-ready resources. The stack also includes Cypress for end-to-end testing, alongside Testing Library and Jest for lower-level tests, and uses Prettier, ESLint, and TypeScript for code formatting and linting. The goal is to allow developers to quickly set up and deploy applications, focusing their efforts on unique project elements by leveraging the intuitive synergy of modern web tools.