TL;DR: Heroku is a managed PaaS that gets your app live in minutes — ideal for startups, MVPs, and solo developers. Azure is a full cloud ecosystem (IaaS + PaaS) built for enterprises, AI workloads, and complex infrastructure. Heroku is simpler and faster to start; Azure is more powerful and flexible at scale. If cost-efficiency at growth stage matters, Azure often wins on price-per-resource despite its steeper learning curve.

Choosing between Heroku and Microsoft Azure is rarely a coin flip. They serve different builders at different stages. This guide breaks down both platforms across architecture, pricing, scalability, and real-world use cases — so you can make the right call for your project in 2025.

What Is Heroku?

Heroku is a Platform-as-a-Service (PaaS) owned by Salesforce. It abstracts away all infrastructure concerns — servers, networking, OS patching — so developers can deploy apps by pushing to Git. Heroku runs apps in isolated containers called dynos, and provides a large marketplace of add-ons for databases, monitoring, email, and more.

Since late 2022, Heroku no longer offers a free tier. Their entry-level options are the Eco plan ($5/month for a shared pool of 1,000 compute hours) and the Basic dyno ($7/month per dyno, always-on). Production-grade Standard and Performance dynos run from $25–$500+/month depending on resources.

Best for: Startups, MVPs, solo developers, apps with straightforward backend needs, and teams already integrated with Salesforce CRM.

What Is Microsoft Azure?

Microsoft Azure is a full-spectrum cloud platform offering over 200 services — from basic web hosting (Azure App Service) to virtual machines, Kubernetes, serverless functions, AI/ML tools, IoT, and global CDN. It operates on a pay-as-you-go model with options for reserved capacity discounts (1-year and 3-year commitments).

Azure integrates deeply with Microsoft’s enterprise stack: Active Directory, Office 365, .NET, GitHub Actions, and Azure DevOps. It’s the dominant choice in enterprise IT environments and regulated industries.

Best for: Enterprise applications, data science and AI workloads, Microsoft-centric organizations, systems requiring hybrid cloud or complex compliance requirements.

Heroku vs Azure: Head-to-Head Comparison

Pricing Breakdown (2025)

Pricing verdict: Heroku is easier to predict at small scale. Azure gets more cost-efficient as you grow — especially if you commit to reserved instances. A mid-scale production app running multiple services will typically cost less on Azure than Heroku at equivalent specs, but Azure requires more configuration to get there.

Scalability: How Each Platform Handles Growth

Heroku scales by adding more dynos (horizontal) or upgrading to larger dyno types (vertical). This works well for predictable traffic, but Heroku’s scaling is tied to its dyno model, which becomes expensive at high volume. There’s no true auto-scaling based on CPU/memory thresholds without third-party add-ons or custom configuration.

Azure offers a much richer scaling story: auto-scaling rules based on CPU, memory, request count, or schedules; multi-region deployments via Azure Traffic Manager; and Kubernetes-based workloads through Azure Kubernetes Service (AKS). For globally distributed or highly variable workloads, Azure is the stronger platform.

Developer Experience

Heroku’s developer experience has long been its biggest selling point. git push heroku main is genuinely that simple for most use cases. The Heroku CLI is well-documented, and the add-on marketplace makes provisioning a Postgres database or Redis cache a one-command operation.

Azure’s experience is more involved. The Azure Portal is powerful but dense. Setting up a web app, attaching a database, and configuring a CI/CD pipeline takes more steps. That said, once you’re past the initial setup, Azure’s tooling is excellent — particularly for teams already using VS Code, GitHub Actions, or Azure DevOps.

For teams deploying MERN stack apps, Heroku remains one of the fastest paths to production — see our guide on how to deploy a MERN app to Heroku for a practical walkthrough.

Heroku vs Azure: Pros & Cons

Heroku Pros

• Fastest path from code to deployed app
• Minimal infrastructure knowledge required
• Excellent add-on ecosystem (databases, monitoring, email, search)
• Native Salesforce integration
• Now includes Heroku Managed Inference for AI use cases

Heroku Cons

• No free tier since November 2022
• Gets expensive quickly at production scale
• Limited infrastructure control compared to IaaS providers
• Not ideal for enterprise compliance-heavy workloads (without Shield dynos)
• Smaller global footprint than Azure

Azure Pros

• 200+ native services covering virtually every infrastructure need
• Deep Microsoft ecosystem integration (AAD, Office 365, .NET, GitHub)
• Excellent AI/ML tooling including Azure OpenAI Service
• Reserved instance pricing for significant long-term savings
• Extensive compliance certifications for regulated industries
• Global infrastructure across 60+ regions

Azure Cons

• Steep learning curve for beginners
• More setup and configuration required vs. PaaS platforms
• Pricing can be complex and unpredictable without careful monitoring
• Overkill for simple apps or solo developers

Who Should Use Heroku?

• You’re building a prototype or MVP and need it live fast
• You’re a solo developer or small team without DevOps resources
• Your app relies on the Salesforce ecosystem
• You want managed infrastructure without learning cloud fundamentals
• Your traffic is predictable and app complexity is low-to-moderate

Who Should Use Azure?

• You’re building enterprise-grade or mission-critical applications
• Your organization already uses Microsoft products (Office 365, Active Directory)
• You need AI/ML capabilities, big data processing, or IoT integration
• You require compliance certifications like HIPAA, FedRAMP, or PCI DSS
• You’re planning global scale with multi-region deployments

Heroku vs Azure: Which Is Cheaper?

It depends on scale. At small scale (1–2 dynos, one database), Heroku is comparable or slightly cheaper than Azure’s entry-level App Service plans. As you scale up — more concurrent services, higher traffic, multiple environments — Azure’s pay-as-you-go model and reserved pricing typically result in lower costs per unit of compute.

Where Heroku costs genuinely run away: running multiple Standard dynos ($25/each) for web, worker, and clock processes, plus production-grade Postgres add-ons ($50–$200/mo), can push a moderately complex app to $300–$500/month without much traffic. Azure can often deliver equivalent infrastructure for less, if you’re willing to configure it.

Migration: Heroku to Azure (or Vice Versa)

Moving from Heroku to Azure typically involves containerizing your app (Heroku dynos are containers under the hood, making Docker packaging straightforward), migrating your Postgres database to Azure Database for PostgreSQL, and setting up CI/CD pipelines in GitHub Actions or Azure DevOps. Heroku-specific add-ons (like SendGrid, Papertrail, etc.) have direct equivalents in Azure’s marketplace or as standalone services.

Moving from Azure to Heroku is less common but makes sense if you’re simplifying a complex setup — for example, a team that inherited enterprise Azure infrastructure but only needs a straightforward web app and database.

For teams considering simpler PaaS alternatives to Heroku, it’s also worth comparing Render vs Heroku and Netlify vs Heroku — both offer modern alternatives with competitive pricing. If you’re comparing cloud platforms more broadly, our DigitalOcean vs AWS guide covers the IaaS landscape well.

How We Evaluated These Platforms

This comparison is based on official pricing documentation from Heroku (devcenter.heroku.com and salesforce.com/heroku/pricing) and Microsoft Azure (azure.microsoft.com/pricing), cross-referenced with developer community feedback and real-world deployment scenarios. Pricing was verified in April 2025 and reflects publicly listed rates — enterprise contracts and negotiated pricing may vary.

Frequently Asked Questions

Is Heroku cheaper than Azure?

At small scale, they’re comparable. At production scale with multiple services, Azure is typically more cost-efficient — especially with reserved instance pricing. Heroku’s simplicity comes at a per-resource premium.

Which is easier to use — Heroku or Azure?

Heroku is significantly easier for beginners. A working app can be deployed in under 10 minutes with no infrastructure knowledge. Azure requires more setup but rewards that investment with much greater flexibility and power.

Does Heroku still have a free tier in 2025?

No. Heroku discontinued its free tier in November 2022. The lowest-cost option is now the Eco Dynos plan at $5/month (1,000 shared compute hours) or Basic dynos at $7/month per dyno.

Can I run AI workloads on Heroku?

Yes — Heroku now offers Managed Inference and Agents as an add-on, giving access to LLMs, embedding models, and image generation within Heroku’s managed environment. That said, Azure’s AI ecosystem (Azure OpenAI, Cognitive Services, Azure ML) is significantly more mature and comprehensive.

Can I scale apps on both platforms?

