# What is React (and when you do not need it)

React is a JavaScript library for building interfaces: it handles component rendering and state, while routing, data and styling stay your choice.

> Page: https://ui.eneawork.it/blog/che-cose-react
> Markdown: https://ui.eneawork.it/blog/che-cose-react.md

*2026-11-01*

“What is react” ha una risposta breve: React è una libreria JavaScript per costruire interfacce, mantenuta da Meta con licenza MIT e arrivata alla versione 19.

Il catalogo EneUI conta 111.985 componenti, 1.556 blocchi e 12.808 icone da 1.472 librerie, misurati da /api/stats il 1 novembre 2026. La cifra viene da una query all'endpoint, non da una stima: conta i record pubblicati, non la qualità dei componenti.

## Cosa fa, cosa lascia fuori

React gestisce il rendering: prende lo stato di un componente, calcola l'albero da mostrare e aggiorna il DOM. Non decide le rotte, non scarica dati e non impone un sistema di stile. Ogni pezzo mancante diventa una scelta esplicita, con la sua licenza e il suo ciclo di aggiornamenti.

## Un progetto minimo

npm create vite@latest react-minimal -- --template react cd react-minimal npm install npm run dev

Vite, distribuito con licenza MIT, crea il progetto, installa React e avvia il server di sviluppo. Il file src/App.jsx contiene già un componente con stato: modificalo e la pagina si aggiorna senza ricaricare.

## Il confine con le librerie

Il comando node scripts/kw.js react, eseguito il 31 ottobre 2026 sulla Stack Exchange API, restituisce 2.376 voti per la domanda «How can I programmatically navigate using React Router?» e 1.306 per «React-router URLs don't work when refreshing or writing manually». Entrambi i numeri riguardano lo stesso confine: la navigazione non vive in React, vive in un pacchetto che scegli, configuri e aggiorni.

## Record vivi nel catalogo

Due componenti React del catalogo mostrano il modello in pratica: sidebar e dropdown-menu, entrambi su primitive Radix con licenza MIT. Per esplorare per categoria parti da 111.985 componenti.

## Un esempio concreto: un dato derivato

type Row = { id: string; title: string }; export function VisibleRows({ rows, query }: { rows: Row[]; query: string }) { const visible = rows.filter((row) => row.title.toLowerCase().includes(query.toLowerCase()), ); return ( {visible.map((row) => ( {row.title} ))} ); }

Il filtro si calcola dentro il render, partendo da rows e query. Non c'è stato locale né useEffect: quando una prop cambia, React richiama la funzione e la lista resta una funzione pura dell'input. Aggiungere uno stato intermedio qui produce due render e un valore che può restare indietro rispetto alle prop.

## Quando non serve

Un sito di contenuti, un blog o una pagina vetrina rendono meglio come HTML generato: Astro, con licenza MIT, spedisce zero JavaScript di framework finché non aggiungi un'isola interattiva. Un widget isolato in una pagina esistente si risolve con JavaScript semplice, senza build. Se il team lavora già con Vue o Svelte, aggiungere React crea due ecosistemi da mantenere.

## La limitazione

React non include nulla di ciò che serve per andare in produzione: rotte, dati, form, test e stile sono decisioni separate. Il costo non è la curva iniziale, è l'assemblaggio: ogni libreria aggiunta porta una versione da seguire e una compatibilità da verificare a ogni aggiornamento.

## La regola di decisione

Adotta React quando almeno due schermate condividono uno stato che deve sopravvivere alla navigazione. Se l'interazione vive in un solo punto della pagina, o se lo stato può morire al cambio di URL, un'isola di JavaScript semplice costa meno: nessun bundle di framework, nessuna idratazione. Un preventivo, una pagina prezzi e un form di contatto restano sotto quella soglia.

## L'errore da evitare

L'errore più frequente è copiare una prop nello stato con useEffect e poi tenerla sincronizzata a mano. Il valore duplicato parte dal render precedente, il secondo aggiornamento arriva un frame dopo e il test passa solo perché la macchina è veloce. Se un valore si ricava da prop o da altro stato, calcolalo nel corpo del componente: lo stato serve a ciò che nasce da un evento dell'utente.

## Dove continuare

Il modello di distribuzione dei componenti è in che cos'è shadcn/ui; il confronto fra le librerie React misurate è in librerie React 2026; la scelta fra i due framework più diffusi è in Vue 3 vs React.

## FAQ

### React è un framework?

No. React è una libreria per il rendering delle interfacce. Rotte, recupero dati e stile arrivano da pacchetti separati, oppure da un meta-framework come Next.js.

### Serve TypeScript per usare React?

No, ma conviene. I tipi delle prop e dello stato intercettano errori che altrimenti compaiono a runtime, e Vite può creare il progetto già in TypeScript.

### React è gratis anche per un prodotto commerciale?

Sì. React è distribuito con licenza MIT, che permette uso commerciale, modifica e ridistribuzione mantenendo l'avviso di copyright.

### Posso usare React senza Node.js?

Nel browser sì, caricando React da un CDN. Per compilare JSX e creare un bundle serve Node.js, perché il codice React va trasformato prima di arrivare al browser.

### React o Vue per un sito vetrina?

Spesso nessuno dei due. Un sito di poche pagine statiche si costruisce con HTML e un generatore; React o Vue diventano utili quando l'interfaccia ha stato e interazione.