tgoop.com/zede_code/81
Last Update:
Сегодня расскажу про небольшой лайфхак. О котором просто несправедливо мало людей знают/применяют.
Часто полноценная реализация стилизации в браузере это неоптимальный выбор:
1) Вы не фронтендер и трогать CSS это последнее, что вам хочется делать(и я вас прекрасно пониманию), а накидать что-то на страничке надо
2) Вам нет смысла тратить на это много времени (напр в песочнице, при разработке PoC версий и тд)
3) Ставить полноценную библиотеку компонентов слишком запарно и не стоит того
4) да, даже накидывать подключать классы tailwind / bootstrap слишком муторно
А что-то +- адекватное все равно хочется (так как дефолтные стили браузера ну уж слишком никакие)
Какое решение? classless библиотеки стилей.
Происходит в них ровно то что написано: не пишите никаких классов для стилизации, только семантические теги. Да, просто пишите верстку, а библиотека сама делает все красивенько по мере возможности.
Вам не нужно учить такие библиотеки, макс слегка попривыкнуть к тому что в них реализовано. Вы просто подключаете 1 css-ник и накидываете фактически голый HTML. Конечно, полноценные сайты реализовать чисто на них будет сложновато, но как базовый стартер для чего-то минималистичного они просто прекрасно подойдут
Это экономит КУЧУ времени и позволяет не резать глаза, сосредоточившись на конкретной задаче которую вам надо реализовать.
Чтобы не мучаться с поиском таких решений есть вот такой репозиторий. Он активно пополняется различными вариантами и весьма подробен. Выбираете любую библиотеку на свой вкус и подключаете 1 строкой
Моим же фаворитом является PicoCSS (демка),
Если же вам привычен вид бутстрапа то обрабтите внимание на Holiday.css
PS. Если вы любите песочницы, то скорее всего вам будет полезно куда-то сохранить все равно минимальный пресет-стартер.
Можете сделать это в закладки / заметку / сниппет
Напр, для Vue playground вы можете подключить его так
В случае Vite и плейграундах основанных на нем быстрее всего закидывать в index.html
Будьте продуктивны и тратьте меньше времени на ненужные задачи!
BY zede code
Share with your friend now:
tgoop.com/zede_code/81