За последние несколько лет Tailwind CSS изменил правила игры для многих разработчиков, предложив подход, ориентированный на утилиты, который помогает быстро преобразовать дизайн в код. Дело не в том, что Tailwind сам по себе является антипаттерном; напротив, это очень полезный инструмент. Это позволяет разработчикам работать быстрее и создавать элементы с большей степенью детализации. Более того, это помогает сократить разрыв между структурой и стилем, облегчая просмотр дизайна непосредственно в разметке.
Однако, как и в случае с любым мощным инструментом, Tailwind CSS можно использовать неправильно, что приводит к ухудшению поддерживаемости кода и другим осложнениям. Вот некоторые антишаблоны, которых следует опасаться при работе с Tailwind CSS.
https://spin.atomicobject.com/tailwind-css-anti-patterns
Однако, как и в случае с любым мощным инструментом, Tailwind CSS можно использовать неправильно, что приводит к ухудшению поддерживаемости кода и другим осложнениям. Вот некоторые антишаблоны, которых следует опасаться при работе с Tailwind CSS.
https://spin.atomicobject.com/tailwind-css-anti-patterns
Atomic Spin
5 Tailwind CSS Anti-Patterns to Avoid
Like any powerful tool, it’s possible to misuse Tailwind CSS. Beware these anti-patterns when working with Tailwind CSS.
Изучение Атомарного CSS: Масштабируемая Архитектура Для Современной Веб-Разработки
https://blog.openreplay.com/exploring-atomic-css
https://blog.openreplay.com/exploring-atomic-css
Openreplay
Exploring Atomic CSS: A Scalable Architecture for Modern Web Development
A different way of working with CSS
css-shape.com: Лучшая коллекция фигур, созданных только на CSS ⚡️
Вы ищете фигуру CSS? Не смотрите дальше! Я собрал все из них в одном месте.
https://dev.to/afif/css-shapecom-the-ultimate-collection-of-css-only-shapes-52p5
5 скрытых свойств CSS, о существовании которых вы не знали
https://dev.to/vitalipri/5-hidden-css-properties-you-didnt-know-existed-12h8
Вы ищете фигуру CSS? Не смотрите дальше! Я собрал все из них в одном месте.
https://dev.to/afif/css-shapecom-the-ultimate-collection-of-css-only-shapes-52p5
5 скрытых свойств CSS, о существовании которых вы не знали
https://dev.to/vitalipri/5-hidden-css-properties-you-didnt-know-existed-12h8
DEV Community
css-shape.com: The Ultimate Collection of CSS-only Shapes ⚡️
Are you searching for a CSS Shape? Look no further! I have collected all1 of them into one...
Я создал эти 5 типов анимации загрузки в HTML и CSS, какой из них вы предпочитаете?
https://dev.to/peboy/i-built-these-5-types-of-loading-animation-in-html-and-css-which-do-you-prefer-2f3f
https://dev.to/peboy/i-built-these-5-types-of-loading-animation-in-html-and-css-which-do-you-prefer-2f3f
DEV Community
I built these 5 types of loading animation in HTML and CSS, which do you prefer?
As a lover of clean UI design and smooth animations, I've always been fascinated by the creative...
This media is not supported in your browser
VIEW IN TELEGRAM
Изучите функции синхронизации перехода CSS с помощью этого руководства.🚀 🧑💻
Справочник фронтенд-разработчика/инженера, 2024 г.
https://frontendmasters.com/guides/front-end-handbook/2024
https://frontendmasters.com/guides/front-end-handbook/2024
Frontend Masters
The Front End Developer/Engineer Handbook 2024
The handbook provides an in-depth overview of the skills, tools, and technologies necessary to excel as a front-end developer / engineer.
21 совет по HTML, о которых вам следует знать
В этом посте я поделюсь 21 советом по HTML с фрагментами кода, которые помогут улучшить ваши навыки кодирования.
https://shefali.dev/html-tips/
В этом посте я поделюсь 21 советом по HTML с фрагментами кода, которые помогут улучшить ваши навыки кодирования.
https://shefali.dev/html-tips/
Shefali
21 HTML Tips You Must Know About - Shefali
Learn about these 21 simple HTML tips to boost your coding skills and improve your web development projects.
🕸 Тенденции веб-разработки, которые мы увидим в 2024 году 👀
https://dev.to/wasp/web-development-trends-we-will-see-in-2024-55pi
https://dev.to/wasp/web-development-trends-we-will-see-in-2024-55pi
DEV Community
🕸️ Web development trends we will see in 2024 👀
As we're already chugging along into the new year, it's the perfect time to take a look into what...
20+ удобных функций JavaScript для упрощения вашего кода
https://dev.to/devsmitra/20-handy-javascript-functions-to-simplify-your-code-javascript-tutorial-i0e
https://dev.to/devsmitra/20-handy-javascript-functions-to-simplify-your-code-javascript-tutorial-i0e
DEV Community
20+ Handy JavaScript Functions to Simplify Your Code | JavaScript Tutorial
JavaScript is a functional programming language, and functions play a crucial role. They allow you to...
Множество новых функций CSS помогут вам оптимизировать код и уменьшить избыточность.
CSS-вложение
CSS-переменные
Возможности диапазона Media Query
https://css-tip.com/better-modern-css
CSS-вложение
CSS-переменные
Возможности диапазона Media Query
https://css-tip.com/better-modern-css
Css-Tip
Write better CSS with modern CSS
Optimize your code and reduce redundancy using modern CSS.
Как создать интерактивный веб-сайт-портфолио на базе терминала
В этой статье вы узнаете, как создать интерактивное портфолио и резюме на базе терминала на JavaScript. Мы воспользуемся библиотекой терминала jQuery (и несколькими другими инструментами), чтобы создать веб-сайт, похожий на настоящий терминал.
https://www.freecodecamp.org/news/how-to-create-interactive-terminal-based-portfolio
В этой статье вы узнаете, как создать интерактивное портфолио и резюме на базе терминала на JavaScript. Мы воспользуемся библиотекой терминала jQuery (и несколькими другими инструментами), чтобы создать веб-сайт, похожий на настоящий терминал.
https://www.freecodecamp.org/news/how-to-create-interactive-terminal-based-portfolio
Принципы программной инженерии, которые должен знать каждый фронтенд-разработчик
Как фронтенд-разработчики, мы часто фокусируемся на создании красивых пользовательских интерфейсов. Однако важно помнить, что красота также находится внутри, и пиксельно-идеальный подход должен также отражаться на организации и структуре нашего кода. В этой статье мы рассмотрим некоторые фундаментальные принципы разработки программного обеспечения, которые каждый фронтенд-разработчик должен знать и применять в своих проектах.
https://dev.to/gboladetrue/software-engineering-principles-every-frontend-developer-should-know-1ej7
Как фронтенд-разработчики, мы часто фокусируемся на создании красивых пользовательских интерфейсов. Однако важно помнить, что красота также находится внутри, и пиксельно-идеальный подход должен также отражаться на организации и структуре нашего кода. В этой статье мы рассмотрим некоторые фундаментальные принципы разработки программного обеспечения, которые каждый фронтенд-разработчик должен знать и применять в своих проектах.
https://dev.to/gboladetrue/software-engineering-principles-every-frontend-developer-should-know-1ej7
CSS-градиенты Tailwind
Начиная с Tailwind 1.7, вы можете создавать градиенты без единой строки CSS 🎨. В этом уроке я покажу вам, как легко добавлять градиенты в ваши проекты с помощью Tailwind. https://devdojo.com/tnylea/tailwindcss-gradients
Начиная с Tailwind 1.7, вы можете создавать градиенты без единой строки CSS 🎨. В этом уроке я покажу вам, как легко добавлять градиенты в ваши проекты с помощью Tailwind. https://devdojo.com/tnylea/tailwindcss-gradients
DevDojo
TailwindCSS Gradients
As of Tailwind 1.7, you can create gradients without a single line of CSS 🎨. In this tutorial, I'll show you how easy it is to add gradients to your designs using Tailwind. Each gradient will typicall...
Использование Правил CSS If/Else
CSS постоянно развивается, и новые предлагаемые правила предоставляют дополнительные возможности, о которых вам следует знать. https://blog.openreplay.com/using-the-upcoming-css-when-else-rules
CSS постоянно развивается, и новые предлагаемые правила предоставляют дополнительные возможности, о которых вам следует знать. https://blog.openreplay.com/using-the-upcoming-css-when-else-rules
Openreplay
Using the upcoming CSS when/else rules
New important CSS rules you should be aware of