Consider @artsy/fresnel

[IgnusG]

Please briefly describe the project you'd like to add to Best of JS?

Fresnel is an SSR compatible approach to CSS media query based responsive layouts for React. Recently it added support for the latest React versions and offers an in between solutions for a common problem with handling media queries withing JavaScript on SSR enabled frameworks - that is conditionally rendering React components based on the screen size.

What is the GitHub repository of the project you'd like to add to Best of JS?

https://github.com/artsy/fresnel

Before submitting the request to add a new project, please check the following points:

• The project is related to the web platform or Node.js
• The source code is on GitHub and project has more than 100 stars on GitHub
• The project has thorough documentation in English
• The project is not deprecated and actively maintained

How would this project be tagged? (Pick one or several existing tags from this list: https://bestofjs.org/tags)

React

Also you can suggest new tags to add if you think Best of JS is missing useful tags.

• Styling/CSS - general tag for anything related to JS libraries dealing with CSS perhaps?
• Media Queries/Breakpoints - Utilities for handling media queries, breakpoints

[michaelrambeau]

Hello @IgnusG thank you for the suggestion, the project is available on Best of JS:

https://bestofjs.org/projects/@artsyfresnel

I was not sure about the official name of the project: is it @artsy/fresnel or just Fresnel?

I picked @artsy/fresnel because it's the main heading in the README but I can change it.

Regarding the tags, we have a category CSS-in-JS but I don't think it applies to this project, so I think we need a more generic tag "Styling", I will work on that.

A very specific tag "Media queries" (or something more generic like "Responsive Web Design" makes sense too, let me know if you think about other projects that should belong to this tag.

[IgnusG]

Thank you @michaelrambeau!

I was not sure about the official name of the project: is it @artsy/fresnel or just Fresnel?
I picked @artsy/fresnel because it's the main heading in the README but I can change it.

I think it's @artsy/fresnel, I've never seen it used as just fresnel in any blogs or docs. But perhaps @damassi can correct me if I'm wrong.

Regarding the tags, we have a category CSS-in-JS but I don't think it applies to this project, so I think we need a more generic tag "Styling", I will work on that.

Yes, it's a better fit for a more generic tag 👍

A very specific tag "Media queries" (or something more generic like "Responsive Web Design" makes sense too, let me know if you think about other projects that should belong to this tag.

Let me research a little bit to see which ones are either well established or trending right now. I will get back to you (likely in another issue 👌). I think it would be ok to add the more specific tag once there's more than 1 library.

[michaelrambeau]

Hello @IgnusG sorry for the very late reply! 😅

I added a tag called "Responsive Web Design": https://bestofjs.org/projects?tags=rwd

Only 4 projects for now, let me know if you think we should add more projects under this tag.

Thank you for your help!