Question 1

Cos'è un CSS Module in React?

Accepted Answer

I CSS Modules generano automaticamente nomi di classe unici aggiungendo un hash al nome della classe, il che previene i conflitti di stili tra componenti. Ogni file CSS Module ha il proprio scope locale, a differenza dei tradizionali fogli di stile globali. Questo approccio consente di scrivere stili modulari senza il rischio di sovrascritture accidentali in altri componenti.

Question 2

Qual è il principale vantaggio di styled-components?

Accepted Answer

Styled-components consente di scrivere CSS direttamente nei file JavaScript usando template literals, il che facilita la creazione di stili dinamici basati sulle props del componente. Questo approccio elimina la mappatura manuale tra classi CSS e componenti e garantisce che solo gli stili dei componenti montati vengano iniettati nella pagina. La colocalizzazione degli stili con la logica del componente migliora anche la manutenibilità del codice.

Question 3

Come importare un CSS Module in un componente React?

Accepted Answer

Per importare un CSS Module, usa la sintassi di importazione JavaScript standard con un nome file che termina in .module.css e assegna il risultato a una variabile che conterrà un oggetto con i nomi di classe trasformati. Per convenzione, questa variabile è spesso chiamata 'styles'. Le classi possono poi essere applicate tramite l'attributo className usando la notazione a oggetti. Questo approccio garantisce che i nomi di classe siano unici e con scope del componente.

Styling & CSS-in-JS

Cos'è un CSS Module in React?

Risposta

Qual è il principale vantaggio di styled-components?

Risposta

Come importare un CSS Module in un componente React?

Risposta

Qual è la caratteristica principale di Tailwind CSS?

Qual è lo svantaggio principale degli stili inline in React?

Altri argomenti di colloquio React / Next.js

Fondamenti di JavaScript

Fondamenti di React

React Hooks

Ciclo di vita dei componenti

React Router

Gestione dello state con Context

Form e Controlled Components

Recupero dati e API

React Query (TanStack Query)

Fondamentali di Next.js

TypeScript con React

Data Fetching in Next.js

Server Actions di Next.js

Routing e Navigazione in Next.js

API Routes di Next.js

Metadata & SEO in Next.js

Middleware e Auth in Next.js

Testing React

Zustand State Management

Ottimizzazione delle Performance React

Error Boundaries & Error Handling

Advanced React Patterns

Funzionalità avanzate di Next.js

Deploy e Produzione con Next.js

Architecture & Design Patterns

React Server Components

Internazionalizzazione di Next.js

React Sicurezza & Best Practices

Padroneggia React / Next.js per il tuo prossimo colloquio