Shopify Nextjs Toolbox

screenshot of Shopify Nextjs Toolbox

A set of tools to authenticate NextJs apps with Shopify's OAuth handshake and AppBridge Session Tokens

Overview

The Shopify NextJS Toolbox is a powerful suite of tools designed for developers looking to seamlessly integrate Shopify's authentication systems using Next.js. By simplifying the OAuth process without relying on Koa.js, this toolkit provides the essential components needed to handle user authentication efficiently. Whether you're building a shop or an app, the toolbox helps ensure that your integration with Shopify is secure and straightforward.

With an array of server-side utilities and client-side components, this toolbox stands out for its ease of use and flexibility. It allows developers to manage OAuth handshakes, handle session tokens, and implement best practices like nonce validation, all while offering a smooth user experience.

Features

  • Server Side Middleware: Includes essential tools like handleAuthStart and handleAuthCallback to manage the OAuth handshake seamlessly.
  • Custom Redirects: Flexibly redirect users to specific URLs, like payment plan confirmations, post-authentication without additional coding complexity.
  • Nonce Validation: Offers support for nonce verification during OAuth to enhance security, with optional functions for saving and validating generated nonces.
  • ShopifyAppBridgeProvider: Acts as a gatekeeper for your application, automatically handling critical parameters for the App Bridge.
  • useOAuth Hook: Simplifies the initiation of the OAuth handshake and automatically redirects merchants to the necessary authentication URL.
  • useApi Hook: Creates an Axios instance pre-configured to include the session token in every HTTP request for streamlined API interaction.
  • Query Parameter Retrieval: Components like useShopOrigin and useHost make retrieving necessary Shopify query parameters straightforward and efficient.

This toolbox provides a comprehensive set of features ideal for developers aiming to integrate Next.js with Shopify, ensuring a robust and secure authentication flow while enhancing overall functionality.