Самое первое про обёртку дивом ; я бы передавал в аргумент компоненты название класснейма и потом пропсами дописал бы в этой компоненте данный класснейм + основной класс который у всех компонент присутствует , и в стилях все как у тебя было бы этот маргин ; в этом случае пропсы как по мне неплохо смотрятся; не надо считай постоянно обворачивать дивами
Да, так тоже можно, но суть в том что стили по позиционированию это ответственность места которое использует коммон компонент, а не самого компонента. Хотя мне ближе по душе оборачивать, чтобы не прокидать и не лезть в компонент, более чистый вариант как по мне.
@@aboutit6516 В подходе с пропсами стили по позиционированию будут в месте, которое использует компонент, а не в самом компоненте, с него снимается ответственность (и не надо в него лезть). Так же он хорошо работает с CSS Modules, достаточно использовать classnames и в компоненте на корневом элементе прописать className={cx('main', className)}. Минусом разве, что может быть снижение "инкапсуляции стилей", другой разработчик сможет в классе, который задумывался только для позиционирования задать и другие стили, которые меняют внешний вид, вместо продумывания интерфейса компонента. Вот примерно набросал как это может выглядеть codesandbox.io/s/frosty-water-bhggi?file=/src/Button.js
@@UvarovDM да, я так делал, было очень больно потом) Поэтому пришел к выводу что лучше внутри вообще стили по позиционированию не задавать, это просто сильно чувствуется на больших сложных проектах. Когда и так проблем с бизнес логикой хватает, и хочется чтобы UI проблем поменьше было.
Голос и видео хорошо рассказываешь, но рекомендации, какие-то сомнительные. Вместо того чтобы просто работать через className и добавить или переопределить стили через них городится, какой-то лишний код
Спасибо за ролик! Черепашка ниндзя одобряет) Не знаю Реакта, практикуюсь пока только на html,css,js. По поводу стилей использую методологию БЭМ и там стили, которые влияют на внешнее позиционирование (по типу марджинов, позишн, и т.д. и т. п.) пишутся к блоку, а остальные стили к элементу, таким образом можно легко переиспользовать блоки в нужных местах, а если есть какие-то различия (которые не влияют на внешнее окружение, так как то, что влияет пишется в стилях элемента), то добавляются модификаторы
Можно и так, я просто ненавижу классы=) Использую либо ксс модули либо стайлед компонент, все эти прокидывания классов, выдумывание имен, БЭМ и прочее - просто зря потраченное время и интеллектуальный ресурс. Но нужно понимать как это работает
styled-components рулят, решают всю эту красоту два клика, но я их складываю отдельно, и вызываю нужный, по принципу компонентов в фигме, будет дефолт и 2-3 стейта погнали делать дефолт и 2-3 стиля
Это создаст лишние пропсы и когда стили находятся рядом с компонентом их проще найти. Это не проблема когда класс один, но их может быть много. Но вариант оборачивать мне тоже не нравится, лучше определить в родительском css стили дочернего компонента.
Какие-то бесполезные обертки. className можно указать напрямую у компонента в месте его вызова и он применится к конкретному экземпляру. Использование BEM-подобного синтаксиса в 2021, когда есть CSS Modules тоже сомнительно. Советы хорошие, но видно что автор не до конца разобрался в теме.
Видео занимает слишком большую часть екрана, иногда кода не видно имей это в виду . В целом его можно сделать меньше . Спасибо за материал, хорошая подача , лайк поставил.
Можно было в двух словах описать, юзайте TS и парадигму MVVM ) изи) ну и сторы, но в целом в парадигме все подробно излагается касаемо отображения и логики
![Самый ценный навык React JS разработчика! [Мысли вслух]](/img/n.gif)
Ребята, просьба, смотрите по возможности до конца - это позитивно влияет на продвижение) Всем спасибо!
Настолько далеко провдинули, что ты оказался за пределами Ютуба)
@@AlexSizovRun где?)
лучше через пропсы прокинуть классы, чем расширять дерево на ровном месте
Спасибо. Мне больше нравится когда мне говорят чего нельзя делать в программировнии, чем когда рассказивают что можно.
Спасибо! Хотелось бы ещё!)
Мне понравилось, пишу на реакте уже около полу года, интересно перенять чей-то опыт.
Годно, нужно. Даёшь подобное по вёрстке и ui фреймворкам!
Отличное видео, очень хорошо объясняешь, видос про формы нужен!
спасибо за информацию, жду следующие видео.
Посмотрел полностью и очень сильно хотел бы ещё!
спасибо
Самое первое про обёртку дивом ; я бы передавал в аргумент компоненты название класснейма и потом пропсами дописал бы в этой компоненте данный класснейм + основной класс который у всех компонент присутствует , и в стилях все как у тебя было бы этот маргин ; в этом случае пропсы как по мне неплохо смотрятся; не надо считай постоянно обворачивать дивами
Да, так тоже можно, но суть в том что стили по позиционированию это ответственность места которое использует коммон компонент, а не самого компонента. Хотя мне ближе по душе оборачивать, чтобы не прокидать и не лезть в компонент, более чистый вариант как по мне.
@@aboutit6516 В подходе с пропсами стили по позиционированию будут в месте, которое использует компонент, а не в самом компоненте, с него снимается ответственность (и не надо в него лезть). Так же он хорошо работает с CSS Modules, достаточно использовать classnames и в компоненте на корневом элементе прописать className={cx('main', className)}. Минусом разве, что может быть снижение "инкапсуляции стилей", другой разработчик сможет в классе, который задумывался только для позиционирования задать и другие стили, которые меняют внешний вид, вместо продумывания интерфейса компонента. Вот примерно набросал как это может выглядеть codesandbox.io/s/frosty-water-bhggi?file=/src/Button.js
Я бы дефолтные значения марджинов задал, и, при необходимости, оверрайдил бы их в пропсах при необходимости. Будет меньше кода гораздо.
@@UvarovDM да, я так делал, было очень больно потом) Поэтому пришел к выводу что лучше внутри вообще стили по позиционированию не задавать, это просто сильно чувствуется на больших сложных проектах. Когда и так проблем с бизнес логикой хватает, и хочется чтобы UI проблем поменьше было.
Видимо, второго видео уже не дождёмся... А жаль, материал очень полезный!
Дуже сподобалось, дякую! Продовжуйте знімати!
спасибо, все круто. Жду вторую часть.
смотрите про HOC)
Голос и видео хорошо рассказываешь,
но рекомендации, какие-то сомнительные.
Вместо того чтобы просто работать через className
и добавить или переопределить стили через них
городится, какой-то лишний код
Полезно , давай еще )
Спасибо! Полезный контент!
Очень неплохо! Для себя ничего нового не нашел, но для новичков самое оно. Пили исчо!
Удачи!
спасибо за поддержку)
Спасибо, познавательно!
На 8:39 закрыли камерой часть кода, в таких случаях убирайте левое меню со структурой папок.
Увидел, сори
Спасибо за ролик! Черепашка ниндзя одобряет)
Не знаю Реакта, практикуюсь пока только на html,css,js. По поводу стилей использую методологию БЭМ и там стили, которые влияют на внешнее позиционирование (по типу марджинов, позишн, и т.д. и т. п.) пишутся к блоку, а остальные стили к элементу, таким образом можно легко переиспользовать блоки в нужных местах, а если есть какие-то различия (которые не влияют на внешнее окружение, так как то, что влияет пишется в стилях элемента), то добавляются модификаторы
Да, БЭМ неплоха, это так сказать тренировка для того чтобы научиться разделять ответственность в коде.
зашло, давай ещё!
спасибо!
Бомбезний відос !! коротко і зрозуміло.. Продовжуй записувати тем дуже багато..!!
давай еще, видос супер!
будет)
Мені сподобався такий формат😍
а почему нельзя передать класс как пропс? в таком кейсе не нужна обертка
Можно и так, я просто ненавижу классы=) Использую либо ксс модули либо стайлед компонент, все эти прокидывания классов, выдумывание имен, БЭМ и прочее - просто зря потраченное время и интеллектуальный ресурс. Но нужно понимать как это работает
Продолжай !
Что бы каждый раз обертку не писать, можно эту обертку сразу в компонент прокинуть. И рендерить с или без в зависимости от пропсов
или подставлять модификаторы класса сразу в компонент, ну или специальный класс какой-нибудь
styled-components рулят, решают всю эту красоту два клика, но я их складываю отдельно, и вызываю нужный, по принципу компонентов в фигме, будет дефолт и 2-3 стейта погнали делать дефолт и 2-3 стиля
Спасибо!
А почему просто не прокинуть className через пропсы с родительского компонента к дочернему?
Это создаст лишние пропсы и когда стили находятся рядом с компонентом их проще найти. Это не проблема когда класс один, но их может быть много. Но вариант оборачивать мне тоже не нравится, лучше определить в родительском css стили дочернего компонента.
Какие-то бесполезные обертки. className можно указать напрямую у компонента в месте его вызова и он применится к конкретному экземпляру. Использование BEM-подобного синтаксиса в 2021, когда есть CSS Modules тоже сомнительно. Советы хорошие, но видно что автор не до конца разобрался в теме.
ну не на всех проектах есть css модули, почему не разобрался? можно и класснейм прокидывать, просто мне так удобнее
Почему бы не сделать лист видосов, где ты обучаешь людей разбивать по компонентам и создание своего UI например CreatePortal и так далее.
Все будет)
3 месяца без видео, вот что бывает с теми, кто связывается с Соером
Видео занимает слишком большую часть екрана, иногда кода не видно имей это в виду . В целом его можно сделать меньше . Спасибо за материал, хорошая подача , лайк поставил.
спасибо)
👍
а нужно ли header или nav сделать отдельным компонентом , который можно повторно использовать ??
Можно было в двух словах описать, юзайте TS и парадигму MVVM ) изи) ну и сторы, но в целом в парадигме все подробно излагается касаемо отображения и логики
Привет , посоветуй как быстрей разобраться в чужом коде . Устроился на работу , кинули на проект где уже куча кода и он еще на react-native)
просто разобраться, панацеи нету:/
я бы посоветовал изучить базовую архитектуру проекта, но если мало времени мало то просто изучать те места в которых таска
@About IT как можно связаться с тобой?
В инсте можно
спасибо
крут
автор, посмотри как className="App", зачем ты учишь писать className={'App'}, да разницы нет, но читаемость ухудшается
что еще не так?) ролик направлен не на стиль кода класснеймов
го некст парт
Не "с", а "из". И "г" слишком мягкое. Но для украинца сойдет.