Che cos'è?

Un minigioco creato in React! Scegli il tuo “livello di difficoltà”, ossia quante scatole e quanti colori (puoi combinare), l’applicazione ti genera una griglia con le scatole che hai deciso, tutte colorate a random
 pescando da una lista di colori generati del numero che hai deciso.


Inizia subito a cliccare su ogni scatola e cambierà colore pescando dai colori generati!

Quando sono 
tutti uguali...hai vinto! Ti dice il tempo che ci hai messo. Ora sta a te battere il tup tempo record! (O scegliere un’altro livello di difficoltà)

Di quali tecnologie fa uso?

L’applicazione è stata creata in React utilizzando Vite come bundle. Utilizza css vanilla e struttura mobile-first.


Fa uso di session storage per salvare i tempi nella sessione corrente, così da mostrarli ad ogni giocata.


La gerarchia dei componenti segue le best practice di React: lo stato vive nel componente più alto necessario
ma non di più.

Ogni “scatola” è una propria componente che viene rendered dalla griglia.

Le funzioni vengono passate come props e fa uso di context per evitare il “prop-drilling”
.

I media query partono tutti dallo schermo mobile, riducendo di molto il codice css ed assicurandone la facilità d’uso per utenti mobile.

Flexbox e unità come rem ed em per le misure per

rendere tutto più flessibile e permettere all’utente di ingrandire le misure dei font.

Le sfide:

Creare una funzione che viene evocata ad ogni “click” per iterare su tutta la griglia e fare il confronto del colore per verificare se sono tutti uguali. 


Creare un “cronometro”, ossia una variabile che parte da “0” appena parte l’applicazione, aggiunge 1 ogni secondo e si ferma quando succede il “game over”. In React, un “setInterval” necessita di una ref “useRef” nel quale viene salvato l’interval stesso al fine di fermarlo, simile all’uso del proprio id in vanilla js.


Inoltre, cosa succede quando supera 60? O 1 minuto? Una funzione “utility” che accetta un numero e fa uso di divisione e Javascript modulo per tirarne fuori minuti e secondi. (C’è anche una condizionale per se è “1 minuto” o “più di un minuti”