Yes, but differently. Heroku scales by adding dynos or upgrading dyno size — straightforward but costly at high volume. Azure supports true auto-scaling across multiple dimensions (CPU, memory, request count) and multi-region deployments, making it better suited for unpredictable or global traffic.

Is Azure good for startups?

Azure can work for startups, and Microsoft offers credits through programs like Microsoft for Startups. However, most early-stage teams find Heroku, Render, or DigitalOcean faster to ship on. Azure makes more sense as complexity and compliance requirements grow.

Final Verdict: Heroku or Azure in 2025?

There’s no universal winner — the right choice depends on where you are in your build.

Choose Heroku if: you need to ship fast, want zero infrastructure overhead, and your app complexity is low-to-moderate. It’s one of the best developer experiences in PaaS, especially for Node.js, Python, and Ruby apps. The trade-off is cost at scale and limited infrastructure control.

Choose Azure if: you’re building enterprise software, need AI/ML services, require compliance certifications, or are already inside the Microsoft ecosystem. The learning curve is real, but the ceiling is effectively unlimited — and the long-term economics are more favorable at scale.

Not sure Azure is the right cloud platform for you? See how it stacks up against other providers: DigitalOcean vs AWS and DigitalOcean vs Linode offer solid starting points for comparing cloud infrastructure options.

Related Comparisons:
Netlify vs Heroku
Render vs Heroku
Heroku vs DigitalOcean
Heroku vs AWS

The Mac Mini and Mac Studio have become the go-to hardware for running OpenClaw (formerly Clawdbot). They’re compact, silent, energy efficient, and give you access to macOS-exclusive features like iMessage integration, Voice Wake, and the native menu bar app. But with configurations ranging from a $499 Mac Mini to a $4,000+ Mac Studio, choosing the right one depends entirely on how you plan to use it.

This buying guide breaks down every Mac Mini and Mac Studio configuration that makes sense for OpenClaw, explains which one fits your use case, and includes a comparison table so you can find the right model quickly. If you haven’t decided whether to run OpenClaw locally or in the cloud, our Mac installation guide and DigitalOcean deployment guide cover both options in detail.

How to Think About Mac Mini Specs for OpenClaw

Before looking at specific models, it helps to understand which specs actually matter for running an AI agent like OpenClaw.

RAM is the most important spec. OpenClaw itself is lightweight — it runs on Node.js and doesn’t need much memory for the core gateway and messaging integrations. However, if you also want to run local AI models through Ollama (so you don’t have to pay for cloud API calls), RAM becomes critical. The model must fit entirely in memory to run. You can’t upgrade RAM after purchase on any Apple Silicon Mac, so buy the most you can afford.

CPU matters less than you’d think. OpenClaw’s Node.js runtime is primarily single-threaded, and all M4-series chips have strong single-core performance. You won’t notice a meaningful difference between the base M4 and M4 Pro for the OpenClaw gateway itself. The M4 Pro’s extra cores help if you’re running multiple agents, local models, or doing other compute work on the same machine.

Storage is flexible. OpenClaw’s workspace, configuration files, and memory logs don’t take up much space. The 256GB base model is fine for a dedicated OpenClaw machine. If you’re also running local AI models, those model files can be large (7–70GB each), so 512GB or 1TB gives you more room. External storage via Thunderbolt is always an option for expansion.

Memory bandwidth affects local model speed. If you plan to run local LLMs via Ollama, memory bandwidth directly determines how fast the model generates tokens. The M4 delivers ~120 GB/s, the M4 Pro ~273 GB/s, and the M4 Max ~410–546 GB/s depending on configuration. The M3 Ultra in the Mac Studio reaches ~819 GB/s. For cloud-only API usage, this doesn’t matter much — but for local inference, faster bandwidth means noticeably snappier responses.

Mac Mini and Mac Studio Comparison Table for OpenClaw

Below are the most relevant configurations for running OpenClaw, spanning both the Mac Mini and Mac Studio lineups. Prices listed are Apple MSRP — Amazon frequently discounts these by $50–$100. The “Amazon Link” column is where you can insert your affiliate links.

Note: Some configurations (24GB M4, 48GB M4 Pro, 64GB M4 Pro, and most Mac Studio upgrades) are build-to-order and may only be available directly from Apple.com. Amazon carries the standard base configurations. Check both Amazon and Apple for availability. The Mac Studio M3 Ultra uses the previous-generation M3 chip — Apple has not released an M4 Ultra as of early 2026.

Our Recommendations by Use Case

Best Budget Pick: Mac Mini M4 — 16GB / 512GB ($599)

If you’re using OpenClaw exclusively with cloud AI models like Claude or GPT-4 (no local models), the base-tier M4 Mac Mini is genuinely all you need. OpenClaw’s Node.js gateway is lightweight, and 16GB of RAM handles the agent plus your messaging integrations without breaking a sweat. We recommend the 512GB storage version over the 256GB simply for comfort — the $100 difference gives you room for skills, logs, and general peace of mind. This is the model most people in the OpenClaw community start with.

This is also the configuration to consider if you already have a separate cloud AI subscription (like Anthropic’s API or a Claude Max plan) and just want a dedicated, always-on machine to run the OpenClaw gateway.

Best Value for Local AI: Mac Mini M4 — 24GB / 512GB ($799)

If you want to experiment with running local AI models through Ollama alongside OpenClaw, stepping up to 24GB of unified memory opens the door to smaller models in the 7B–13B parameter range (like Llama 3 8B or Mistral 7B). These models run entirely on-device with no API costs, giving you a fully private AI assistant.

The tradeoff is that the M4’s memory bandwidth (~120 GB/s) is slower than the M4 Pro, so token generation with local models won’t be as fast. For most personal assistant tasks, this is acceptable — you’re trading speed for savings on API costs. This is a build-to-order configuration, so order through Apple.com.

Best Overall: Mac Mini M4 Pro — 48GB / 1TB ($1,999)

This is the sweet spot that power users in the OpenClaw and local AI community have converged on. 48GB of unified memory lets you comfortably run 70B parameter models like Llama 3.1 70B (quantized), which approach the quality of cloud-hosted models. The M4 Pro’s ~273 GB/s memory bandwidth means you’re getting genuinely usable response speeds — not just loading models, but generating tokens fast enough for a natural conversation.

The 1TB storage gives you room to store multiple model files (which can be 40–70GB each), plus OpenClaw’s workspace and any other tools you want to run. The 12-core CPU handles multi-agent setups and background tasks without bogging down. If you can afford it and plan to take local AI seriously, this is the one to buy.

Best for Maximum Capability: Mac Mini M4 Pro — 64GB / 1TB ($2,399)

The 64GB configuration is for users who want to run the largest open-source models at higher quantization levels (Q6/Q8, where output quality is noticeably better), keep multiple models loaded simultaneously, or run multiple OpenClaw agents alongside other memory-intensive work. The upgraded 14-core CPU and 20-core GPU also help if you’re doing any development, rendering, or other compute work on the same machine.

For most people running OpenClaw as a personal assistant, this is overkill. But if you’re building a serious home AI lab or running agents for a team, the extra headroom is worth it.

Should You Buy Used?

Used Mac Minis — especially M1 and M2 models — can be significant bargains. An M2 Pro Mac Mini with 32GB of RAM can be found for around $800–$900 on platforms like Swappa or Back Market, compared to its original price of $1,599+. That’s enough RAM for meaningful local model use at roughly half the cost of a new M4 Pro.

A few things to keep in mind when buying used:

Any Apple Silicon Mac Mini (M1, M2, M4) will run OpenClaw just fine. The M4 is faster, but the M1 and M2 are still very capable for an always-on AI agent using cloud models.

Swappa and Back Market offer buyer protection and verified listings. Facebook Marketplace tends to be 10% cheaper but carries more risk — verify the serial number on Apple’s Check Coverage page before handing over cash.

Always check “About This Mac” on the device to confirm the RAM and storage match the listing. RAM cannot be upgraded after purchase on any Apple Silicon Mac.

When to Choose the Mac Studio Over the Mac Mini

The Mac Studio occupies interesting territory for OpenClaw users. At $1,999, the base M4 Max Mac Studio costs the same as a maxed-out Mac Mini M4 Pro with 48GB and 1TB — but gives you a fundamentally different machine. Here’s how to decide between them.

Mac Studio M4 Max — Base 36GB ($1,999): The Speed Pick

