Tailwind CSS: კომუნალური პირველი CSS ჩარჩო და API სწრაფი, საპასუხო დიზაინისთვის

Tailwind CSS ჩარჩო

მიუხედავად იმისა, რომ მე ღრმად ვარ ტექნიკაში ყოველდღიურად, მე არ მაქვს იმდენი დრო, რამდენიც მინდა გავუზიარო კომპლექსური ინტეგრაციები და ავტომატიზაცია, რომელსაც ჩემი კომპანია ახორციელებს მომხმარებლებისთვის. ასევე, მე არ მაქვს ბევრი აღმოჩენის დრო. ტექნოლოგიების უმეტესობა, რომლებზეც მე ვწერ, არის კომპანიები, რომლებიც ეძებენ Martech Zone მათი დაფარვა, მაგრამ დროდადრო - განსაკუთრებით Twitter– ის საშუალებით - ვხედავ რაღაც ხმაურს ახალი ტექნოლოგიის გარშემო, რომლის გაზიარებაც მჭირდება.

თუ მუშაობთ ვებ დიზაინში, მობილური აპლიკაციების შემუშავებაში, ან უბრალოდ შექმნით შინაარსის მართვის სისტემას, თქვენ ალბათ გაგიჭირდათ კონკურენტული სტილის იმედგაცრუება მრავალ სტილში. თუნდაც თითოეულ ბრაუზერში შემუშავებული საოცარი განვითარების ინსტრუმენტებით, CSS– ის თვალყურის დევნება და გაწმენდა შეიძლება მოითხოვდეს ძალიან დიდ დროს და ენერგიას.

CSS ჩარჩოები

ბოლო წლებში დიზაინერებმა შეასრულეს საკმაოდ გასაოცარი სამუშაოები, გამოუშვეს სტილის კოლექციები, რომლებიც მომზადებულია და გამოსაყენებლად მზადაა. ეს CSS სტილის ფურცლები უფრო ცნობილია, როგორც CSS ჩარჩოები, რომლებიც ცდილობენ ყველა განსხვავებული სტილი და რეაგირება მოახდინონ ისე, რომ დეველოპერებს შეეძლოთ უბრალოდ მიუთითონ ჩარჩოზე და არა CSS ფაილის ნულიდან. ზოგიერთი პოპულარული ჩარჩოა:

  • ჩატვირთვის - ჩარჩო, რომელიც განვითარდა ათწლეულის განმავლობაში, პირველად შემოიღო Twitter– მა. ის გთავაზობთ უამრავ მახასიათებელს. მას აქვს უარყოფითი მხარეები, მოითხოვს SASS- ს, ძნელია გადატვირთვა, დამოკიდებულია JQquery- ზე და საკმაოდ მძიმეა ჩატვირთვა.
  • იპოვნე -სუფთა ჩარჩო, რომელიც არის დეველოპერებისთვის და არ არის დამოკიდებული JavaScript– ზე.
  • ფონდი - უფრო ზოგადი და გამოსაყენებელი CSS ჩარჩო, რომელსაც აქვს ტონა კომპონენტები, რომლებიც ადვილად მორგებულია. გარდა ამისა, არსებობს ელ.ფოსტის ფონდი და მოძრაობის UI ანიმაციებისთვის.
  • UI ნაკრები -HTML, JavaScript და CSS კომბინაცია, რომ მიიღოთ თქვენი ფრონტ-ენდი სწრაფად და მარტივად.

Tailwind CSS ჩარჩო

მიუხედავად იმისა, რომ სხვა ჩარჩოები მშვენივრად ასრულებენ პოპულარულ ინტერფეისის ელემენტებს, Tailwind იყენებს მეთოდოლოგიას, რომელიც ცნობილია როგორც ატომური CSSრა მოკლედ რომ ვთქვათ, Tailwind– მა ეშმაკურად მოაწყო კლასის სახელები ბუნებრივი ენის გამოყენებით და გააკეთა ის, რასაც ისინი ამბობენ. ასე რომ, მიუხედავად იმისა, რომ Tailwind– ს არ აქვს კომპონენტების ბიბლიოთეკა, CSS კლასის სახელების მითითებით მხოლოდ ძლიერი, საპასუხო ინტერფეისის ადვილად შექმნის შესაძლებლობა არის ელეგანტური, სწრაფი და შეუდარებელი.

აქ არის მართლაც შესანიშნავი მაგალითები:

CSS ბადეები

css სვეტი დაწყებული ბადეების სვეტებს

CSS გრადიენტები

css გრადიენტები

CSS მუქი რეჟიმის მხარდაჭერისთვის

css ბნელი რეჟიმი

Tailwind– ს ასევე აქვს ფანტასტიკა გაფართოება შესაძლებელია VS კოდისთვის, ასე რომ თქვენ შეგიძლიათ მარტივად ამოიცნოთ და ჩაწეროთ კლასები Microsoft– ის კოდის რედაქტორიდან.

კიდევ უფრო გენიალურია, Tailwind ავტომატურად შლის ყველა გამოუყენებელ CSS წარმოების მშენებლობისას, რაც იმას ნიშნავს, რომ თქვენი საბოლოო CSS პაკეტი არის ყველაზე პატარა, რაც შეიძლება იყოს. სინამდვილეში, Tailwind– ის პროექტების უმეტესობა კლიენტს უგზავნის 10 კბ – ზე ნაკლებ CSS– ს.

რას ფიქრობთ?

ეს საიტი იყენებს Akismet- ს, რათა შეამციროს სპამი. შეისწავლეთ თქვენი კომენტარის მონაცემები დამუშავებული.