Tailwind CSS: Utility-First CSS Framework i API za brzi, prilagodljivi dizajn

Tailwind CSS Framework

Iako sam svakodnevno duboko u tehnologiji, nemam toliko vremena koliko bih želio podijeliti složenu integraciju i automatizaciju koju moja kompanija implementira za kupce. Takođe, nemam puno vremena za otkrivanje. Većina tehnologije o kojoj pišem su kompanije koje traže Martech Zone pokrivajući ih, ali s vremena na vrijeme - posebno putem Twittera - vidim neke buke oko nove tehnologije koju moram podijeliti.

Ako radite na web dizajnu, razvoju mobilnih aplikacija ili čak samo postavljate sistem za upravljanje sadržajem, vjerojatno ste se borili s frustracijama konkurentskih stilova u više stilova. Čak i sa nevjerojatnim razvojnim alatima ugrađenim u svaki preglednik, praćenje i čišćenje CSS -a može zahtijevati previše vremena i energije.

CSS okviri

Posljednjih godina dizajneri su učinili prilično nevjerojatan posao objavljujući kolekcije stilova koji su pripremljeni i spremni za upotrebu. Ove CSS tablice stilova poznatije su kao CSS okviri, pokušavajući prilagoditi sve različite stilove i mogućnosti odaziva, tako da programeri mogu samo referencirati okvir, a ne graditi CSS datoteku od nule. Neki popularni okviri su:

  • Bootstrap - okvir koji je evoluirao više od jedne decenije, a prvi ga je predstavio Twitter. Nudi bezbroj funkcija. Ima nedostataka, zahtijeva SASS, teško ih je prebrisati, ovisi o JQqueryju, i prilično se teško učitava.
  • naći -čist okvir prilagođen programerima i ne ovisi o JavaScript-u.
  • temelj - općenitiji i upotrebljiviji CSS okvir s mnoštvom komponenti koje se lako mogu prilagoditi. Osim toga, postoji Zaklada za e -poštu i Motion UI za animacije.
  • UI Kit -kombinacija HTML-a, JavaScript-a i CSS-a za brzi i lak razvoj vašeg front-end-a.

Tailwind CSS Framework

Dok drugi okviri odlično rade s prilagođavanjem popularnih elemenata korisničkog sučelja, Tailwind koristi metodologiju poznatu kao Atomski CSS. Ukratko, Tailwind je genijalno organizirao nazive razreda koristeći prirodni jezik kako bi učinili ono što kažu da rade. Dakle, iako Tailwind nema biblioteku komponenti, mogućnost da se lako izgradi moćno, odzivno sučelje samo pozivanjem na nazive klasa CSS je elegantna, brza i neuporediva.

Evo nekoliko zaista sjajnih primjera:

CSS Grids

css stupci početne rešetke kolona

CSS gradijenti

css gradijenti

CSS za podršku tamnom načinu rada

css tamni način rada

Tailwind takođe ima fantastičnu veličinu dostupno proširenje za VS Code tako da možete lako identificirati i umetnuti klase iz Microsoftovog uređivača koda.

Još genijalnije, Tailwind automatski uklanja sav neiskorišteni CSS prilikom izrade za proizvodnju, što znači da je vaš konačni CSS paket najmanji koji bi mogao biti. Zapravo, većina projekata Tailwind -a isporučuje klijentu manje od 10 KB CSS -a.

Šta ti misliš?

Ova stranica koristi Akismet kako bi smanjila neželjenu poštu. Saznajte kako se podaci vašeg komentara obrađuju.