Claude Code

Lavora con Claude direttamente nel tuo codebase. Sviluppa, esegui il debug e rilascia dal terminale, dall'IDE, da Slack, dal web e altro ancora.

acme-dashboard/Add a dark mode toggle to settings
Add a dark mode toggle to the settings page. Should remember the choice and follow the system default until they pick one.

There's already a ThemeProvider wrapping the app but it's hard-wired to light. I'll lift the mode into context, persist it to localStorage, and add a Light / Dark segmented control under Settings → Appearance.

just now
src/theme/ThemeProvider.tsx
10export function ThemeProvider({children}: {children: ReactNode}) {
11+ const prefersDark = useMediaQuery('(prefers-color-scheme: dark)')
12 const stored = localStorage.getItem('theme')
13+ const [mode, setMode] = useState(stored ?? (prefersDark ? 'dark' : 'light'))
14 
15+ useEffect(() => {
16+ localStorage.setItem('theme', mode)
17+ }, [mode])
18 
19 return (
20 <ThemeContext.Provider value={{mode, setMode}}>
21 {children}

Done — the Appearance section now has the toggle. Preview's on the right; flip it and the whole app should follow. Reduce-motion and density rows are stubbed so the page doesn't look bare.

just now
#112acme-dashboardclaude/settings-dark-mode-Xk4fq CI
Extra high

Inizia con Claude Code

Pro

Claude Code è incluso nel Pro plan. Ideale per sessioni di coding rapide su codebase di piccole dimensioni.

$17

Al mese con sconto per abbonamento annuale ($200 fatturati anticipatamente). $20 con fatturazione mensile.

Prova Claude (opens in new tab)

Max 5x

Claude Code è incluso nel Max plan. Ottimo valore per l'utilizzo quotidiano su codebase di grandi dimensioni.

Max 20x

Claude Code è incluso nel Max plan con un utilizzo ancora più esteso. Il massimo valore per chi usa Claude in modo intensivo.

Limiti di utilizzo applicabili. I prezzi indicati non includono le imposte applicabili. Prezzi e piani sono soggetti a modifiche a discrezione di Anthropic.

Cosa potresti realizzare con Claude Code?

Oppure consulta la documentazione

I'm new to this codebase. Can you explain it to me?

⏺ I'll analyze the Excalidraw codebase structure and provide a high-level overview.

⏺ Analyze(what: "Excalidraw codebase structure and provide a high-level overview of what it is, its main components, and how they're organized. Focus on understanding the project's purpose, architecture, and key features.")

Excalidraw is an open-source virtual whiteboard application with a hand-drawn style. It's designed for creating diagrams, wireframes, and collaborative drawings.

## Purpose
- Web-based drawing tool with infinite canvas
- Hand-drawn aesthetic with support for shapes, arrows, text
- End-to-end encrypted collaboration
- Works offline as a PWA (Progressive Web App)

## Architecture
The project is organized as a monorepo with these main components:

1. Core Package (packages/excalidraw)
- React component library for embedding Excalidraw in any application
- Handles drawing, rendering, and core functionality
- Uses roughjs for the hand-drawn style
- Includes export capabilities (PNG, SVG)

2. Web Application (excalidraw-app/)
- Full-featured web app at excalidraw.com
- Built on top of the core package
- Adds collaboration features, local storage, sharing

3. Support Packages
- common - Shared utilities and constants
- element - Element manipulation and type definitions
- math - Mathematical functions for drawing
- utils - General utility functions

4. Examples
- Integration examples (Next.js, browser script)
- Shows how to embed Excalidraw in different environments

5. Documentation (dev-docs/)
- API documentation
- Integration guides
- Component documentation

## Key Features
- Real-time collaboration with end-to-end encryption
- Export to various formats (PNG, SVG, JSON)
- Customizable drawing tools (rectangle, circle, arrows, freehand)
- Dark mode support
- Localization
- Library of shapes and components
- Arrow bindings and labels
- Image support

## Technology Stack
- React for UI
- TypeScript for type safety
- Firebase for collaboration backend
- Jotai for state management
- Vite for development and building
- IndexedDB/LocalStorage for offline storage

The architecture allows for both using Excalidraw as a component in other applications and as a standalone web application with additional features.
  • Onboarding sul codice

    Claude Code mappa e illustra interi codebase in pochi secondi. Utilizza la ricerca agentiva per comprendere la struttura del progetto e le dipendenze, senza dover selezionare manualmente i file di contesto.

  • Trasforma le segnalazioni in PR

    Smetti di passare da uno strumento all'altro. Claude Code si integra con GitHub, GitLab e gli strumenti da riga di comando per gestire l'intero flusso di lavoro: lettura delle segnalazioni, scrittura del codice, esecuzione dei test e invio delle PR, tutto dal terminale.

  • Apporta modifiche potenti

    Grazie alla comprensione approfondita del codebase e delle dipendenze, Claude Code è in grado di apportare modifiche potenti e coerenti su più file.

Si adatta al tuo ambiente di sviluppo

Claude Code running in a terminal

Inizia dal terminale

Integrazione avanzata con il terminale. Compatibile con tutti gli strumenti CLI e qualsiasi IDE.

Oppure consulta la documentazione

Claude Code extension in VS Code

Integra il tuo editor

Estensioni native per VS Code (inclusi Cursor e Devin Desktop) e JetBrains IDE.

Claude Code on the web

Accesso da qualsiasi luogo

Accesso rapido dal browser, dall'app mobile o da Claude desktop. Ideale per il lavoro in parallelo o il coding in mobilità.

Avvia attività di coding in Slack

Cosa dicono gli sviluppatori

  • Claude Code ha accelerato notevolmente l'efficienza del nostro team nel coding. Ora posso scrivere codice EDA in un notebook, estrarre dati, addestrare un modello e valutarlo con metriche di base, per poi chiedere a Claude di convertire il tutto in una pipeline Metaflow. Questo processo fa risparmiare da uno a due giorni di lavoro routinario, e spesso noioso, per ogni modello.

    Anton Biryukov, Staff Software Engineer

    Leggi la storia
  • Con Claude non stiamo semplicemente automatizzando il servizio clienti: lo stiamo elevando a una qualità davvero umana. Questo permette ai team di supporto di ragionare in modo più strategico sull'esperienza del cliente e su ciò che rende le interazioni autenticamente preziose.

    Fergal Reid, VP of AI

    Leggi la storia
  • Claude Code sta portando il nostro team a un livello superiore: decidiamo cosa deve accadere e ottimizziamo il processo affinché possa sviluppare e verificare tutto end-to-end. Gran parte del mio lavoro ora consiste nel tenere il maggior numero possibile di istanze di Claude Code sempre attive.

    Simon Last, Co-founder

    Leggi la storia

Compatibile con i tuoi strumenti da riga di comando preferiti

Il terminale è dove avviene il lavoro vero. Claude Code si integra con gli strumenti che alimentano lo sviluppo: deployment, database, monitoraggio, version control. Invece di aggiungere un'altra interfaccia da gestire, potenzia il tuo stack esistente.

FAQ

Claude Code by Anthropic | AI Coding Agent, Terminal, IDE