Belajar Layout Grid CSS (Cara Menyenangkan) dengan Grid Garden

Kebanyakan pengembang web tahu permainan Flexbox Froggy itu mengajar anda asas-asas flexbox dari awal. Permainan percuma ini menjadi virus dan masih sangat berharga untuk mengajar orang bagaimana untuk kod dengan flexbox.

Nah, pemaju yang sama yang membuat permainan itu mempunyai permainan baru dipanggil Taman Grid.

Permainan ini berfungsi dengan cara yang sama tetapi mengajar anda bagaimana untuk kod CSS grid. Ia adalah ciri yang agak baru tetapi ia menangkap dengan cepat dan Grid Garden adalah dengan mudah cara terbaik untuk belajar.

Segala-galanya di Grid Garden mengikuti a gaya pengajaran yang sama sebagai Flexbox Froggy. Ia telah dicipta oleh pemaju yang sama, Thomas Park, sehingga anda dapat mengharapkan tingkat kesulitan dan kegunaan yang sama.

Secara lalai, anda bermula pada level one dengan a jumlah 28 tahap dari awal hingga akhir. Anda boleh sentiasa langkau tahap jika anda fikir ada yang terlalu keras, tetapi saya mendapati ia sentiasa baik untuk bekerja melalui mereka semua sebagai penyegar.

Jika anda tidak tahu bagaimana sifat-sifat yang berkaitan dengan grid anda akan mendapati diri anda Menggaling banyak perkataan. Susun atur grid CSS ialah modul yang sama sekali baru dengan sintaks dan ciri tersendiri.

Saya sangat mengesyorkan toying sekitar dengan Grid Garden apabila anda mendapat peluang. Ia boleh dikatakan a Taman permainan pemaju CSS untuk belajar dan mengkaji semua sifat susun atur grid pelbagai.

Saya tidak boleh mengatakan permainan ini akan menjadikan anda pakar dalam grid CSS. Hanya membina projek dan berlatih banyak boleh membawa anda ke tahap pakar. Tetapi, Grid Garden adalah cara yang menyeronokkan untuk bermula tanpa semua tekanan biasa yang masuk ke dalam pembelajaran sesuatu yang baru.

Keseluruhan projek ini adalah percuma dan sumber terbuka pada GitHub jika anda ingin memuat turun secara tempatan untuk belajar atau mengembangkan. Anda juga boleh berkongsi pendapat anda dengan pencipta di Twitter @thomashpark.