The base Mac Studio gives you the M4 Max chip with ~410 GB/s memory bandwidth — roughly 50% faster than the M4 Pro’s ~273 GB/s. For local AI models, this means significantly faster token generation. If you’re running a 13B–30B parameter model and want the snappiest possible responses, the Mac Studio delivers that at the same price as the top Mac Mini.

The tradeoff: you get 36GB of RAM instead of 48GB. That means slightly smaller models fit comfortably, or you’ll need more aggressive quantization for 70B models. If raw inference speed matters more than fitting the absolute largest models, the base Mac Studio is the pick. It also comes with 10 Gigabit Ethernet (vs. Gigabit on the Mac Mini), an SD card slot, USB-A ports, and four Thunderbolt 5 ports — nice extras for a machine that doubles as a workstation.

Mac Studio M4 Max — 64GB ($2,599): The Sweet Spot for Serious Local AI

Step up to 64GB and you get the best of both worlds — enough RAM for 70B quantized models with room to spare, paired with the M4 Max’s fast memory bandwidth for quick token generation. At $2,599, it’s $200 more than the Mac Mini M4 Pro with 64GB ($2,399), but you’re getting substantially faster inference, more ports, and 10Gb Ethernet. For users who are serious about running large local models as their primary AI backend, this is arguably the best value in the entire lineup.

Mac Studio M4 Max — 128GB ($3,699): The AI Lab

128GB of unified memory opens the door to running frontier-scale open-source models — 100B+ parameter models at reasonable quantization levels, multiple large models loaded simultaneously, or a combination of OpenClaw agents plus development workloads. The upgraded 16-core CPU and 40-core GPU with ~546 GB/s bandwidth make this a genuine AI workstation. This is for users who want to replace cloud API costs entirely with local inference and have the budget to match.

Mac Studio M3 Ultra — 96GB+ ($3,999+): Maximum Everything

The M3 Ultra models are for users who need the absolute maximum memory and throughput. The base M3 Ultra starts at 96GB with ~819 GB/s memory bandwidth — the fastest in the Mac lineup. It’s configurable up to 256GB (and technically up to 512GB through Apple), which means you can run virtually any open-source model at full precision.

One important note: the M3 Ultra uses the previous-generation M3 chip, not the M4. Apple hasn’t released an M4 Ultra as of early 2026 — it may arrive later in the year. For single-threaded performance (which OpenClaw’s Node.js runtime relies on), the M4 Max actually edges out the M3 Ultra. The Ultra wins on multi-core throughput, GPU performance, and raw memory capacity. If you need 96GB+ of RAM right now, the M3 Ultra is your only option in the Mac Studio form factor.

Mac Mini vs. Mac Studio: Quick Decision Framework

Choose the Mac Mini if: You’re using cloud AI models primarily, you want the lowest entry price, or you need up to 64GB of RAM. The Mac Mini M4 Pro with 48GB ($1,999) remains the most popular choice in the OpenClaw community for good reason — it handles the vast majority of use cases at a reasonable price.

Choose the Mac Studio if: Local model inference speed is a priority, you need more than 64GB of RAM, you want 10Gb Ethernet and extra ports, or the machine will double as a workstation for professional creative work. The Mac Studio’s M4 Max delivers meaningfully faster local inference than the M4 Pro at similar price points.

Accessories You’ll Need

Neither the Mac Mini nor the Mac Studio includes a display, keyboard, or mouse. For a dedicated OpenClaw server that you’ll manage remotely, you technically don’t need any of these after initial setup — just plug it into your router via Ethernet, set it up with a borrowed monitor and keyboard, then manage it via SSH and Tailscale going forward.

If you do want a permanent display, any monitor with HDMI or USB-C input works. For initial setup, you can use a TV as a temporary display.

An Ethernet connection is recommended over Wi-Fi for an always-on server. The Mac Mini includes Gigabit Ethernet, while the Mac Studio comes with 10 Gigabit Ethernet — both are built in, so just plug in a cable.

Getting Started After Purchase

Once your Mac Mini or Mac Studio arrives, head over to our complete macOS installation guide for step-by-step setup instructions — including expanded Mac Mini-specific configuration tips for running OpenClaw as a dedicated always-on server. The installation process is identical on both machines.

For ideas on what to automate once it’s running, check out 10 practical things you can do with OpenClaw. And before you give your AI agent broad system access, make sure you’ve read our OpenClaw security guide.

Related Guides on Code Boost

What Is OpenClaw (Formerly Clawdbot)? The Self-Hosted AI Assistant Explained

How to Install OpenClaw on Mac (macOS Setup Guide)

How to Install OpenClaw on Windows (Step-by-Step WSL2 Guide)

How to Install OpenClaw on DigitalOcean (Cloud VPS Guide)

10 Things You Can Do With OpenClaw (Practical Use Cases)

Is OpenClaw Safe? Security Guide for Self-Hosted AI Agents

TL;DR: There are four main ways to fetch data in React: the native Fetch API with useEffect, Axios for more feature-rich HTTP requests, TanStack Query (formerly React Query) for declarative server-state management, and React Server Components for server-side fetching in frameworks like Next.js. Which you reach for depends on your project’s complexity, framework, and whether data lives on the client or server.

Fetching data from an API is one of the most common tasks in React development. React doesn’t prescribe a specific approach — it leaves the choice to you — which means there are several valid patterns, each with different trade-offs. This guide covers all of them with accurate, up-to-date code examples so you can choose the right tool for your use case.

The Four Main Approaches

Before diving in, here’s a quick orientation of when to use each method:

• Fetch API + useEffect — Simple, no dependencies, good for straightforward client-side fetching in smaller apps or isolated components.
• Axios + useEffect — Like Fetch but with a cleaner API, automatic JSON parsing, and better interceptor support. Good for apps already using Axios.
• TanStack Query (useQuery) — The go-to for client-side data in real-world apps. Handles caching, background refetching, deduplication, and loading/error states automatically.
• React Server Components — The modern framework-native approach for Next.js 13+ and other RSC-enabled frameworks. Fetches data on the server with zero client-side JavaScript overhead.

1. The Native Fetch API with useEffect

The Fetch API is built into the browser — no libraries needed. Combined with useEffect and useState, it’s the most lightweight way to fetch data in a React component.

import { useState, useEffect } from 'react';

function UserList() {
  const [data, setData] = useState(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);

  useEffect(() => {
    const controller = new AbortController();

    fetch('https://api.example.com/users', { signal: controller.signal })
      .then(response => {
        if (!response.ok) throw new Error('Network response was not ok');
        return response.json();
      })
      .then(data => {
        setData(data);
        setLoading(false);
      })
      .catch(err => {
        if (err.name !== 'AbortError') {
          setError(err.message);
          setLoading(false);
        }
      });

    return () => controller.abort();
  }, []);

  if (loading) return <p>Loading...</p>;
  if (error) return <p>Error: {error}</p>;
  return <ul>{data.map(user => <li key={user.id}>{user.name}</li>)}</ul>;
}

A few things worth noting in this example that are often skipped in basic tutorials:

• AbortController — The cleanup function calls controller.abort() when the component unmounts, cancelling the in-flight request and preventing state updates on unmounted components (a common source of memory leak warnings).
• Response.ok check — Fetch doesn’t throw on HTTP error status codes (like 404 or 500). You need to check response.ok manually and throw if needed.
• Separate loading and error states — Essential for a good user experience.

When to use it: Simple components or small apps where adding a library feels like overkill. If you’re writing the same loading/error boilerplate in five places, it’s time to move to TanStack Query.

2. Axios: A Cleaner HTTP Client

Axios is a popular third-party HTTP library that improves on the native Fetch API in several ways: it throws automatically on non-2xx status codes, parses JSON responses by default, supports request/response interceptors for auth headers and logging, and has cleaner timeout handling.

Install it first:

npm install axios

Then use it with useEffect:

import { useState, useEffect } from 'react';
import axios from 'axios';

function UserList() {
  const [data, setData] = useState(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);

  useEffect(() => {
    const controller = new AbortController();

    axios.get('https://api.example.com/users', { signal: controller.signal })
      .then(response => {
        setData(response.data);
        setLoading(false);
      })
      .catch(err => {
        if (!axios.isCancel(err)) {
          setError(err.message);
          setLoading(false);
        }
      });

    return () => controller.abort();
  }, []);

  if (loading) return <p>Loading...</p>;
  if (error) return <p>Error: {error}</p>;
  return <ul>{data.map(user => <li key={user.id}>{user.name}</li>)}</ul>;
}

