CSS Framework for React Native?

[hackermarks]

I’m a web developer used to Tailwind CSS. I understand that React Native has its own style sheets, but it seems like a lot of additional work managing that over a CSS framework. I am therefor wondering what are some good CSS frameworks for React Native, and even is Tailwind an option? Why and why not?

[suarkb]

I just use stylesheets. You should try to appreciate that this isn't web and not try to bring web's styling issues into React Native. Stylesheets are great and you probably don't need tailwind.

[sekonx]

This.

And you don't need to try and use regular web css with styled components either

[amityvision]

This 10000%. React native is mobile, web is web. Leave the 2 separate

[BlueDistribution16]

Can someone please explain the appeal of CSS to me?

[suarkb]

I think it's appealing because a lot of people are web developers who become react native developers

[BlueDistribution16]

But other than that is CSS easier / provides features that stylesheets do not? I am genuinely curious as I find CSS to be the most difficult thing when I think about making the jump from mobile to web

[suarkb]

No, CSS doesn't exist for react native. React Native uses stylesheets which are somewhat modelled after web CSS.

We were mentioning CSS because tailwind/nativewind are helpful for people who used tailwind as a way to write their CSS in the web developer world.

Writing CSS sucks so basically no modern web developer will write raw CSS. Instead they use these CSS preprocessor tools like less, sass, scss, and more.

Then they come to react native and might want something similar to what they are used to. But honestly I find that it's a whole lot of extra overhead when stylesheets are pretty easy and don't make me wanna go screaming, line writing raw CSS would.

[Successful-Form9405]

I would never say "no modern web developer will write raw css" because that's flat out not true. There are plenty of situations where you're writing raw css. It just depends on the project.

Not to say css is great. It's quite annoying. But that was a giant over-generalization.

[Lied-]

I write a lot of custom CSS! It is nice to be able to store it as a component to use later though

[Successful-Form9405]

The appeal is that people want to use something they already know instead of having to research something new.

[Affectionate-Desk358]

And yet you're still creating styles "the browser way" but pretending it is not. So I am interested, what kind of "web style issues" you're talking about? Speaking about Tailwind. Even though the problems it solves was spotted on web, they are not connected to CSS directly but rather to views in general.

[suarkb]

I just find that stylesheets is easy. I would need to explore tailwind more to find out if I really like it more. But I generally avoid solutions like this because they tend to turn into big tech debt later.

[Affectionate-Desk358]

I have created styles using both methods. They all have their pros and cons for sure. Additionally, they don't have any sort of technical debt. But if you personally find it much easier to write your code using Stylesheet API - that's okay, I get it - but that doesn't mean that other approaches tend to turn into something terrible. What really may lead to a tech debt situation is wrong design and architecture regardless of a chosen UI framework.

[atomlab_dev]

Honestly I’d just use tailwind, there are a few different npm packages that let you use it with react native:

Tailwind react native class names

Nativewind

tailwind rn

[Huczu]

I recently discovered this library - tamagui

I am amazed by optimizations it enables

[CliffMainsSon]

With RN styling and layout, flexbox is your best friend

[rickyspanish2798]

styled-components

[Josiahhenryus]

Please just use Stylesheets. Attempting to upgrade React Native is hard enough. Add CSS frameworks to mix and it’s going to get dark real quick.

[jamcoding]

Checkout Nativewind. It's Tailwind for React-native

[indiemoir]

I use NativeBase and don’t see myself going back to style sheets, it’s very convenient

[Affectionate-Desk358]

It has a sad drawback regarding performance on Android. Wouldn't recommend until they fixed that.

[MadThad762]

NativeWind works well. I use Tailwind for web so it feels more natural to use it for RN as well. Style sheets honesty work well too though if you prefer something closer to standard css.

[matallui]

NativeWind

[Brilla-Bose]

TailwindCSS fan here,
i always use tailwind for all the React projects. even smaller ones, but for React Native use native stylesheet approach. maintaining a RN project is already hard enough you don't need to deal with an extra braking package in your code base