TailwindCSS i piękno brzydkiego kodu
HTML-код
- Опубликовано: 18 сен 2024
- W dzisiejszym odcinku poruszam kontrowersyjny temat wykorzystania Tailwind CSS, frameworka, który od momentu swojego powstania dzieli środowisko developerów. Dowiesz się, dlaczego mimo pozornie nieestetycznej składni, Tailwind CSS oferuje przejrzystość i elastyczność, których żaden inny framework Ci nie da. Odkryj historię powstania Tailwind CSS, poznaj jego zalety i dowiedz się, dlaczego warto mu dać szansę.
Ważne ogłoszenie - już 2 października 2023 roku startuje sprint technologiczny poświęcony praktycznej nauce Tailwind CSS! Więcej informacji poniżej.
Link do sprintu:
ahoy.eduweb.pl...
FB: / programistafrontend-10...
🎯: www.programist...
IG: / programistafrontend
📧: daniel@programistafrontend.pl
Kiedy pierwszy raz zobaczyłem Tailwind (wcześniej korzystałem z Styled-Components i SCSS), pomyślałem: "No nie. Ale to brzydkie." Ucząc się Next.js z Tailwind, im więcej go używałem, tym bardziej zacząłem doceniać jego zalety, więc teraz korzystam z Tailwinda, gdzie tylko mogę. Duży plus to również wtyczka Tailwind CSS IntelliSense, która znacznie ułatwia pracę, zwłaszcza początki.
W sumie, stosując podejście typu atomic design, można sprytnie uniknąć tworzenia dużych bloków klas. Być może w przyszłości twórcy sami opracują narzędzie do "zawijania" klas, lub może takie rozwiązanie zostanie wbudowane prosto w edytor.
Jedno jest pewne, Tailwind ma znacznie więcej zalet niż wad.
Zgadzam się. Trzeba się przyzwyczaić jak do wszystkiego. :)
Super, szybko i na temat. Korzystam z Tailwinda dosyć długo i jakoś odzwyczaiłem się od pisania CSSa.
Dzięki:)
Cieszę się, że wróciłeś
warto wspomnieć bardziej szczegółowo w serii też o optymalizacji, która jest największym atutem tailwinda - bo do finalnego bundle trafiają tylko faktycznie wykorzystywane klasy, a nie wszysktie możliwe, ale temat jest bardzo ciekawy 😁
Zgadza sie teraz z silnikiem lightning css jeszcze lepiej bo opieraja go na ruscie
poza prędkością, kompletnie nie rozumiem fenomenu Taillwind. Coś okropnego wizualnie, kompletnie nieczytelne.
Próbowałeś używać w dużych projektach? Co preferujesz zatem jak nie TailwindCSS?
@@danielnoworyta do tej pory korzystałem głównie ze styled components, których IMO największą przewagą jes to, że od razu wiem czym dany komponent jest np. zmiast mam np. etc, więc patrząc w kod, od razu znam 'odpowiedzialność' komponentu. O wiele czytelniej zapisuje się warunkowe style, przekazuje propy i style można wydzielić do osobnego pliku więc komponent jest turbo czytelny.
czyli wydajność jest mniej ważna ponieważ jest „brzydki”? 😅
swoją drogą brzydota to już też subiektywna opinia i kwestia obycia.
myślę że ta „brzydota” jest akceptowalnym tradeoffem przy takiej ilości zalet jakie dostajemy
@@ku3ik nie napisałem nic takiego, że jest mniej ważna. Ale jeśli już o wydajności mowa nie zauważam zdecydowanych różnic. A czy czytelność kodu nie jest czasem jednym z priorytetów podczas jego pisania?
@@meloniasz1 twoja wypowiedź miała taki wydźwięk 😁
Z czytelnością dalej wracam do tematu wyżej, to już jest subiektywna opinia, a optymalizacja na szczęście nie i tym się różni ten argument 😁
pisząc z głowa i dobrze wydzielając komponenty można zredukować tzw „tasiemce” ✌️
Po prostu ludzie będą używali czegokolwiek co jest popularne i hajpowane. Obecnie tailwind jest popularny więc głosy przeciwników są raczej ignorowane, ale z czasam może się to zmienić, podobnie jak było ze styled components, które pewnego czasu były uznawane jako coś co rozwiązuje wszystkie problemy ze stylowaniem w reakcie. Problem ze specifity już nie istnieje od dawna, mamy narzędzia typu CSS modules czy Shadow DOM.
Zresztą tailwind to też nic nowego, już wiele innych zbiorów utility istniało wcześniej, tylko może nie w tej skali (prawie każde property ma swoją dedykowaną klasę)
Ale styled components do dzisiaj maja swoje miejsce w projektach komercyjnych. Myślę ze kwestia tego na co nacisk kladzie zespół.
Jak dla mnie beznadziejne narzędzie. Setki klas, bardzo krótkie nazwy. Na monitorze obróconym do pionu w pivot jest masakra z czytelnością. Każda zmiana layoutu w późniejszym czasie to przeszukiwanie jakiś klas. SCSS jest nie do przebicia.
Kwestia przyzwyczajenia. Ja dużo wcześniej scss używałem domieszki itp. Ale jakoś przekonałem sie do tw css i poki co nie mam potrzeby próbować innych rozwiązań.
Prosto i klarownie wyjaśnione!
Dzieki za komentarz:)
Bootstrap na zawsze w moim sercu
Każdy ma swoje preferencje mi się bootstrap podobal do momentu kiedy wszystko zaczęło tak samo wyglądać:) szukałem innego rozwiązania
dla mnie tailwind to #1, zwłaszcza w produktywności. Ja nie rozumiem jak komuś to może sprawiać problem, (bo kod nie estatyczny xd). Aktualnie mam styczność z tailwindem i styled-components i z styled-components implementacje tego samego zajmuje duuuuużo więcej czasu i może mamy czystrzy kod (w jsx/html'u) jednak nie sprawia to, że jest to czytelniejsze i łatwiejsze do utrzymania
Też tak sądzę:)
To jest Twoim zdaniem czytelne? (z oficjalnej strony tailwind):
Get started
a to tylko jeden głupi href w komponencie.
ogólnie ja nie kłócę się, że tego nie da się używać i że Taillwind to zło bo nie przez przypadek jest na niego 'boom', ale nie dam sobie wmówić że to jest czytelny zapis
@@meloniasz1 wszystko zależy jak na to patrzysz zobacz Get Started
Czy jest to czytelniejsze niż te wyżej z TW jak najbardziej, ale zobacz że musisz tracić koncentrację na tym kawałku kodu i przeskakujesz do osobnego pliku lub w inne miejsce obecnego pliku.
Patrzac na zapis twój osoba z minimalnym obyciem z TWCSS wie jak będzie wyglądał ten link na stronie. W przypadku mojego zapisu nie masz na to szans bez wcześniejszego zobaczenia co znajduje sie pod daną nazwą klasy css.