# Fondamenti di React (React / Next.js)

> JSX, components, props, state, eventi, rendering condizionale, liste e keys

- 20 domande da colloquio
- Junior
- [Domande da colloquio: React / Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio.md)

## 1. Cos'è JSX in React?

**Risposta**

JSX è un'estensione della sintassi JavaScript che consente di scrivere markup simile all'HTML direttamente nel codice JavaScript. Viene trasformato in chiamate alla funzione React.createElement da Babel durante la compilazione. Usare JSX rende il codice più leggibile e permette il rilevamento degli errori in fase di compilazione tramite la tipizzazione, combinando la potenza di JavaScript con una sintassi familiare.

## 2. Quale sintassi è corretta per usare un'espressione JavaScript in JSX?

**Risposta**

Le parentesi graffe singole consentono di integrare qualsiasi espressione JavaScript valida in JSX, come variabili, funzioni o calcoli. Questa sintassi crea un confine chiaro tra il markup JSX e il codice JavaScript dinamico. Le doppie parentesi graffe sono usate per gli oggetti di stile inline, le parentesi tonde per raggruppare JSX multilinea e le parentesi quadre per gli array JavaScript.

## 3. Qual è la differenza principale tra className in JSX e class in HTML?

**Risposta**

JSX utilizza className invece di class perché class è una parola riservata in JavaScript per dichiarare classi ES6. Poiché JSX viene trasformato in JavaScript, usare class creerebbe un conflitto di sintassi. Allo stesso modo, for diventa htmlFor e gli eventi usano il camelCase. Questa convenzione consente a JSX di rimanere JavaScript valido pur offrendo una sintassi simile all'HTML.

## Altre 17 domande disponibili

- Come scrivere un commento nel codice JSX?
- Cos'è un functional component in React?

Registrati gratis: https://sharpskill.dev/it/login

## Altri argomenti di colloquio React / Next.js

- [Fondamenti di JavaScript](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/javascript-essentials.md): 25 domande, Junior
- [React Hooks](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-hooks.md): 22 domande, Junior
- [Ciclo di vita dei componenti](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/component-lifecycle.md): 18 domande, Junior
- [React Router](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-router.md): 20 domande, Junior
- [Gestione dello state con Context](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/state-management-context.md): 18 domande, Junior
- [Form e Controlled Components](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/forms-controlled-components.md): 20 domande, Mid-Level
- [Recupero dati e API](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/fetching-data-api.md): 20 domande, Mid-Level
- [React Query (TanStack Query)](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-query-tanstack.md): 20 domande, Mid-Level
- [Styling & CSS-in-JS](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/styling-css-in-js.md): 18 domande, Mid-Level
- [Fondamentali di Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-fundamentals.md): 25 domande, Mid-Level
- [TypeScript con React](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/typescript-react.md): 20 domande, Mid-Level
- [Data Fetching in Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-data-fetching.md): 24 domande, Mid-Level
- [Server Actions di Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-server-actions.md): 20 domande, Mid-Level
- [Routing e Navigazione in Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-routing-navigation.md): 22 domande, Mid-Level
- [API Routes di Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-api-routes.md): 20 domande, Mid-Level
- [Metadata & SEO in Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-metadata-seo.md): 18 domande, Mid-Level
- [Middleware e Auth in Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-middleware-auth.md): 22 domande, Mid-Level
- [Testing React](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-testing.md): 20 domande, Mid-Level
- [Zustand State Management](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/zustand-state-management.md): 18 domande, Mid-Level
- [Ottimizzazione delle Performance React](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-performance-optimization.md): 22 domande, Senior
- [Error Boundaries & Error Handling](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-error-boundaries.md): 18 domande, Senior
- [Advanced React Patterns](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/advanced-react-patterns.md): 20 domande, Senior
- [Funzionalità avanzate di Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-advanced-features.md): 24 domande, Senior
- [Deploy e Produzione con Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-deployment-production.md): 20 domande, Senior
- [Architecture & Design Patterns](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-architecture-patterns.md): 22 domande, Senior
- [React Server Components](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-server-components.md): 26 domande, Senior
- [Internazionalizzazione di Next.js](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/nextjs-internationalization.md): 20 domande, Senior
- [React Sicurezza & Best Practices](https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-security-best-practices.md): 22 domande, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/it/technologies/react-next/domande-colloquio/react-fundamentals