What Programming Languages and Frameworks Are Used in the Akash Console Repository?
The Akash Console repository is built primarily with TypeScript on Node.js, utilizing Next.js 14 and React 18 as its core frontend frameworks alongside a Tailwind CSS and Radix UI component architecture.
The Akash Console is an open-source monorepo that provides a web-based interface for managing deployments on the Akash Network. Understanding the programming languages and frameworks used in the Akash Console repository reveals a modern TypeScript-heavy stack optimized for blockchain application development.
TypeScript and Node.js Foundation
The entire codebase runs on TypeScript with minimal JavaScript configuration files.
All application logic resides in .ts and .tsx files across the apps/ and packages/ directories. For example, apps/provider-console/src/pages/index.tsx and packages/ui/utils/cn.ts demonstrate the strict TypeScript implementation. The runtime environment is Node.js, with build scripts and configuration files like next.config.js written in JavaScript.
Next.js 14 and React 18 Architecture
The console employs Next.js (version 14.2.35 as specified in apps/provider-console/package.json) as its full-stack React framework. This provides server-side rendering, API routes, and static optimization.
React 18.2.0 powers the UI component model across all applications, with React-DOM handling browser-side rendering. The shared UI package at packages/ui/package.json declares these dependencies centrally, ensuring version consistency across the monorepo.
UI Styling and Component Libraries
The visual layer combines utility-first CSS with accessible primitives.
Tailwind CSS handles all styling, configured in both packages/ui/tailwind.config.ts and app-specific configurations like apps/provider-console/tailwind.config.ts. The component library in packages/ui/package.json lists Radix UI primitives (including @radix-ui/react-dialog version 1.0.5) for accessible, unstyled base components.
For blockchain-specific interfaces, the console uses Interchain UI (@interchain-ui/react version 1.23.31 in apps/provider-console/package.json), a component library tailored for Cosmos ecosystem applications. Emotion (@emotion/react ~11.11.4) provides CSS-in-JS capabilities for component-level theming.
Data Fetching and Validation
The repository implements a robust data layer using modern React patterns.
TanStack React Query (version 5.67.2 in apps/provider-console/package.json) manages server state, caching, and synchronization. For data-heavy interfaces, TanStack React Table (version 8.11.2) handles sorting and pagination.
Zod schemas define runtime validation, as implemented in apps/deploy-web/src/utils/zod/deploymentRow.ts:
// apps/deploy-web/src/utils/zod/deploymentRow.ts
import { z } from 'zod';
export const DeploymentSchema = z.object({
name: z.string().min(3, 'Name is required'),
version: z.string().regex(/^v\d+\.\d+\.\d+$/),
cpu: z.number().min(0.1),
memory: z.number().min(128),
storage: z.number().optional(),
});
export type Deployment = z.infer<typeof DeploymentSchema>;
OpenAPI-Qraft (version 2.5.0 in apps/notifications/package.json) auto-generates type-safe React Query hooks from Swagger specifications, with the generated SDK residing in packages/react-query-sdk.
Blockchain Integration Tools
As a Cosmos Network interface, the console incorporates specialized blockchain libraries.
Cosmos-Kit React (version 2.18.0 in apps/provider-console/package.json) manages wallet connections for Cosmos-based chains. The transaction signer app (apps/tx-signer/package.json) embeds Monaco Editor React (@monaco-editor/react 4.6.0) for code editing capabilities. Marketplace features in apps/deploy-web integrate Stripe React (@stripe/react-stripe-js 5.3.0) for payment processing.
Build Tooling and DevOps
The monorepo structure relies on Turbo (TurboRepo) for task orchestration across workspaces. Vitest serves as the primary unit test runner, while ESLint and Prettier enforce code quality standards.
Containerization utilizes Docker and Helm (see the .helm/ directory), with GitHub Actions handling CI/CD pipelines. The tx-signer application uses Tsup for fast TypeScript bundling, and Sentry (@sentry/nextjs 8.34.0) provides error monitoring.
Code Example: Next.js Page Implementation
A typical page combines multiple frameworks from the stack:
// apps/provider-console/src/pages/dashboard.tsx
import { Button } from '@akashnetwork/ui';
import { useQuery } from '@tanstack/react-query';
import { fetchLeases } from '@/api/leases';
export default function Dashboard() {
const { data, isLoading } = useQuery(['leases'], fetchLeases);
return (
<main className="p-6">
<h1 className="text-2xl font-bold mb-4">Your Leases</h1>
{isLoading ? (
<p>Loading…</p>
) : (
<ul className="space-y-2">
{data?.map((lease) => (
<li key={lease.id} className="flex items-center justify-between p-2 bg-gray-50 rounded">
<span>{lease.id}</span>
<Button size="sm" onClick={() => console.log(lease)}>Details</Button>
</li>
))}
</ul>
)}
</main>
);
}
This example demonstrates Next.js page routing, React hooks, Tailwind utility classes, TanStack React Query for data fetching, and the shared Button component from @akashnetwork/ui.
Summary
- The Akash Console repository uses TypeScript as its primary programming language, running on Node.js.
- Next.js 14 and React 18 form the core frontend framework architecture.
- Tailwind CSS and Radix UI provide the styling and accessible component primitives.
- TanStack React Query manages server state, while Zod handles schema validation.
- Cosmos-Kit and Interchain UI enable blockchain-specific functionality for the Cosmos ecosystem.
- TurboRepo orchestrates the monorepo build process, supported by Vitest, ESLint, and Docker.
Frequently Asked Questions
Is the Akash Console built with TypeScript or JavaScript?
The Akash Console is built almost entirely with TypeScript (.ts and .tsx files) across all applications and packages. JavaScript appears only in configuration files like next.config.js and build scripts.
What React framework does Akash Console use?
The repository uses Next.js 14 as its full-stack React framework, providing server-side rendering, static site generation, and API routes. This is implemented across multiple applications including provider-console and deploy-web.
How does Akash Console handle API data fetching?
The console uses TanStack React Query (v5) for data fetching, caching, and state management. Additionally, OpenAPI-Qraft generates type-safe React Query hooks automatically from Swagger specifications, ensuring end-to-end type safety.
What testing framework is used in the Akash Console repository?
The project uses Vitest as its primary unit test runner across all packages, replacing Jest for new code while maintaining compatibility with existing Jest configurations. Tests run automatically via GitHub Actions CI pipelines.
Have a question about this repo?
These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:
curl -s "https://instagit.com/install.md" Maintain an open-source project? Get it listed too →