Frontend
Compito 1 Abbiamo un array di 10.000 oggetti (ad esempio, "Dipendenti" o "Prodotti"). Dobbiamo implementare un componente per selezionare un elemento che non "bloccherà" il browser e sarà comodo per l'utente. Cosa bisogna implementare (Requisiti): 1. Tipizzazione dei dati: Creare un'interfaccia Item con i campi id: string, label: string e category: string. 2. Ricerca (Input): Durante l'inserimento di testo, la lista deve essere filtrata. 3. Lavoro con DOM e eventi (Navigazione da tastiera): * L'utente deve poter muoversi nella lista con le frecce Su e Giù. 4. Premendo Invio, l'elemento selezionato viene "confermato". 5. Punto importante: l'elemento selezionato con le frecce deve essere sempre visibile (scorrere il contenitore programmaticamente se il cursore esce dai limiti). 6. Ottimizzazione (Performance): * Poiché ci sono molti dati (10k), discutere o implementare una semplice "renderizzazione pigra" (renderizzare solo i primi 20-30 elementi o usare IntersectionObserver). Output del componente
Parlami un po' di te, della tua esperienza lavorativa.
Abbiamo un grande progetto in un monorepo con un flusso di rilascio unificato. Abbiamo deciso di separare il frontend e il pannello di amministrazione in repository separati, ma il backend è rimasto monolitico. Si presenta il problema della disallineamento delle versioni tra backend e client. Come vedresti la soluzione a questo problema per essere il più protetti possibile da guasti in produzione?
Come memorizzare correttamente la configurazione runtime in Nuxt 3? In cosa si differenzia la configurazione pubblica da quella privata?
Cosa significa la parola chiave satisfies in TypeScript e a cosa serve?
Cos'è il tipo di utilità Awaited in TypeScript?
Cos'è la modalità strict in JavaScript? Conosci la differenza tra script e module?
Come si svolge il periodo di adattamento per un nuovo sviluppatore? Quali compiti devono essere risolti per superare con successo il periodo di prova?
Domanda bonus: dato un codice con la funzione MySync, che accetta un parametro start (di default 0), lo stampa in console, utilizza Promise e si richiama ricorsivamente all'interno di resolve, oltre a avere un setTimeout separato. Devi spiegare cosa succederà qui e cosa verrà visualizzato in console.
Come ottenere la lunghezza di un oggetto normale tramite la proprietà length? Come aggiungere il metodo length a tutti gli oggetti tramite il prototipo?
Qual è la differenza tra gli attributi async e defer nel tag script?
La verifica dell'unicità deve essere eseguita senza considerare le maiuscole/minuscole. Nelle props del componente è disponibile l'intera tabella dei dati e l'id della riga che l'utente sta modificando è noto. Come modificare il validatore tenendo conto di questo?
Qual è la differenza tra memorizzare i dati in un array e in un oggetto dal punto di vista della memoria? Quale metodo di memorizzazione della tabella (array bidimensionale o oggetto bidimensionale) sarà più leggero in termini di memoria?
Hai configurato tu stesso Docker, giusto? Capisci questo?
Hai menzionato un UI-kit. Qual componente è stato il più difficile o interessante da realizzare, e quale ha rappresentato la sfida maggiore?
Come si può impostare il contesto di una funzione? Qual è la differenza tra call, apply e bind?
Parli della sua esperienza con CI/CD, Docker — cosa è riuscito a configurare e come funzionava?
Parlaci della tua esperienza con le librerie di gestione dello stato (Redux, RTK, Zustand).
Raccontami una funzione davvero fantastica che hai fatto e di cui sei orgoglioso. Potrebbe essere qualcosa di nuovo per te, che hai capito, o semplicemente una funzionalità abbastanza complessa.
Caso: immagina di ricevere un prodotto con il compito di creare e lanciare un nuovo prodotto in 2 mesi, ci sono molti diversi team trasversali che possono essere coinvolti, ma ancora non è chiaro nulla. Racconta l'ordine delle tue azioni, il tuo modo di pensare — dove correrai prima?