> ## Documentation Index
> Fetch the complete documentation index at: https://withseismic.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Our Tech Stack

> The modern stack we use to ship interactive tools in weeks, not months

<script type="application/ld+json">
  {`{
    "@context": "https://schema.org",
    "@type": "TechArticle",
    "headline": "WithSeismic Tech Stack",
    "description": "The modern technology stack WithSeismic uses to build production-ready automation tools",
    "url": "https://withseismic.com/development",
    "author": {
      "@type": "Organization",
      "name": "WithSeismic"
    },
    "about": [
      {
        "@type": "ComputerLanguage",
        "name": "TypeScript"
      },
      {
        "@type": "SoftwareApplication",
        "name": "React",
        "applicationCategory": "WebApplication"
      },
      {
        "@type": "SoftwareApplication",
        "name": "Next.js",
        "applicationCategory": "WebFramework"
      },
      {
        "@type": "SoftwareApplication",
        "name": "Node.js",
        "applicationCategory": "RuntimeEnvironment"
      }
    ]
    }`}
</script>

## Our Tech Stack

<Info>
  **What technologies do you use to build tools?** We use modern TypeScript,
  React, Next.js, and Node.js for rapid development, plus specialized tools like
  n8n for automation and Playwright for browser automation.
</Info>

At WithSeismic, we've carefully selected a modern, performance-focused stack that allows us to ship interactive tools in 2-4 week sprints. Every technology choice is optimized for rapid development and stellar user experience.

### Core Technologies

<Info>
  **Why TypeScript and React?** These technologies provide type safety,
  component reusability, and a massive ecosystem - allowing us to build robust
  tools quickly while maintaining high code quality.
</Info>

<CardGroup cols={2}>
  <Card title="TypeScript" icon="code" href="https://www.typescriptlang.org/">
    Type-safe JavaScript for building robust, maintainable applications with
    fewer runtime errors.
  </Card>

  <Card title="React" icon="react" href="https://react.dev/">
    Component-based UI library for building interactive user interfaces with
    predictable data flow.
  </Card>

  <Card title="Next.js" icon="n" href="https://nextjs.org/">
    Full-stack React framework with built-in routing, SSR/SSG, and optimized
    performance out of the box.
  </Card>

  <Card title="Vite" icon="bolt" href="https://vite.dev/">
    Lightning-fast build tool and dev server for modern web projects with hot
    module replacement.
  </Card>
</CardGroup>

### Backend & Infrastructure

<CardGroup cols={2}>
  <Card title="Node.js" icon="node" href="https://nodejs.org/">
    JavaScript runtime for building scalable server-side applications with a
    massive ecosystem.
  </Card>

  <Card title="Hono" icon="fire" href="https://hono.dev/">
    Ultra-fast, lightweight web framework for building APIs with excellent
    TypeScript support.
  </Card>

  <Card title="Railway" icon="train" href="https://railway.app/">
    Modern infrastructure platform for deploying and scaling applications with
    zero DevOps overhead.
  </Card>
</CardGroup>

### UI & State Management

<CardGroup cols={2}>
  <Card title="Tailwind CSS" icon="palette" href="https://tailwindcss.com/">
    Utility-first CSS framework for rapidly building custom user interfaces
    without leaving your HTML.
  </Card>

  <Card title="Motion" icon="wand-magic-sparkles" href="https://motion.dev/">
    Production-ready animation library (formerly Framer Motion) for creating
    fluid, gesture-based interactions.
  </Card>

  <Card title="Zustand" icon="database" href="https://zustand-demo.pmnd.rs/">
    Lightweight state management solution that's simple, fast, and scales from
    small to complex applications.
  </Card>

  <Card title="TanStack Query" icon="arrows-rotate" href="https://tanstack.com/query">
    Powerful data synchronization library (formerly React Query) for fetching,
    caching, and updating server state.
  </Card>
</CardGroup>

## Automation & Workflow Platforms