Axios also works well with async/await for cleaner sequential logic:

useEffect(() => {
  const controller = new AbortController();

  const fetchData = async () => {
    try {
      const response = await axios.get('https://api.example.com/users', {
        signal: controller.signal
      });
      setData(response.data);
    } catch (err) {
      if (!axios.isCancel(err)) setError(err.message);
    } finally {
      setLoading(false);
    }
  };

  fetchData();
  return () => controller.abort();
}, []);

When to use it: Projects that need interceptors (attaching auth tokens to every request, for example), centralized error handling, or that already have Axios configured as a base instance across the codebase.

3. TanStack Query (Formerly React Query)

TanStack Query is the most widely adopted solution for managing server state in React. It treats data fetched from APIs as a distinct concern from UI state — handling caching, background refetching, request deduplication, stale-while-revalidate patterns, and loading/error states automatically, so you don’t have to.

Note: “React Query” was renamed to TanStack Query when it expanded to support other frameworks. The React package is @tanstack/react-query.

Install it:

npm install @tanstack/react-query

Wrap your app in the provider (typically in your root component):

import { QueryClient, QueryClientProvider } from '@tanstack/react-query';

const queryClient = new QueryClient();

export default function App() {
  return (
    <QueryClientProvider client={queryClient}>
      <UserList />
    </QueryClientProvider>
  );
}

Then use useQuery in your components — note the current v5 API uses an options object, not a positional string key:

import { useQuery } from '@tanstack/react-query';

async function fetchUsers() {
  const response = await fetch('https://api.example.com/users');
  if (!response.ok) throw new Error('Failed to fetch');
  return response.json();
}

function UserList() {
  const { data, error, isPending } = useQuery({
    queryKey: ['users'],
    queryFn: fetchUsers,
  });

  if (isPending) return <p>Loading...</p>;
  if (error) return <p>Error: {error.message}</p>;
  return <ul>{data.map(user => <li key={user.id}>{user.name}</li>)}</ul>;
}

What TanStack Query handles for you automatically that plain useEffect doesn’t:

• Caching — The same query across multiple components only fires one network request. Subsequent renders use cached data instantly.
• Background refetching — When a user returns to a tab or reconnects to the network, stale data is quietly refreshed in the background.
• Request deduplication — Multiple components mounting simultaneously won’t fire duplicate requests for the same data.
• Automatic retries — Failed requests are retried automatically (configurable).
• Mutations — The useMutation hook handles POST/PUT/DELETE operations with optimistic update support and cache invalidation.

When to use it: Any real-world app where data is shared across components, needs to stay fresh, or where writing loading/error boilerplate in every component is becoming a burden. For most production React apps, TanStack Query is the right default for client-side data fetching.

4. React Server Components

React Server Components (RSC) represent a fundamentally different approach to data fetching — instead of fetching data on the client after the component renders, the component fetches its data on the server before sending any HTML to the browser. This eliminates client-side loading spinners for the initial data load, reduces JavaScript bundle size, and avoids request waterfalls on the client.

In Next.js 13+ with the App Router, all components are Server Components by default. Fetching data is as simple as making a component async:

