Successfully reported this slideshow.
Your SlideShare is downloading. ×

CSS Modules в React | Odessa Frontend Meetup #4

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad

Check these out next

1 of 41 Ad

CSS Modules в React | Odessa Frontend Meetup #4

Download to read offline

Что такое CSS Modules, для чего они нужны и чем могут помочь при разработке приложений на React. Сергей Котерняк объясняет, почему выбор подхода по написанию стилей — это важно и какие существуют альтернативные подходы — BEM, Inline Styles, CSS in JS.

Что такое CSS Modules, для чего они нужны и чем могут помочь при разработке приложений на React. Сергей Котерняк объясняет, почему выбор подхода по написанию стилей — это важно и какие существуют альтернативные подходы — BEM, Inline Styles, CSS in JS.

Advertisement
Advertisement

More Related Content

Similar to CSS Modules в React | Odessa Frontend Meetup #4 (20)

Advertisement

More from OdessaFrontend (20)

Recently uploaded (19)

Advertisement

CSS Modules в React | Odessa Frontend Meetup #4

  1. 1. Котерняк Сергей Front-end dev. at Heartpace
  2. 2. Стили в React / CSS-Modules
  3. 3. Мы поговорим о: 1. Важности выбора подхода по написанию стилей 2. Самых популярных подходах и решениях 3. Css-modules. Почему они и как это работает
  4. 4. Стили - это вообще важно?
  5. 5. 1. Архитектура приложения 2. Выбор инструментов для разработки 3. Удобство разработки 4. Скорость решения задач
  6. 6. Самые популярные подходы и решения
  7. 7. CSS - доступны все нативные свойства - легко использовать пре/постпроцессоры - удобно подключать autoprefixer - легко начать пользоваться - противоречит компонентному подходу - глобальная область видимости - проблемы с названием классов
  8. 8. - структурированное наименования элементов - доступны все плюсы CSS - низкий порог входа новых или неопытных сотрудников (для стилей) BEM - глобальная область видимости - монструозные классы
  9. 9. Inline Styles - независимые компоненты - локальная область видимости - поддержка Facebook? - отсутствие нормальной возможности работать с псевдоклассами, псевдоэлементами и медиазапросами - проблемы с autoprefixer - невозможность переопределять стили по более сложным селекторам - возможность влиять на глобальные стили
  10. 10. CSS in JS - независимые компоненты - локальная область видимости - нет ограничений по использованию стилей - высокий порог входа - назад в будущее (все в одном файле) - очень много решений - веб-стандарты более надежны
  11. 11. Radium
  12. 12. Aphrodite
  13. 13. CSS Modules
  14. 14. CSS Modules - что ты такое?(с)
  15. 15. Кратко это звучит так: css-файлы, в которых все классы и анимации по умолчанию находятся в локальной области видимости.
  16. 16. Локальная и глобальная область видимости
  17. 17. Удобная структура для написания компонентов
  18. 18. Это также просто, как если бы мы писали на Angular
  19. 19. Возможность использовать пре/постпроцессоров, автопрефиксера, анимаций, псевдо*
  20. 20. Спасибо

×