Impara il layout griglia CSS (The Fun Way) con Grid Garden

La maggior parte degli sviluppatori web conosce il gioco Flexbox Froggy che ti insegna le basi della flexbox da zero. Questo gioco gratuito è diventato virale ed è ancora incredibilmente utile per insegnare alle persone come codificare con la flexbox.

Bene, lo stesso sviluppatore che ha realizzato quel gioco ha un nuovo gioco chiamato Grid Garden .

Questo gioco funziona in modo simile ma ti insegna come codificare le griglie CSS . È una funzionalità relativamente nuova, ma sta prendendo piede velocemente e Grid Garden è facilmente il modo migliore per imparare.

Tutto in Grid Garden segue uno stile di insegnamento simile a quello di Flexbox Froggy. È stato creato dallo stesso sviluppatore, Thomas Park, quindi puoi aspettarti un livello simile di difficoltà e usabilità.

Per impostazione predefinita, si inizia dal livello uno con un totale di 28 livelli dall'inizio alla fine. Puoi sempre saltare i livelli se ritieni che siano troppo difficili, ma trovo che sia sempre opportuno lavorarci sopra proprio come un ripasso.

Se non hai idea di come funzionano le proprietà relative alla griglia, ti ritroverai a cercare su Google un sacco di parole. Il layout della griglia CSS è un modulo totalmente nuovo con una propria sintassi e funzionalità.

Consiglio vivamente di andare in giro con Grid Garden ogni volta che ne hai la possibilità. È praticamente un campo da gioco per sviluppatori CSS per l'apprendimento e lo studio di tutte le varie proprietà del layout della griglia.

Non posso dire che questo gioco ti renderà un esperto nelle griglie CSS. Solo costruire progetti e praticare molto può portarti ad un livello esperto. Ma, Grid Garden è un modo divertente per iniziare senza il solito stress che va ad imparare qualcosa di nuovo.

L'intero progetto è completamente gratuito e open-source su GitHub se vuoi scaricarlo localmente per studiare o espandere. Puoi anche condividere i tuoi pensieri con il creatore su Twitter @ thomashpark.