Skip to Content
Build with FinquStorefrontGetting Started

Getting Started with Custom Storefronts

This guide will help you build your first custom storefront using Finqu’s tools and APIs.

Prerequisites

  • Node.js 18+ installed
  • A Finqu merchant account
  • Basic familiarity with React and Next.js

Quick Start Options

The fastest way to get started is with the Nexus theme, which provides a complete Next.js storefront out of the box.

  1. Install the Finqu CLI (if not already installed):
npm install -g @finqu/cli
  1. Sign in to your Finqu account:
finqu sign-in
  1. Initialize a new storefront project:
finqu storefront init

  1. Follow the prompts to configure your storefront and select Nexus as your starting point.

  2. Start the development server:

npm run dev

Learn more about Nexus →

Option 2: Build from Scratch

If you prefer to build a custom storefront from scratch:

  1. Set up a Next.js project:
npx create-next-app@latest my-storefront
cd my-storefront
  1. Install the Storefront SDK:
npm install @finqu/storefront-sdk

  1. Get your API key - Obtain your Storefront API key from the Channel settings in the Finqu admin area. Keys are prefixed with fq_ (e.g., fq_OPmgGrIY...).

  2. Configure the SDK - Initialize the Storefront SDK with your API key:

import { StorefrontClient } from '@finqu/storefront-sdk';
 
const client = new StorefrontClient({
  storeDomain: 'your-store.finqu.com',
  apiKey: process.env.FINQU_STOREFRONT_API_KEY, // Store in environment variables
});
  1. Configure customer authentication - Set up customer authentication flows.

Authentication Guide →

  1. Connect to the Storefront GraphQL API - Use the SDK to query products, manage carts, and handle checkout.

Storefront SDK Documentation →

Next Steps

Need Help?