Overview

The Grid Frontend is built with the following stack:

• Framework - Next.js 16
• Language - TypeScript
• Styling - Tailwind CSS
• Components - Shadcn-ui
• Schema Validations - Zod
• State Management - Zustand
• Search params state manager - Nuqs
• Auth - Auth.js
• Tables - Tanstack Tables
• Forms - React Hook Form
• Command+k interface - kbar
• Linting - ESLint
• Pre-commit Hooks - Husky
• Formatting - Prettier

Getting Started

Note

We are using Next 16 with React 19, follow these steps:

Clone the repo:

git clone https://github.com/AIPowerGrid/grid-frontend.git

• pnpm install ( we have legacy-peer-deps=true added in the .npmrc)
• Create a .env.local file by copying the example environment file: cp env.example.txt .env.local
• Add the required environment variables to the .env.local file.
• pnpm run dev

You should now be able to access the application at http://localhost:3000.

Architecture

The console is a Next.js backend-for-frontend for Grid core. Browser components call same-origin /api handlers; those server handlers attach the authenticated Grid session key. Accounts, API keys, usage, workers, validator scorecards, and payouts live in Grid core. The console does not require direct database access.

Production currently deploys on Vercel. The checked-in Cloudflare/OpenNext import is incomplete and is not a supported deploy path until its package, Worker configuration, build, and runtime smoke tests are committed together.