Sarrah Vesselov: How to style in React and not lose friends | JSConf Iceland 2018

Поделиться
HTML-код
  • Опубликовано: 14 дек 2024

Комментарии • 20

  • @mohdule5607
    @mohdule5607 5 лет назад +20

    5:15 - Standardization Methods
    10:35 - Pre-processors.
    14:22 - Inline Styles / 15:23 - Other usage of Inline Styles
    20:12 - CSS in JS (Styled Components)
    24:44 - What should you use ?

  • @warkentien2
    @warkentien2 5 лет назад +3

    There are so many variables to consider! There's also CSS Modules which would use plain CSS and works with pre-processors while providing modularity. There's the benefit of using React props inside your styles with CSS-in-JS. But you could achieve the same thing with conditional class names (using the classnames dependency).

  • @TonyCassara
    @TonyCassara 6 лет назад +13

    Loved this talk. Fantastic information and great summary of the current style universe. I'm a big fan of CSS-in-JS but found that it got in its own way with global styles. Great for reusable components but if you have a default theme you want to fallback on it gets complicated and hard to implement. The Material UI base theme is a good example of this where it's easy to implement but tedious to customize on a larger website. I like using a base stylesheet with all my global defaults e.g. font size, families, etc, and then building component styles within CSS-in-JS.

  • @BorisMonth
    @BorisMonth 5 лет назад +2

    As someone who's touching web for the very first time right now the core concepts of HTML, CSS and Javascript are overwhelming enough. Now with ReactJS the barrier to entrance is even harder.
    This video gives you a good overview and idea WHY we went from CSS files to CSS-in-JS with React.
    Exactly the video I was looking for. Thank you very much.

  • @JAdamMoore
    @JAdamMoore 6 лет назад +4

    Absolutely terrific. Loved this talk. I ***REALLY*** hope you can do a follow up later, maybe on the tooling for using CSS-in-JS or the culture changes. Very enjoyable and VERY informative. Kudos. *standing ovation*

  • @crathme
    @crathme 6 лет назад +4

    Getting ready for a refactor/restructure on a medium-large react app and I found this talk very helpful. Thanks!

  • @nitsanbh
    @nitsanbh 2 года назад

    The slides' font-size is too small for mobile. For example see 20:39. It's like 3px. Please make the font bigger!

  • @km_jesus
    @km_jesus 4 года назад +2

    6:07 is function component uses 'this' keyword? I think it's only for class component.

    • @neutralface
      @neutralface 4 года назад

      Also accessing props, without taking props as a parameter. There is also a' href' attr in the img tag. I don't know who wrote these examples but clearly wasn't worried about the correct syntax :D

  • @ivanavas
    @ivanavas 6 лет назад +2

    Really nice comparison. I'm on the side of BEM, in general, but the main idea of​ asking the right question is great!

  • @eliudc.delgado9056
    @eliudc.delgado9056 6 лет назад +2

    I loved the “The devil was contacted in making of this decked but declined to comment” bit

  • @AmIrightbro
    @AmIrightbro 6 лет назад +6

    Tough crowd :( great talk.

  • @andrelandgraf1398
    @andrelandgraf1398 6 лет назад +1

    Very nice talk. Thank you for the comparison!

  • @sureshkumara7542
    @sureshkumara7542 5 лет назад

    It's really very nice talk.

  • @codeplumbers9237
    @codeplumbers9237 5 лет назад

    Excellen ttalk

  • @seanpaulson9098
    @seanpaulson9098 2 года назад

    Hell I noticed these problems just building a small app with two people. It's annoying...

  • @armanrozika
    @armanrozika 6 лет назад +3

    This is why I prefer Vue over React. In Vue, you can have style scoped for each component, thus no global properties

    • @RektOrNah
      @RektOrNah 5 лет назад +1

      I would have to agree with this, I just wish the job market would hurry up and move to Vue.

  • @nested9301
    @nested9301 Год назад

    Tailwind is here now

  • @UrThysis
    @UrThysis 4 года назад +1

    2020: css is still boken