Какие инструменты используешь для стилизации кода

«Какие инструменты используешь для стилизации кода» — вопрос из категории CI/CD, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

Для стилизации кода чаще всего использую CSS-in-JS (например, Styled Components или Emotion) и SASS/SCSS для модульных стилей. Также активно применяю CSS Modules, чтобы избежать конфликтов классов.

Пример с Styled Components:

import styled from 'styled-components';

const Button = styled.button`
  background: ${props => props.primary ? 'blue' : 'white'};
  color: ${props => props.primary ? 'white' : 'blue'};
  padding: 10px 20px;
  border-radius: 4px;
`;

// Использование
<Button primary>Click me</Button>

Для глобальных стилей и переменных использую CSS Custom Properties (переменные CSS). Инструменты вроде PostCSS с плагинами (autoprefixer) помогают обеспечить кросс-браузерность.