// app/users/page.tsx — Server Component (no 'use client' directive)
async function UserList() {
  const response = await fetch('https://api.example.com/users', {
    next: { revalidate: 60 } // revalidate every 60 seconds
  });
  const users = await response.json();

  return (
    <ul>
      {users.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  );
}

There’s no useEffect, no useState, no loading state management — the data is ready before the component renders. Next.js extends fetch with caching options (force-cache, no-store, revalidate) to give you fine-grained control over freshness.

For highly interactive components that still need client-side data (real-time updates, user-triggered refetches), the recommended pattern in modern Next.js apps is to combine Server Components for the initial load with TanStack Query for client-side updates — giving you the best of both.

When to use it: Framework-based React apps using Next.js 13+ App Router (or TanStack Start, Remix). Not available in plain Create React App or Vite setups without a framework layer.

Best Practices for Fetching Data in React

Always handle errors explicitly. Fetch doesn’t throw on 4xx/5xx responses — check response.ok and throw manually. TanStack Query propagates thrown errors through its error state automatically.

Cancel requests on unmount. Use AbortController with a cleanup function in useEffect to cancel in-flight requests when a component unmounts. This prevents “can’t perform a state update on an unmounted component” warnings.

Show meaningful loading states. Avoid blank screens — display skeletons or spinners while data loads. TanStack Query’s isPending and isFetching flags make this easy to distinguish between “no data yet” and “refreshing in the background.”

Use query keys thoughtfully. In TanStack Query, query keys are the cache identity for your data. Include any variables the query depends on — ['users', userId] rather than just ['users'] — so the cache is correctly invalidated when parameters change.

Don’t fetch in useEffect when a framework can do it for you. If you’re using Next.js, Remix, or TanStack Start, reaching for Server Components or loader functions is often cleaner and more performant than client-side useEffect fetching for initial page data.

Cache deliberately. Both TanStack Query’s staleTime/gcTime settings and Next.js’s fetch cache options give you control over how long data stays fresh. Set these based on how frequently your data actually changes — aggressive caching can significantly improve perceived performance.

Choosing the Right Approach

Frequently Asked Questions

Is it bad to fetch data in useEffect?

Not inherently — it’s a valid pattern for simple cases. The problem is that raw useEffect data fetching doesn’t handle caching, deduplication, or background refetching, so it tends to accumulate boilerplate as apps grow. For anything beyond a single component fetching its own isolated data, TanStack Query is a better fit.

What’s the difference between React Query and TanStack Query?

They’re the same library. React Query was renamed TanStack Query when the project expanded support beyond React to Vue, Solid, and other frameworks. The React-specific package is @tanstack/react-query and the API is the same.

Should I use the v3 or v5 API for TanStack Query?

Use v5. The old positional string key syntax — useQuery('key', fn) — was deprecated in v4 and removed in v5. The current API uses an options object: useQuery({ queryKey: ['key'], queryFn: fn }). Also note that isLoading was renamed to isPending in v5.

Do React Server Components replace TanStack Query?

For initial data loads in framework-based apps, yes — Server Components are often cleaner. But TanStack Query still handles use cases that RSC doesn’t: client-side mutations, optimistic updates, polling, infinite scroll, and any data that needs to stay live after the initial page load. The hybrid pattern (RSC for initial render, TanStack Query for interactivity) has become the dominant approach in Next.js apps.

How do I handle authentication headers when fetching data?

With Axios, set up a base instance with default headers. With Fetch or TanStack Query, create a wrapper function that adds your auth header before calling fetch. TanStack Query doesn’t manage HTTP configuration directly — it calls whatever queryFn you provide, so auth handling lives in that function.

For a deeper look at how React handles state alongside data, see our guide on React Hooks basics including useState and useEffect. If you’re using Next.js as your React framework, our Next.js basics guide covers the server-rendering fundamentals that underpin React Server Components.

AI Models Don’t “Think.” They Predict.

The single most important thing to understand: a large language model is a prediction engine. It reads your entire prompt, then predicts the next word (technically, the next “token”) based on statistical patterns from its training data. Then it predicts the next word after that. And the next. One at a time, until it builds a full response.

It does not plan ahead. It does not understand your intent. It does not “know” anything. It recognizes patterns and predicts what text is most likely to follow the text you gave it.

This has a profound implication: the quality of the prediction is entirely determined by the quality of the input. Better input patterns produce better output patterns. That’s the whole game.

Every effective prompting technique — including KERNEL — works because it gives the prediction engine a higher-quality input pattern to work from.

Why “Simple” Is the Wrong Frame

The KERNEL framework starts with “Keep it simple” — suggesting that shorter prompts with less context produce better results. And for basic code tasks, that’s often true.

But the underlying principle isn’t simplicity. It’s signal-to-noise ratio.

Language models use something called an attention mechanism — a system that decides which parts of your prompt to focus on when generating each word. When your prompt is full of irrelevant context, the attention mechanism gets diluted. The model pays attention to everything equally, including the noise, and the output quality degrades.

This is why a 500-word prompt full of background rambling produces worse results than a 50-word focused prompt. But it’s also why a 500-word prompt that’s well-structured — with clear sections, labeled data, and the task at the end — can dramatically outperform the short version for complex tasks.

The “Lost in the Middle” Problem

There’s a well-documented phenomenon in language model research: performance drops by up to 30% when critical information is placed in the middle of a long prompt, compared to placing it at the beginning or the end.

The model’s attention is strongest at the start and end of your input. The middle gets less focus — it’s the cognitive equivalent of someone’s eyes glazing over during a long meeting.

This explains why the KERNEL framework’s “Logical structure” rule works so well. When you put your context first and your task last, you’re placing information exactly where the attention mechanism is strongest:

This is the theoretical basis for why structured prompt frameworks (like the Bento-Box method) consistently outperform unstructured prompts — even when they contain the same information.

Why Positive Instructions Beat Negative Constraints

The KERNEL framework recommends telling AI “what NOT to do.” This is one area where the empirical advice conflicts with the research.

Both Anthropic and OpenAI’s documentation specifically recommend positive framing over negative constraints. Here’s why it matters at the model level:

When you write “don’t use external libraries,” the model has to process the concept of external libraries, recognize it as something to avoid, and then navigate around it. But the prediction engine doesn’t have a clean “avoidance” mechanism — it processes the concept either way, and the mere presence of “external libraries” in the prompt can increase the probability of those tokens appearing in the output.

Same constraints. Different framing. The positive version gives the model a clear target pattern to follow, rather than a pattern to avoid.

Why Examples Work Better Than Descriptions

The KERNEL framework doesn’t explicitly cover few-shot prompting (providing examples), but this is one of the most powerful techniques available — and the theory explains why.

When you describe what you want (“write professional, concise emails”), the model has to interpret those adjectives and map them to a style. That interpretation is fuzzy. “Professional” means different things in different contexts.

When you show what you want (by providing 3–5 examples of the input-output pattern), you’re giving the model a concrete statistical pattern to match. It doesn’t have to interpret anything — it just extends the pattern you’ve established.

The Temperature Variable Most People Miss

Every prompt framework focuses on the words you write — but there’s a hidden variable most people never adjust: temperature.

Temperature controls how the model navigates its probability list when choosing each word. At temperature 0.0, it always picks the highest-probability word (deterministic, consistent, factual). At temperature 1.0, it samples more broadly from the distribution (creative, varied, surprising).

This is why the same prompt can produce wildly different results on different days — and why KERNEL’s “Reproducible results” principle is harder to achieve than it sounds. If you’re using a web chat interface, the temperature is set for you by the platform. But if you have access to settings or are using an API, matching the temperature to the task type is one of the highest-leverage adjustments you can make.

Where Frameworks Like KERNEL Fall Short

To be clear: KERNEL is a good framework. If you’re a developer writing code prompts, following it will improve your results significantly.

But it has three limitations worth noting:

1. It’s code-focused. The examples are all about scripts and data processing. Most people using AI aren’t writing code — they’re writing emails, creating content, analyzing data, learning new topics, making decisions. The principles are similar, but the application looks very different.

2. It doesn’t cover multi-turn interaction. One of the most powerful prompting techniques available in web chat interfaces is using follow-up messages to iteratively refine output. Most beginners treat their first prompt as the final product. In practice, the conversation is the prompt.

3. It’s model-agnostic by design — but models aren’t interchangeable. Claude handles XML-structured prompts better than any other model. GPT’s Structured Outputs can guarantee 100% JSON schema compliance. Gemini can process 2 million tokens of context at once. Knowing these model-specific strengths lets you choose the right tool for the job.

The Practical Version

Understanding why prompts work is useful. But what most people actually need is a set of practical, actionable best practices they can apply immediately — across any model, any task, any experience level.

I put together a comprehensive breakdown of the techniques that consistently produce better AI output, with before/after examples, decision frameworks, and ready-to-use patterns:

→ AI Prompt Engineering Best Practices: The Complete Guide

It covers the 5-Part Prompt Formula, the three core techniques (Zero-Shot, Few-Shot, Chain-of-Thought), when to use each one, the most common mistakes, and model-specific tips for ChatGPT, Claude, and Gemini.

If you found the theoretical breakdown here useful, that post is the practical playbook.

Want The Full Guide?

AI prompt engineering best practices aren’t about memorizing magic phrases or gaming the system. They’re a set of simple, repeatable principles that help you get dramatically better results from any AI tool — whether you use ChatGPT, Claude, Gemini, Copilot, or anything else.

The problem? Most people are still prompting the way they did in 2023. Short, vague requests. No structure. No context. And they’re wondering why the AI keeps giving them generic, surface-level answers.

This guide breaks down exactly what works in 2026 — from foundational concepts to advanced techniques — so you can stop guessing and start getting output that’s actually useful.

What Is Prompt Engineering (And Why Should You Care)?

Prompt engineering is the process of designing clear, structured inputs that guide an AI model toward accurate, useful output. That’s it. No computer science degree required.

Here’s why it matters: the quality of what you get from AI is almost entirely determined by the quality of what you put in. The model’s intelligence isn’t the bottleneck — your instructions are.

Think of AI as a brilliant new hire. They’ve read every book and article ever written, but they know absolutely nothing about your specific project, your preferences, or your audience. If you tell that new hire “fix the code,” they’ll fail. If you tell them “Review this Python 3.11 function for bugs. It should accept a list of integers and return the sum of even numbers only. Follow PEP 8 conventions” — now they can deliver.

That gap between vague and specific is the entire game of prompt engineering.

The 7 AI Prompt Engineering Best Practices That Actually Work

These aren’t theoretical. These are the principles that consistently produce better output across every major AI model.

1. Be Specific — Ruthlessly Specific

The #1 reason people get bad AI output is vagueness. Every detail you leave out is a detail the AI has to guess — and it will guess wrong.

The strong prompt specifies the topic, length, audience, tone, structure, and what “good” looks like. The AI doesn’t have to guess any of it.

2. Assign a Role

Starting your prompt with “You are a…” is one of the simplest and most effective upgrades you can make. It frames the entire response through a specific lens of expertise.

• Need a workout plan? → “You are a certified personal trainer.”
• Writing a cover letter? → “You are a hiring manager at a Fortune 500 company.”
• Explaining something complex? → “You are a patient middle school teacher.”
• Debugging code? → “You are a senior Python developer doing a code review.”

This single line changes the vocabulary, depth, and perspective of the entire response.

3. Tell the AI What TO Do, Not What NOT to Do

This is one of the most well-documented findings in prompt engineering research: AI models respond much better to positive instructions than negative constraints.

Negative instructions can actually increase the chance the AI does the thing you’re trying to prevent. Positive framing gives it a clear target to aim for.

4. Use the 5-Part Prompt Formula

For any important prompt, run through this checklist:

You don’t need all five for simple questions. But when the AI keeps giving you something generic or off-target, check which component you’re missing — that’s usually the fix.

5. Show Examples (Few-Shot Prompting)

If you need the output in a very specific format, tone, or style, the most effective technique is to show the AI what good looks like. This is called few-shot prompting, and 3–5 examples is the sweet spot.

The AI learns the pattern from your examples and applies it consistently. This is especially powerful for classification, formatting, and maintaining a consistent brand voice.

6. Make the AI Show Its Work (Chain-of-Thought)

For any task involving math, logic, analysis, or multi-step reasoning, adding one simple phrase dramatically improves accuracy: “Let’s think step by step.”

This forces the AI to generate intermediate reasoning steps instead of jumping straight to an answer — and each step gives the next step better context. It’s called Chain-of-Thought prompting, and it’s one of the most well-researched techniques in the field.

For even better results, you can tell the AI exactly what steps to follow:

Heads up: Chain-of-Thought generates more text (the reasoning steps), which means it uses more tokens and is slightly slower. Use it when accuracy matters — not for simple questions where a direct answer works fine.

7. Use Follow-Up Messages to Refine

This is the technique most beginners miss entirely: the conversation itself is a prompt engineering tool.

You don’t have to nail everything in one message. The AI remembers the full conversation, so you can start broad and refine:

Each follow-up builds on the full context of the conversation. This “refine as you go” approach is often easier and more effective than trying to write the perfect prompt on the first try.

Quick Reference: Technique Comparison

Different tasks call for different techniques. Here’s how to choose:

The Biggest Mistakes People Make

After analyzing hundreds of prompts, these are the patterns that consistently produce bad output:

1. Being too vague. “Help me with marketing” gives the AI nothing to work with. Be specific about what, for whom, and in what format.
2. Not providing context. The AI doesn’t know your business, your audience, or your goals unless you tell it.
3. Accepting the first response as final. The first output is a draft. Use follow-ups to shape it into exactly what you need.
4. Dumping a document with no instructions. Pasting 5,000 words and hoping for the best doesn’t work. Tell the AI what to do with it.
5. Asking multiple unrelated questions in one prompt. Ask one thing at a time, or number your questions clearly.
6. Never specifying the audience. “Explain this” is ambiguous. “Explain this for a non-technical executive” is actionable.

These Principles Work Across Every AI Model

Whether you’re using ChatGPT, Claude, Gemini, Copilot, or any other tool — these best practices work because they’re based on how language models process information, not on any platform-specific trick.

That said, each model does have specific strengths worth knowing about:

• Claude excels with XML-structured prompts and handles complex, multi-part instructions particularly well.
• ChatGPT (GPT-4/5) has strong system message persistence and offers Structured Outputs for guaranteed JSON formatting.
• Gemini can process massive context windows (up to 2 million tokens) and handles multimodal input (text + images + video).

The fundamentals — clarity, specificity, structure, examples, and iteration — are universal.

Want the Complete System? Get the Full Guide Pack.

Start Improving Your Prompts Today

You don’t need to master everything at once. Start with the two highest-impact changes:

1. Be specific. Add context, audience, format, and constraints to your next prompt and compare the result to what you normally get.
2. Use follow-ups. Stop treating your first prompt as final. Send it, then refine with 2–3 follow-up messages.

That alone will put you ahead of the vast majority of AI users. And if you want the full system — the complete guides, ready-to-use templates, model-specific strategies, and advanced techniques — grab the complete bundle here.

The models keep getting smarter. But the gap between a careless prompt and a well-engineered one isn’t closing — it’s widening. The people who learn this skill now will compound that advantage every single day they use AI.

Want the complete system with 6 guides, 37 prompt templates, and model-specific cheat sheets? Get the AI Prompt Engineering Best Practices bundle →

What This Guide Covers

This guide walks through installing OpenClaw using Docker, the easiest and most reliable way to run it locally.

By the end of this guide you’ll have:

• OpenClaw running in a Docker container

• The gateway configured

• Your first agent ready to connect to AI providers

This method works on:

• macOS

• Linux

• Windows (WSL2)

• Synology / NAS environments that support Docker

What OpenClaw Actually Installs

Before installing, it helps to understand what you’re running.

OpenClaw consists of three main pieces:

Docker packages these pieces into a container so you don’t need to manually install dependencies.

Requirements

Before installing OpenClaw you need:

1. Docker installed

Check if Docker is installed:

If it isn’t installed yet:

• macOS / Windows → Install Docker Desktop

• Linux → Install Docker Engine

Minimum recommended system:

OpenClaw can run on less, but builds may take longer.

Step 1 — Clone the OpenClaw Repository

Download the project from GitHub.

This repository includes:

• Docker configuration

• setup scripts

• onboarding tools

• environment configuration

Step 2 — Run the Docker Setup Script

The easiest way to install OpenClaw is using the included setup script.

This script automatically:

• Builds or pulls the OpenClaw Docker image

• Starts the Docker containers

• Runs onboarding

• Creates the .env configuration file

• Generates your gateway token

You do not need to manually run Docker commands.

Optional: Use the Prebuilt Image (Faster)

If you want to avoid building locally, you can use the official container image.

This can save several minutes during installation.

Step 3 — Complete Onboarding

During setup you’ll be asked to configure your AI provider.

Common choices:

You will typically enter an API key.

Example:

Step 4 — Start the Gateway

Once setup finishes, start OpenClaw.

This launches the gateway container in the background.

Step 5 — Verify OpenClaw Is Running

Check container status:

You should see something like:

If it is running, the installation succeeded.

You can also check logs:

Where OpenClaw Stores Data

By default OpenClaw stores data inside the container.

For persistent data, you can mount a workspace folder.

Example:

This allows agents to keep files between restarts.

Updating OpenClaw

To update OpenClaw later:

Troubleshooting

Docker build fails

Try using the prebuilt image:

Container stops immediately

Check logs:

Most failures come from:

• missing API keys

• incorrect environment variables

• port conflicts

Out of memory errors

OpenClaw builds can require several gigabytes of RAM.

Try increasing Docker memory limits or using the prebuilt image.

Optional Advanced Setup

Advanced users may want to enable:

• sandbox mode

• browser automation

• persistent workspaces

• multi-agent orchestration

These require additional Docker configuration.

Final Thoughts

Installing OpenClaw with Docker removes most of the complexity of dependency management. Once running, you can begin experimenting with autonomous agents, automation workflows, and AI-driven tasks.

Claude Code is available through Anthropic’s subscription plans starting at $20 per month, with higher tiers offering more usage and access to the most powerful models. You can also use pay-as-you-go API billing for more flexibility. This guide breaks down every option so you can choose the plan that matches how you actually work and avoid paying more than you need to.

If you are new to Claude Code, start with our overview of what Claude Code is before diving into pricing. Ready to get started? Head to our installation guide.

Anthropic offers several subscription tiers that include Claude Code. Each uses session-based usage limits that reset every five hours, so your capacity refreshes throughout the day rather than being a single monthly allowance.

The Free plan provides access to Claude.ai chat but very limited Claude Code functionality. For any real development work, a paid plan is necessary.

The Pro plan costs $20 per month billed monthly, or $17 per month with annual billing. It includes Claude Code access with moderate limits, roughly 10 to 40 prompts every five hours depending on complexity. Pro works for learning Claude Code, light development, and occasional coding sessions. It also includes file creation, code execution, Projects, and web search.

The Max plan comes in two tiers. Max 5x at $100 per month gives you five times the Pro usage. Max 20x at $200 per month gives twenty times Pro limits. Both include access to the Opus model, the most capable for complex engineering, and priority during high-demand periods. Max is for developers who rely on Claude Code as a primary daily tool.

API Pay-As-You-Go Pricing

If you prefer usage-based billing, use Claude Code with an Anthropic Console account and API key. You pay per token, with costs varying by model. Sonnet runs $3 per million input tokens and $15 per million output tokens. Opus costs significantly more but delivers stronger reasoning.

API pricing offers precise cost control and no hard usage caps, which matters for automation and scaling. However, costs can be variable and high with heavy use. One developer tracked eight months of heavy daily usage that would have cost over $15,000 on API pricing but only $800 on the Max plan. For most developers using Claude Code daily, the subscription wins on cost.

The API also offers batch processing at 50 percent off for non-urgent tasks and prompt caching that charges only 10 percent for cached content after the first request. System prompts and CLAUDE.md files are cached automatically.

Team and Enterprise Plans

For organizations, the Team plan starts at $25 per Standard seat per month with annual billing. Standard seats include collaboration features but not Claude Code. Premium seats at $150 per month add Claude Code access and early features, suited for technical teams. Enterprise plans include all Team features with additional governance and security. Contact Anthropic for Enterprise pricing.

Which Plan Should You Choose?

If you are starting out or use Claude Code a few times per week, Pro at $20 per month provides enough capacity for learning and light tasks. You will hit limits during sustained sessions, but for occasional use it works.

If Claude Code is a regular part of your workflow, Max 5x at $100 per month is the sweet spot. It handles daily professional work including complex debugging, feature implementation, and code review without constant limit interruptions.

For power users running Claude Code continuously across multiple projects or needing unrestricted Opus access, Max 20x at $200 per month offers the highest capacity. If your equivalent API costs would exceed $200 monthly, this tier saves significant money.

If your usage is unpredictable or you are integrating Claude Code into automated pipelines, API billing provides flexibility but requires monitoring. Start with a small amount of credits to understand your patterns before committing.

How to Track and Reduce Costs

The /cost command shows your session’s token usage and estimated cost, most useful for API users. For continuous visibility, configure the status line to show token usage at all times.

The most effective cost reduction strategies are clearing context between tasks with /clear so you stop paying for irrelevant history, using /compact to summarize long conversations, and choosing Sonnet over Opus for routine tasks. Sonnet handles most coding work well at much lower cost per token.

For teams, administrators set workspace spend limits in the Anthropic Console and view usage reports. The average API cost is roughly $6 per developer per day, with 90 percent of users staying below $12 daily. For configuration details, see our setup guide.

Understanding Usage Limits

Anthropic introduced weekly rate limits in August 2025 on top of the five-hour session resets. These primarily affect power users running Claude Code continuously and impact less than five percent of subscribers according to Anthropic. Pro and Max plans have different thresholds, with Max getting proportionally higher caps.

Claude Code sessions consume more capacity than regular chat because they include system instructions, full file contexts, long code outputs, and multiple tool calls per interaction. You will use your allocation faster than in the Claude.ai chat interface. Max subscribers can purchase additional usage beyond rate limits at standard API rates if needed.

For more on how tokens and context windows work technically, read how Claude Code works under the hood. To learn practical efficiency techniques, see our guide to using Claude Code effectively.

Claude Code is more than a chatbot that writes code. It is an agentic system that reads your files, executes terminal commands, manages git operations, connects to external services, and coordinates with other tools, all while maintaining awareness of your full codebase. Understanding how it works helps you use it more effectively, choose the right model, manage context, and extend it with external tools through MCP.

For a general overview of what Claude Code does, see what is Claude Code. To start using it right away, check out how to use Claude Code.

Claude Code runs on Anthropic’s Claude family of large language models. By default, it uses Claude Sonnet, which balances coding capability and speed well for most development tasks. Subscribers on Max plans also get access to Claude Opus, the most capable model, which excels at complex multi-step reasoning, architectural decisions, and debugging subtle issues.

Switch between models during a session with the /model command. Sonnet is faster and cheaper per token, ideal for routine tasks like writing tests, fixing lint errors, and generating boilerplate. Opus takes longer per response but produces higher quality results for challenging problems. Haiku is also available as the fastest, most economical option for simple tasks.

The specific model versions evolve as Anthropic ships updates. Claude Code automatically uses the latest versions, so you benefit from improvements without changing any configuration. The models have large context windows allowing Claude Code to process significant amounts of code and conversation history in a single session.

How Claude Code Processes Your Requests

When you send a message, Claude Code assembles a prompt that includes your system configuration from CLAUDE.md files, conversation history, referenced file contents, and your current request. This prompt goes to the Claude API, which returns a response containing text explanations, code suggestions, or tool use requests.

Tool use is what makes Claude Code agentic. The model can request to read files, write files, execute bash commands, search your codebase, and interact with MCP servers. Each tool use requires your approval by default unless you have pre-configured permissions. After a tool executes, the result feeds back to the model for the next step, creating an iterative loop.

This means a single request from you might result in Claude Code reading several files, running a test suite, identifying failures, editing code, running tests again, and reporting success, all as part of one interaction. The model decides which tools to use and in what order based on your request and the results at each step.

Context Windows and Token Management

Every session operates within a context window, the total amount of text the model considers at once. This includes system prompts, CLAUDE.md files, conversation history, file contents, and tool results. As sessions grow, context fills up and needs management.

Claude Code handles this through auto-compaction, which summarizes conversation history when approaching limits. You can trigger manual compaction with /compact, optionally specifying what to prioritize. The /clear command discards context entirely for switching to unrelated tasks.

Prompt caching reduces both cost and latency. System prompts and CLAUDE.md content that does not change between messages gets cached, so subsequent interactions process faster at reduced cost. This is why well-structured CLAUDE.md files matter for both quality and efficiency. For detailed cost management, see our pricing guide.

How Claude Code Reads and Edits Your Codebase

Claude Code uses agentic search to understand your codebase rather than requiring manual file selection. When you ask about your project, it searches file names, contents, and structure to find relevant code, working like an AI-powered grep. For file editing, changes are proposed as diffs you review before accepting. In the terminal, diffs display inline. In VS Code and other IDEs, they appear as visual overlays. See our guide on using Claude Code in VS Code for the IDE experience.

Claude Code can spawn multiple sub-agents for parallel work. A lead agent coordinates the task and assigns parts to specialized sub-agents, each with their own context window. This is powerful for large refactoring jobs spanning many files.

How to Add MCP Servers to Claude Code

The Model Context Protocol is an open standard that extends Claude Code beyond your local codebase. By adding MCP servers, you connect Claude Code to GitHub, Jira, Google Drive, Slack, databases, and any custom tooling you build.

Add servers with the “claude mcp add” command, specifying the server name, transport type, and connection details. Configure them at the project level in a .mcp.json file in your project root, or globally in your Claude Code settings. Project-level configuration is best for servers specific to one project. Global configuration suits general-purpose servers like Slack or Google Drive.

For servers requiring OAuth authentication, Claude Code supports pre-configured client credentials. Use the –client-id and –client-secret flags with “claude mcp add” for servers that do not support Dynamic Client Registration.

Common MCP Server Setups

GitHub is one of the most popular MCP servers. It lets Claude Code read issues, create branches, open and review pull requests, and manage repository workflows. Combined with code editing, this creates a complete loop from issue to merged PR without leaving your terminal.

Google Drive connects Claude Code to your documents, useful for implementing features based on specs stored outside your repo. Slack integration enables automated status updates after completing tasks. Database servers let Claude query your development databases to understand schemas, verify fixes, or generate migrations. Custom MCP servers can wrap any API or internal tool.

Managing MCP Permissions and Troubleshooting

When you add a server, Claude Code asks permission before using its tools. Pre-configure permissions with wildcard syntax in your settings. “mcp__servername__*” allows all tools from a server, while more granular patterns restrict specific tools. The /permissions command shows and manages your rules.

If an MCP server shows as “pending” and never connects, verify the server process is running and accessible from your terminal environment. WSL users should ensure the server is reachable from the Linux side. The /debug command helps troubleshoot connection issues. Servers loaded from .mcp.json can get stuck pending in non-interactive mode with -p, which restarting in interactive mode resolves.

Be selective about which servers you connect. Each adds tool definitions to your context, consuming tokens. Five servers with 10 tools each means 50 tool definitions on every message. Only connect servers you actively use. Use project-level .mcp.json so servers only load for relevant projects.

How to Access Claude Code

Claude Code is accessible through several surfaces. The terminal CLI runs on macOS, Linux, and Windows. IDE extensions work in VS Code, Cursor, Windsurf, and JetBrains. The web interface at claude.ai/code runs in your browser without local installation. Sessions move between surfaces with /teleport.

All access methods require a Claude subscription or Anthropic Console account. For pricing details, see our cost guide. To get set up, follow our installation guide and then the configuration walkthrough.

Claude Code is an AI-powered agentic coding tool built by Anthropic that lives directly in your terminal. Unlike traditional code assistants that autocomplete lines or answer questions in a chat window, Claude Code understands your entire codebase, executes commands, edits files across your project, manages git workflows, and handles complex development tasks through natural language conversation.

Whether you are a seasoned developer looking to speed up repetitive tasks or someone exploring AI-assisted development for the first time, Claude Code represents a fundamentally different approach to writing software. Instead of switching between a chatbot and your editor, you stay in your terminal and describe what you need done in plain English.

Claude Code at a Glance

At its core, Claude Code is a command-line interface that gives you conversational access to Anthropic’s most capable AI models. You launch it from your terminal, navigate to your project folder, and start describing what you want to accomplish. Claude Code then reads your files, understands the context, and takes action by editing code, running tests, creating new files, or executing shell commands on your behalf.

Claude Code is not limited to the terminal, though. It integrates with popular editors like VS Code, Cursor, Windsurf, and JetBrains IDEs through native extensions. You can even run it directly in your browser at claude.ai/code without any local setup, or hand off sessions between devices using the teleport feature. For a detailed walkthrough of editor integration, see our guide on how to use Claude Code in VS Code and Cursor.

Who Makes Claude Code?

Claude Code is developed and maintained by Anthropic, the AI safety company founded in 2021 by former OpenAI researchers including Dario and Daniela Amodei. Anthropic builds the Claude family of large language models that power the tool, and focuses on creating reliable, interpretable AI systems. Claude Code is one of their flagship developer products alongside the Claude API and Claude.ai chat interface.

The tool is open source on GitHub at github.com/anthropics/claude-code, meaning you can inspect the code, report issues, and follow development progress. Anthropic actively maintains it with new releases shipping regularly through automatic background updates.

What Is the Claude Code CLI?

When people say “Claude Code CLI,” they mean the core command-line interface that you interact with in your terminal. After installation, you type “claude” to launch an interactive session. From there, you type natural language requests, use slash commands like /init to generate a project configuration file or /clear to reset context, and reference specific files using the @ symbol.

The CLI supports several flags for different workflows. Running “claude -p” followed by a prompt gives you a single response without entering interactive mode, which is perfect for scripting and automation. The “claude -c” flag resumes your last conversation, and “claude –model” lets you switch between different AI models. There is no separate CLI package to download. The main installation gives you everything. For a deep dive into terminal workflows, see how to use Claude Code in the terminal.

What Makes Claude Code Different From Other AI Coding Tools?

Most AI coding assistants work as plugins inside your editor, offering suggestions as you type. Claude Code takes a different philosophy by following the Unix tradition of composable tools. You can pipe logs into it, run it inside CI/CD pipelines, chain it with other command-line utilities, or spawn multiple agents working on different parts of a task simultaneously.

Claude Code also has full agentic capabilities. It does not just suggest code and wait for you to copy and paste. It reads files, writes changes, executes terminal commands, runs your test suite, commits to git, and even opens pull requests. You review and approve each action, keeping you in control while Claude handles the heavy lifting.

The tool connects to external services through the Model Context Protocol, or MCP, which lets it read design docs from Google Drive, update tickets in Jira, pull data from Slack, or interact with any custom tooling you build. To understand how all of this works under the hood, read our deep dive on how Claude Code works, what models it uses, and how to extend it with MCP.

What Can You Do With Claude Code?

On the routine side, Claude Code excels at writing tests for untested code, fixing lint errors across a project, resolving merge conflicts, updating dependencies, and generating release notes. These are the tedious chores that eat up developer time, and Claude Code automates them through simple natural language prompts.

For more complex work, Claude Code implements entire features spanning multiple files, refactors large codebases, debugs tricky issues by reading error logs and tracing through code paths, and explains unfamiliar codebases to help you onboard faster. It supports multi-agent workflows where a lead agent coordinates several sub-agents working on different components simultaneously.

How Good Is Claude Code?

Claude Code’s quality depends on which model you use and how well you structure your requests. With Opus, the most powerful model, it handles complex architectural reasoning, multi-file refactoring, and subtle debugging with strong results. It consistently ranks among the top AI coding tools for understanding large codebases and maintaining context across extended development sessions.

For routine tasks like writing tests, implementing features from clear specifications, fixing bugs, and managing git workflows, Claude Code is highly effective with any model tier. Where it is less strong is in areas requiring domain knowledge about proprietary internal frameworks or very recently released libraries. The CLAUDE.md configuration file helps mitigate this by giving Claude Code explicit context about your project’s specifics.

How Much Does Claude Code Cost?

Claude Code is included with Anthropic subscription tiers. The Pro plan at $20 per month gives you access with moderate usage limits. Max plans at $100 and $200 per month offer significantly higher usage caps and access to Opus. You can also use pay-as-you-go API billing through the Anthropic Console. For a full breakdown of every plan, usage limits, and cost optimization tips, check out our detailed Claude Code pricing guide.

Getting Started

Setting up Claude Code takes just a few minutes on macOS, Linux, or Windows. Anthropic provides native installers that do not require Node.js. After installing, you authenticate with your Anthropic account and navigate to your project directory to start your first session.

Follow our step-by-step installation guide covering Mac, Windows, and Linux. Once installed, our guide on setting up, configuring, and keeping Claude Code updated walks you through authentication, CLAUDE.md files, and your first productive session. When you are ready to dive in, see our complete practical guide to using Claude Code.

Installing Claude Code takes just a few minutes regardless of your operating system. Anthropic now offers native installers as the recommended method, and the entire process goes from download to first coding session in about five minutes. This guide covers every installation method for every platform so you can get Claude Code running quickly.

If you are new to the tool and want to understand what it does before installing, start with our overview of what Claude Code is and what it can do.

Claude Code runs on macOS 10.15 or later, most Linux distributions including Ubuntu 20.04 and Debian 10, and Windows 10 or later. You need at least 4GB of RAM and an active internet connection. The native installer does not require Node.js, which simplifies setup considerably compared to older npm-based methods.

You also need either a Claude Pro or Max subscription, or an Anthropic Console account with API credits. Claude Code authenticates through your browser on first launch, so make sure you have an active account ready. Not sure which plan to pick? See our Claude Code pricing breakdown.

Installing Claude Code on Mac

Open Terminal on your Mac. You can find it in Applications, then Utilities, or press Command+Space and type Terminal. Run the native install script from Anthropic’s official source. The installer downloads the correct binary for your Mac architecture, whether Intel or Apple Silicon, and configures your PATH automatically.

After the script finishes, verify the installation by typing “claude –version” in your terminal. You should see a version number without errors. The native macOS binary is signed by Anthropic PBC and notarized by Apple, so you should not see Gatekeeper warnings. If your Mac blocks it, go to System Preferences, then Security and Privacy, and allow the installer.

Mac users who prefer Homebrew can install with the brew install command instead. The important difference is that Homebrew installations do not auto-update. You need to manually run “brew upgrade claude-code” periodically. For most Mac users, the native installer is the better choice because of its automatic background updates.

Installing Claude Code on Windows

Windows users have two solid options: native installation or WSL.

For native installation, use WinGet from PowerShell or Command Prompt by running “winget install Anthropic.ClaudeCode” and following the prompts. After installation, verify with “claude –version” in Git Bash, PowerShell, or Command Prompt. Native Windows requires Git Bash for the full Claude Code experience. If you do not have it, install Git for Windows from the official Git website, which includes Git Bash. Windows Terminal is recommended as your terminal emulator. Note that WinGet installations do not auto-update, so run “winget upgrade Anthropic.ClaudeCode” periodically.

For WSL installation, open PowerShell as Administrator and run “wsl –install -d Ubuntu” to set up WSL with Ubuntu. Reboot when prompted. After rebooting, open your Ubuntu terminal, update packages with “sudo apt update && sudo apt upgrade -y,” and install Git with “sudo apt install git -y.” Then run the Claude Code install script from your Ubuntu terminal, just as you would on native Linux. WSL 2 is recommended over WSL 1 because it supports Bash tool sandboxing for enhanced security.

For WSL users who also use VS Code, connect VS Code to your WSL environment by running “code .” from your WSL terminal. This lets you use the Claude Code extension while Claude Code runs in WSL. Read more in our guide on using Claude Code in VS Code and Cursor.

Installing Claude Code on Linux

On Linux, open your terminal and run the native install script. The process is identical to macOS. The installer detects your distribution and architecture, downloads the correct binary, and sets up your PATH. Verify with “claude –version” after installation. Native installations on Linux auto-update in the background just like on Mac.

The npm Method (Deprecated)

Older guides may reference installing Claude Code globally through npm. While this still works, Anthropic has deprecated it in favor of native installers. If you have an existing npm installation, migrate by running “claude install” from your terminal, which switches you to the native binary while preserving your settings and project configurations.

If you do use npm, ensure you have Node.js version 18 or higher. Never use sudo with npm install as this causes permission issues. Instead, configure a user-level npm directory by running “mkdir ~/.npm-global” and updating your npm prefix and PATH accordingly.

Installing the CLI Specifically

There is no separate Claude Code CLI package. When people search for “how to install Claude Code CLI,” they mean the main tool itself. Every installation method above installs the full CLI, which includes both the interactive chat mode and the non-interactive pipeline mode for scripting and automation.

How to Download Claude Code

If you prefer a downloadable binary rather than a command-line installer, the GitHub releases page at github.com/anthropics/claude-code has binaries for each platform. You can also access Claude Code in your browser at claude.ai/code with no download needed, which is useful for trying it before committing to a local install.

IDE extensions are available separately in the VS Code marketplace and JetBrains marketplace. These connect to the Claude Code backend on your machine and are covered in our VS Code and Cursor integration guide.

Verifying and Troubleshooting Your Installation

Run “claude –version” to confirm Claude Code is installed correctly. If you see “command not found,” your PATH is likely not configured. Close and reopen your terminal to refresh, then try again. On macOS, check that your .zshrc file includes the installation directory in PATH. On Linux, check .bashrc. On Windows, ensure Git Bash or your preferred terminal can find the binary.

Anthropic provides a diagnostic command, “claude doctor,” that checks your installation type, version, authentication status, and configuration for common issues. Run this whenever something seems off.

If troubleshooting does not resolve the issue, a clean reinstall usually works. Remove the binary and any configuration files, then follow the installation steps again from scratch.

Next Steps

With Claude Code installed, head to our guide on setting up Claude Code for authentication, CLAUDE.md configuration, updates, and your first session. When you are ready to start working, our complete usage guide covers practical workflows and tips for getting the best results.