Tech Stack

This page documents the core technologies, frameworks, and services that make up the Inkblot tech stack. The stack is built around a modern, performant, headless architecture optimised for content-driven websites.

Frontend

Technology	Purpose
Astro	Primary web framework. Used for static site generation (SSG) and server-side rendering (SSR). Component-based architecture with support for multiple UI frameworks.
HTML / CSS / JavaScript	Core web technologies. Astro components use standard HTML and CSS with scoped styles.
TypeScript	Used for type-safe development, particularly in Sanity schema definitions and Astro components where strict typing adds value.
Tailwind CSS	Utility-first CSS framework, used on select projects for rapid styling.

Why Astro?

Astro is chosen for its performance-first approach. It ships zero JavaScript by default, generates static HTML where possible, and supports partial hydration (“islands architecture”) for interactive components. This results in extremely fast page loads, strong SEO, and a great content editing experience when paired with Sanity.

Backend

Inkblot primarily builds content-driven websites rather than complex backend applications. Where server-side logic is needed:

Technology	Purpose
Astro SSR	Server-side rendering for dynamic pages, API routes, and form handling
Sanity GROQ	Query language for fetching content from Sanity — runs server-side during build or at request time
Vercel Serverless Functions	Lightweight server-side logic for form submissions, webhooks, and integrations

CMS

Technology	Purpose
Sanity	Primary headless CMS. Provides structured content modelling, real-time collaborative editing, and a powerful query API (GROQ). Each project gets its own Sanity Studio and dataset.

Sanity Architecture

• Studio — Custom-built content editing interface, deployed per project
• Dataset — Content storage, one per project (production dataset, plus optional development datasets)
• GROQ — Sanity’s query language, used to fetch content in Astro pages and components
• Portable Text — Rich text format used by Sanity that allows structured, customisable rich content

Infrastructure & Hosting

Service	Purpose
Vercel	Primary hosting platform. Handles builds, deployments, CDN, SSL, and preview environments. Connected to GitHub for automatic deployments on push.
GitHub	Version control and code collaboration. All project repositories are hosted under the Inkblot GitHub organisation.
Custom domains	Client domains are pointed to Vercel via DNS (CNAME or A records). SSL is automatically provisioned by Vercel.

Deployment Pipeline

Code Push → GitHub → Vercel Build → CDN Distribution → Live Site

• Every push to main triggers a production deployment
• Every pull request gets an automatic preview deployment
• Build times are typically under 2 minutes for most projects

Third-Party Services

Service	Purpose
Google Analytics	Website analytics and traffic tracking (used on select client projects)
ClickUp	Project management, time tracking, and internal knowledge management
Google Drive	File storage and document collaboration
Figma	Design tool — designs are referenced during development via Figma Dev Mode
Slack	Internal team communication

Development Environment

Recommended local setup for developers:

• Editor: VS Code with recommended extensions (Astro, ESLint, Prettier, Tailwind CSS IntelliSense)
• Node.js: LTS version (check .nvmrc or package.json for project-specific requirements)
• Package manager: npm (default with Astro projects)
• Git: Latest stable version
• Browser: Chrome (primary testing), plus Firefox and Safari for cross-browser testing