<Info>
  **How do you handle complex automation workflows?** We use platforms like n8n
  and Kestra that provide visual workflow builders with 500+ integrations, plus
  custom code when needed for specialized requirements.
</Info>

<CardGroup cols={2}>
  <Card title="n8n" icon="network-wired" href="https://n8n.io/">
    Self-hostable workflow automation with 500+ integrations, code flexibility,
    and visual workflow builder.
  </Card>

  <Card title="Kestra" icon="water" href="https://kestra.io/">
    Declarative data orchestration platform for ETL/ELT pipelines with 100+
    built-in plugins.
  </Card>
</CardGroup>

## Job Queue & Orchestration

<CardGroup cols={2}>
  <Card title="BullMQ" icon="gauge" href="https://docs.bullmq.io/">
    Redis-based queue system for processing background jobs with automatic
    retries and rate limiting.
  </Card>

  <Card title="Trigger.dev" icon="play" href="https://trigger.dev/">
    Modern workflow automation platform for building reliable background jobs
    with built-in observability.
  </Card>

  <Card title="Inngest" icon="bolt-lightning" href="https://www.inngest.com/">
    Event-driven function platform for building durable workflows with automatic
    retries and step functions.
  </Card>

  <Card title="Hatchet" icon="hammer" href="https://hatchet.run/">
    DAG-based workflow engine for complex dependencies and visual workflow
    management.
  </Card>
</CardGroup>

## Documentation & API Tools

<CardGroup cols={2}>
  <Card title="OpenAPI/Scalar" icon="book-open" href="https://scalar.com/">
    Beautiful, interactive API documentation from OpenAPI specs with built-in
    testing capabilities.
  </Card>

  <Card title="Mintlify" icon="file-lines" href="https://mintlify.com/">
    Developer documentation platform with MDX support, beautiful themes, and
    excellent search.
  </Card>

  <Card title="Swagger UI" icon="code" href="https://swagger.io/tools/swagger-ui/">
    Interactive API exploration tool for testing endpoints directly from
    documentation.
  </Card>

  <Card title="Storybook" icon="book" href="https://storybook.js.org/">
    Component documentation and testing platform for building UI components in
    isolation.
  </Card>
</CardGroup>

## Communication & Project Management

We maintain clear, consistent communication channels with our clients throughout every sprint:

<CardGroup cols={3}>
  <Card title="Slack" icon="slack" href="https://slack.com/">
    Real-time messaging for daily updates, quick questions, and seamless
    collaboration.
  </Card>

  <Card title="Google Meet" icon="video" href="https://meet.google.com/">
    Video conferencing for discovery workshops, sprint reviews, and strategic
    discussions.
  </Card>

  <Card title="Linear" icon="list-check" href="https://linear.app/">
    Modern issue tracking for managing sprint tasks, tracking progress, and
    maintaining transparency.
  </Card>
</CardGroup>

## Why This Stack?

<Info>
  **What makes this tech stack special for automation tools?** Every technology
  is chosen for speed, type safety, and performance - enabling us to deliver
  production-ready tools in 2-4 week sprints with minimal bugs.
</Info>

Every tool in our stack is chosen for a specific reason:

* **Speed**: Vite's instant HMR and Next.js optimizations mean we iterate faster
* **Type Safety**: TypeScript catches errors before runtime, reducing bugs in production
* **Developer Experience**: Modern tooling means we spend time building features, not fighting config
* **Performance**: Every choice prioritizes sub-second load times and smooth interactions
* **Scalability**: From MVP to millions of users, this stack grows with your success

<Info>
  This is the exact stack we use to build interactive tools that convert. No
  theoretical choices—these are battle-tested technologies we ship with every
  day.
</Info>

## Ready to Build with This Stack?

<Card title="Book Your Sprint" icon="rocket" href="/quickstart">
  Let Doug and the team use this proven tech stack to build your productized
  tools. 2-week sprints at $10K or 4-week sprints at $20K. Get a response in 4
  hours.
</Card>
