Tailwind CSS: Creat CSS Utility-First agus API um Dhearadh Mear, Sofhreagrach

Creat CSS Tailwind

Cé go mbím domhain i dteicneolaíocht go laethúil, ní fhaighim an oiread ama agus ba mhaith liom na comhtháthaithe casta agus uathoibriú a chuireann mo chuideachta i bhfeidhm do chustaiméirí a roinnt. Chomh maith leis sin, níl a lán ama fionnachtana agam. Is cuideachtaí a lorgaíonn an chuid is mó den teicneolaíocht a scríobhaim faoi Martech Zone ag clúdach iad, ach uair amháin ar feadh tamaill - go háirithe trí Twitter - feicim roinnt buíochais timpeall ar theicneolaíocht nua a chaithfidh mé a roinnt.

Má tá tú ag obair i ndearadh gréasáin, i bhforbairt aipeanna soghluaiste, nó fiú díreach córas bainistíochta inneachair a chur ar bun, is dócha go ndeachaigh tú i ngleic leis an frustrachas a bhaineann le stíleanna iomaíocha ar fud iliomad stílbhileog. Fiú amháin leis na huirlisí forbartha iontacha a tógadh laistigh de gach brabhsálaí, d’fhéadfadh go mbeadh an iomarca ama agus fuinnimh ag teastáil chun CSS a rianú agus a ghlanadh.

Creataí CSS

Le blianta beaga anuas, tá obair iontach déanta ag dearthóirí ag bailiú bailiúcháin stíleanna atá réamhullmhaithe agus réidh le húsáid. Tugtar CSS Frameworks ar na Bileoga Stíle CSS seo, agus iad ag iarraidh freastal ar na stíleanna agus na cumais freagracha éagsúla ionas gur féidir le forbróirí tagairt a dhéanamh do chreat seachas comhad CSS a thógáil ón tús. Is iad seo a leanas roinnt creataí móréilimh:

  • Bootstrap - creat atá tagtha chun cinn le deich mbliana, a thug Twitter isteach den chéad uair. Cuireann sé gnéithe gan áireamh. Tá míbhuntáistí ag baint leis, a éilíonn go bhfuil SASS deacair a ró-sheasamh, ag brath ar JQquery, agus tá sé an-deacair a luchtú.
  • Bulma - creat glan atá cairdiúil don fhorbróir agus nach bhfuil ag brath ar JavaScript.
  • Fondúireacht - creat CSS níos cineálach agus inúsáidte ina bhfuil tonna comhpháirteanna atá inúsáidte go héasca. Ina theannta sin, tá Fondúireacht Ríomhphoist agus Iontráil Tairisceana le haghaidh beochan.
  • Kit Chomhéadain - meascán de HTML, JavaScript, agus CSS chun do cheann tosaigh a fhorbairt go tapa agus go héasca.

Creat CSS Tailwind

Cé go ndéanann creataí eile sár-obair chun freastal ar eilimintí comhéadain úsáideora a bhfuil an-tóir orthu, úsáideann Tailwind modheolaíocht ar a dtugtar CSS Adamhach. I mbeagán focal, d’eagraigh Tailwind ainmneacha na ranganna go seiftiúil ag úsáid teanga nádúrtha chun na rudaí a deir siad a dhéanann siad a dhéanamh. Mar sin, cé nach bhfuil leabharlann comhpháirteanna ag Tailwind, tá an cumas comhéadan cumhachtach sofhreagrach a thógáil ach trí thagairt a dhéanamh d’ainmneacha ranga CSS galánta, tapa agus dosháraithe.

Seo roinnt samplaí iontacha:

Greillí CSS

colúin greillí tosaigh colún css

Grádáin CSS

grádáin css

CSS le haghaidh Tacaíochta Mód Dorcha

modh dorcha css

Tá iontach ag Tailwind freisin síneadh ar fáil do VS Code ionas gur féidir leat ranganna ó eagarthóir cód Microsoft a aithint agus a chur isteach go héasca.

Níos seiftiúla fós, déanann Tailwind gach CSS nach bhfuil in úsáid a bhaint go huathoibríoch agus é ag tógáil le haghaidh táirgeachta, rud a chiallaíonn gurb é do bheartán CSS deiridh an ceann is lú a d’fhéadfadh a bheith ann. Déanta na fírinne, seolann an chuid is mó de thionscadail Tailwind níos lú ná 10kB de CSS chuig an gcliant.

Cad é do bharúil?

Úsáideann an suíomh seo Akismet chun spam a laghdú. Foghlaim conas a dhéantar próiseáil ar do chuid tráchta.