Тёмный

Изучаем styled-components за 20 минут на практике. Внедряем в любой проект 

Полина про Frontend 💜
Подписаться 2,9 тыс.
Просмотров 8 тыс.
50% 1

Урок по Styled-components библиотеке
00:00 Начальный код
02:45 Установка SC и базовое использование
05:52 Селекторы наследования и псевдо-*
07:25 Пропсы
10:39 Стилизация компонентов
13:00 Темы
20:21 Глобальные стили

Опубликовано:

 

11 июл 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 34   
@itwaslazyday
@itwaslazyday Год назад
Вам обязательно нужно продолжать! Очень хорошая подача материала! ❤
@polinajs
@polinajs Год назад
Благодарю:)
@user-ds4ik5zu9n
@user-ds4ik5zu9n 10 месяцев назад
У нас на курсе хуже рассказывали, тут быстро и все по делу. Мне очень зашло.
@SomethingTheBestEver
@SomethingTheBestEver 10 месяцев назад
отличный контент , познавательно, спасибо!
@2difficult2do
@2difficult2do 11 месяцев назад
Класс! давай, давай, контент в кайф можно вот это всё почаще 😊
@yurisorokin8016
@yurisorokin8016 Год назад
Спасибо! Замечательно и полезно!
@black_light
@black_light 4 месяца назад
Сломал голову с динамическими стилями. Благодаря вам решил проблему. Спасибо)
@pika4u380
@pika4u380 Год назад
Хорошее видео, спасибо)
@konstantinv5512
@konstantinv5512 10 месяцев назад
Спасибо, очень понравилось. Надо пропробовать применить theme, Global
@aiornerok3931
@aiornerok3931 11 месяцев назад
Успехов
@taggz1030
@taggz1030 Год назад
Спасибо, помогла!
@STELLS541
@STELLS541 11 месяцев назад
очень годно, в целом.
@caH40yc
@caH40yc Год назад
спасибо!
@RolandAlexCole
@RolandAlexCole Год назад
Полезно!
@elenasmirnova3549
@elenasmirnova3549 4 месяца назад
😘👍👍👍спасибо
@olegdoc3519
@olegdoc3519 Год назад
Молодец !
@user-nv5de5or3r
@user-nv5de5or3r Год назад
Класс
@godforger
@godforger Год назад
спасибо
@wakeup2k_
@wakeup2k_ Год назад
молодец продолжай в том же духе
@TipAnswer
@TipAnswer 11 месяцев назад
Кстати кому интересно styled-components в run-time тянет примерно 1500 строк кода, не сжатом ввиду конечно же, но тем не менее. Когда проект очень большой, сборку замедляет, так как ему нужно время на компиляцию, я бы взял tailwind 😊
@Virisound
@Virisound 8 месяцев назад
спс за инфу.
@maxamax5695
@maxamax5695 10 месяцев назад
Вот мне нужно было темы сделать, а я уже все написал через scss) и теперь нужно все переписать) за пару часов) а я ток сегодня узнал о этом способе) и вообще о стайл компонент 😢😅😅
@Virisound
@Virisound 8 месяцев назад
Для автокомплита свойств стилей в VScode - расширение: “vscode-styled-components”
@alexeysedov278
@alexeysedov278 11 месяцев назад
Один вопрос, часто ли используются styledcomponents в реальных проектах (и пэт проектах тоже), если есть масса css фреймворков для стилизации, которые делают всё тоже самое, только быстрее и логика уже прописана? другими словами, есть ли смысл учить подробно styled components, актуально ли это?
@SmashLincer
@SmashLincer 11 месяцев назад
styledcomponents используется часто. СSS фреймворки только для небольших проектов. Когда они разрастаются, пользоваться невозможно
@polinajs
@polinajs 11 месяцев назад
Часто. Но тренды меняются, поэтому, от проекта к проекту способы стилизации разные. Одного ультимэйт решения просто не существует, так что нужно иметь разносторонние знания, чтобы понимать как выстроить приложение под свои нужды
@hiki7661
@hiki7661 10 месяцев назад
@@SmashLincer не знаю, как по мне совершенно наоборот, цсс в библиотеку компонент бьется из тестами и сторибуком, при этом цсс в большинстве случаев лучше, та же оптимизация для мобилок и при плохом интернете, как по мне css in js это плохой подход в целом
@user-bg3hu1oz4y
@user-bg3hu1oz4y 9 месяцев назад
​@@hiki7661какой реальный опыт разработки в IT?
@ARBCHK
@ARBCHK 7 месяцев назад
Привет! Столкнулся с проблемой, когда меняю стили у App Bar компонента из MUI, то изменения просто игнорируются. Может кто знает, как достучатся до компонента? import styled from 'styled-components'; import { AppBar } from '@mui/material'; export const StyledAppBar = styled(AppBar)` background-color: #fff; `;
@polinajs
@polinajs 7 месяцев назад
почитайте статью в документации mui.com/material-ui/guides/styled-components/ mui по особенному работают с SC
@sam_starikov
@sam_starikov 11 месяцев назад
Привет! Зачем создавать GlobalStyle когда можно прописать глобальные стили просто в css файле?
@polinajs
@polinajs 11 месяцев назад
потому что суть styled-components в том, чтобы не использовать css. Это совершенно другой подход в стилизации реакт компонентов
@user-is8ov1km3t
@user-is8ov1km3t 10 месяцев назад
Как минимум в GlobalStyle прокидывается тема, что удобно для стилизации базовых background и color.
@thenothing7957
@thenothing7957 9 месяцев назад
Зачем вообще это разбирать, юзлесс либа и видос
Далее
Styled Components & React ПОЛНЫЙ КУРС
23:40
УНИТАЗ В ЛЕСУ?? #shorts
00:24
Просмотров 803 тыс.
React и TypeScript - Быстрый Курс
1:40:52
Просмотров 345 тыс.