Environment Setup

Prerequisites

Before building with DashForDevs, make sure your development environment meets these requirements:

• Node.js 18+ — We recommend the latest LTS version. Check with node --version
• npm, yarn, or pnpm — Any modern package manager works
• Next.js 14+ — Our SDK is optimized for Next.js App Router, but works with Pages Router and other React frameworks
• A DashForDevs account — Sign up at the dashboard to get your API keys

Create a Next.js Project

If you are starting fresh, scaffold a new Next.js app:

npx create-next-app@latest my-storefront --typescript --tailwind --app
cd my-storefront

Install the SDK

Add the DashForDevs SDK to your project:

npm install github:CodeCraftStudios/dash4devs-sdk

See the full Installation guide for yarn/pnpm alternatives.

Environment Variables

Create a .env.local file in your project root with your API keys:

# Public key — safe for client-side code
NEXT_PUBLIC_DASH4DEVS_API_KEY=pk_live_your_public_key_here

# Secret key — server-side ONLY
DASH4DEVS_SECRET_KEY=sk_live_your_secret_key_here

Initialize the Client

Create two client files — one for public operations, one for server-side:

// lib/dash.ts — Public client (browser-safe)
import { DashClient } from "dash4devs"

export const dash = new DashClient({
  apiKey: process.env.NEXT_PUBLIC_DASH4DEVS_API_KEY!,
})

export default dash

// lib/dash-server.ts — Server client (API routes, server components only)
import { DashClient } from "dash4devs"

export const dashServer = new DashClient({
  apiKey: process.env.DASH4DEVS_SECRET_KEY!,
})

Verify the Connection

Test that everything is wired up:

import dash from "@/lib/dash"

const { products } = await dash.products.list()
console.log(`Found ${products.length} products`)

If you see your products logged, your environment is ready.

Recommended VS Code Extensions

• TypeScript — The SDK ships with full type definitions for autocomplete
• Tailwind CSS IntelliSense — If using Tailwind for your storefront
• ESLint — Catch common issues early

Next Steps

Your environment is set up. Continue to the Quick Start guide to build your first page, or review Common Patterns for best practices.