Help/advice with react native themeing and more

Hey all, so im a backend dev that despises frontend dev…yet I need to learn it because of projects that I wanna do.

After a bit of trial, error and reasearch I’ve settled on react native, however, I need some help with themeing.

Whats the themeing siguation looking like in the react native land?
Do people use ui component libraries? if yes which ones?
Or should I just keep to styling everything myself?

A side question too. As im new to react (not just react native) I dont 100% know what im doing with state managenent. I know that I need to use react query because of caching and offline capabilities but I do not know weather I should be trying to use it along side react context or instead of it?
At the moment Ive got an example app where I used both react context and react query togher. I have my auth flow managed with context and some data fetching with react query.

Any advice here would be greatly apreciated.
Thanks in advance!

1 Like

Hey there! It’s great that you’re diving into React Native despite your preference for backend development. Let’s address your questions one by one.

Theming in React Native:
Styling Everything Yourself vs. UI Component Libraries:

  • React Native has various styling options. You can either style components manually using inline styles or use a styling solution like StyleSheet. While some developers prefer the control of styling everything themselves, others opt for UI component libraries to speed up development.

Popular UI component libraries for React Native include:

  • React Native Paper: A Material Design implementation.

  • React Native Elements: A cross-platform React Native UI toolkit.

  • NativeBase: A general-purpose UI components library.

State Management in React Native:
React Query and React Context:

  • You’re on the right track by using React Query for data fetching, caching, and offline capabilities. React Query primarily focuses on managing remote and asynchronous data.

  • React Context, on the other hand, is suitable for managing global state that needs to be accessed by multiple components. It’s often used for things like authentication state, theme preferences, etc.

  • Combining React Query and React Context is a common practice. For instance, you can use React Context for managing authentication state while using React Query for data fetching.

Advice:

Combining React Query and React Context:

  • Your approach of using both React Query and React Context for authentication and data fetching is valid. This separation of concerns can lead to a cleaner and more maintainable codebase.

Theming:

  • Consider your project requirements and timeline. If you need to build quickly and want a consistent design, using a UI component library can be beneficial. However, if you have specific design requirements or enjoy the flexibility of styling everything yourself, that’s a valid approach too.

Learning React Native:

  • Keep experimenting with small projects to reinforce your understanding.

  • Explore the React Native documentation and community resources for additional insights.

Feel free to ask if you have more specific questions or if there’s anything else you’d like guidance on. Happy coding!

2 Likes

Hey thanks for replying
Love the detail, thanks.
Since that post I kinda gave up on mobile apps since it’s such an uphill battle to develop and maintain one.
But if I ever come back to it I will definitely keep that in mind.

1 Like

I’m sure someone else will find a use for their helpful answer. :upside_down_face: Thanks for asking.

:atom_symbol::face_with_monocle:

1 Like