search

the-road-to-graphql / react-graphql-github-apollo

🚀 A React + Apollo + GraphQL GitHub Client. Your opportunity to learn about these technologies in a real world application.
https://www.robinwieruch.de/react-with-graphql-tutorial
1.59k stars 221 forks source link

CSS-in-JS #9

Open nick-walt opened 6 years ago

nick-walt commented 6 years ago

Hi Robin, this looks awesome. Would you consider converting your CSS into styled-components? Including layout components with Grid Layout and Flexbox? Cheers :)

stormasm commented 6 years ago

I was thinking of the same idea, after reviewing the code...

https://material-ui-next.com/customization/css-in-js/

The above explanation is a great use case for the css-in-js

https://oliviertassinari.github.io/a-journey-toward-better-style

Along with this presentation...

stormasm commented 6 years ago

However, it would be a lot of refactoring.... And in thinking about it further I am not sure it would be worth the effort. But at least there is some information here if you are curious...

nick-walt commented 6 years ago

This is a short article on styled-components which shows some great benefits, including simpler more semantic JSX: https://medium.com/@jamiedixon/styled-components-production-patterns-c22e24b1d896

rwieruch commented 6 years ago

I hesitated a bit to reply to this issue. I like the idea of using CSS grids, but on the other hand wouldn't want to add complexity to the repository itself. The focus shouldn't be on the style here, that's why I used simple CSS in the first place. What do you and others think about it? If I am the only one thinking this way, then we should go for your proposal! 👍 😃

nick-walt commented 6 years ago

Yeah, good point. I was thinking it would be a great example of CSS-in-JS. Maybe those interested can refactor offline to experiment. I'll have a crack :)

stormasm commented 6 years ago

Please post here after you do your experiment and/or if others do as well... Thanks !