Dziś dzielę się z Wami moją prezentacją o flexboxie. Przygotowałam ją w celu przedstawienia podstawowych informacji: czym jest flexbox, jakie daje możliwości, czy warto z niego skorzystać. Przyznaję się bez bicia – nie jest ona najświeższej daty. Mimo wszystko uważam ją za uniwersalną pigułkę bazowej wiedzy – dlatego też puszczam ją w świat.
Usunęłam z prezentacji tylko stronę o wsparciu flexboxa w przeglądarkach. Świeże dane na ten temat sprawdzicie TUTAJ.
Przy okazji tego wpisu podaję też źródła wiedzy o flexboxie:
- flexbox.io
Lubisz uczyć się z filmików? To jest konkret dla Ciebie. Od jedynego w swoim rodzaju Wes Bos. - Using flexbox today
Trochę dywagacji na temat możliwości użycia flexboxa od Chris Wright. Bardzo szczegółowy artykuł wymagający myślenia. Jeśli jesteś zainteresowany tematem – gorąco polecam. Autor wyjaśnia też zawiłe zakamarki flexboxa na przykładach w kolejnym artykule TUTAJ. - Flexbox Patterns, Solved by flexbox
Popularne stronki, które pokazują różne przykłady praktycznego zastosowania flexboxa. W nosie z teorią – zawsze ciekawiej jest uczyć się na żywym organizmie - Flexbox 101
Kolejne praktyczne przykłady, tym razem od Speckyboy.com. - Flexbox by css-tricks.com, Flexbox by tympanus.net, Flexbox by scotch.io, Flexbox by cssreference.io
Jak zawsze niezastąpione css-tricks.com, tympanus.net, scotch.io oraz cssreference.io tym razem wyjaśniają podstawy możliwości flexboxa. Teoria + przykłady. - Guide to flexbox by kyusyf.com
Sucha teoria podana w przystępny, zwarty, miły dla oka sposób. - Zoe Gillenwater – prezentacje
Dziewczyna wie, co mówi. Pod tym linkiem znajdziecie kilka jej prezentacji o flexboxie. - Flexbugs
Uczmy się na błędach innych Stronka przedstawia listę błędów, problemów, z jakimi można spotkać się na różnych przeglądarkach, które dotyczą oczywiście flexboxa. Jeśli istnieje jakiś sposób na wybrnięcie z opałów – tam go znajdziecie. - Flexbox froggy, Flexbox defense, Game by flexbox.webflow.com,
Gry do nauki flexboxa, czyli uczmy się przez zabawę - MDN, Spec by W3C,
Trochę dokumentacji. - Flexbox cheatsheet
Lubię ten cheatsheet. Ja naprawdę lubię ten cheatsheet. - Smashing Magazine, Sitepoint
Trylion solidnych artykułów na temat flexboxa. Dla tych, którzy nudzą się w domu - Flexy boxes
Popularny playground.
Wydaje mi się, że powinnam w jakiś mądry sposób podsumować flexboxa. Jak go używać? To można łatwo wygooglać. Czy go używać? To już jest temat do długiej dyskusji.
Powiedziałabym TAK, bo 1. to przyszłość CSS, 2. trzeba iść do przodu z technologią, nie stać w miejscu 3. flexbox to lekarstwo na wiele udręk w CSS 4. flexbox w teorii przyspiesza pracę 5. flexbox w teorii ułatwia pracę.
Powiedziałabym NIE, bo 1. wsparcie flexboxa w starszych przeglądarkach jest słabe 2. na drodze stylowania znajduje się tryliard min, o których najlepiej po prostu wiedzieć 3. jeśli wpadasz na minę, na którą jeszcze nikt inny w internetach nie wpadł – masz problem 4. flexbox różnie działa na różnych przeglądarkach 5. wszelakie próby obejścia punktu 4 wyglądają najczęściej brzydko.
Czy decydować się na flexboxa? Jeśli robisz projekt dla siebie testując jakąś technologię, który po prostu ma wisieć na githubie i czekać na rekruterów – IMHO tak. Jeśli robisz projekt dla klienta, który wymaga wsparcia tylko na najnowszych przeglądarkach – IMHO tak. W każdym innym przypadku – IMHO nie.
A jakie jest Wasze zdanie na temat flexboxa? Używać, nie używać? Fajny to kolega, czy raczej taki, co robi więcej bałaganu, niż pożytku?