Question 1

Qual è il ruolo principale del file middleware.ts in un'applicazione Next.js con next-intl?

Accepted Answer

Il middleware next-intl rileva automaticamente il locale dell'utente (tramite intestazione Accept-Language, cookie o URL) e reindirizza all'URL appropriato con il prefisso locale. Viene eseguito prima di ogni richiesta e gestisce la negoziazione del locale senza codice aggiuntivo nei componenti. È il punto di ingresso obbligatorio per abilitare il routing i18n in Next.js App Router.

Question 2

In next-intl, dove dovrebbero essere posizionati i file di traduzione per una struttura di progetto ottimale?

Accepted Answer

I file di traduzione vengono posizionati in messages/[locale].json nella radice del progetto (es: messages/fr.json, messages/en.json). Questa convenzione facilita il rilevamento delle traduzioni e consente a next-intl di caricarle automaticamente tramite la configurazione i18n. Alcuni progetti usano anche messages/[locale]/ con file separati per namespace per una migliore organizzazione.

Question 3

Qual è la differenza principale tra useTranslations e getTranslations in next-intl?

Accepted Answer

useTranslations è un hook React sincrono per i Client Components, mentre getTranslations è una funzione async per i Server Components. getTranslations consente di recuperare le traduzioni lato server senza inviare JavaScript al client, migliorando le prestazioni. useTranslations è necessario per i componenti interattivi che richiedono la direttiva use client.

Internazionalizzazione di Next.js

Qual è il ruolo principale del file middleware.ts in un'applicazione Next.js con next-intl?

Risposta

In next-intl, dove dovrebbero essere posizionati i file di traduzione per una struttura di progetto ottimale?

Risposta

Qual è la differenza principale tra useTranslations e getTranslations in next-intl?

Risposta

Come configurare i locale supportati in next-intl?

Qual è la sintassi per usare variabili in una traduzione next-intl?

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)

Styling & CSS-in-JS

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

React Sicurezza & Best Practices

Padroneggia React / Next.js per il tuo prossimo colloquio