Questions tagged [react-native]

React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components. The focus of React Native is on developer efficiency across all the platforms you care about - learn once, write anywhere.

Filter by
Sorted by
Tagged with
3 votes
0 answers
36 views

React Native Component - Tinder slider

I have been creating a custom Tinder-like slider component for one of my work projects, and I have the majority of my logic inside of the index.js file. This has ...
user avatar
  • 31
1 vote
0 answers
35 views

Optimally change the classname of an html element dynamically in react/typescript?

I am currently building a custom dynamic tab component. In my component, I am dynamically creating a class name which I use to determine which tab is active and which is not. It seems to be working ...
user avatar
  • 11
0 votes
0 answers
19 views

Effective cache solution to have the newest data in React Native

Goal We have an app with different articles. I want to cache an article when the user has read it, but make sure that I display the latest data. I came up with this hook: ...
user avatar
  • 101
0 votes
0 answers
46 views

React Native clean up firebase function

I've been working on my personal project, using React Native and Firebase. Recently, I've encountered the following error on multiple occasions: ...
user avatar
  • 213
0 votes
0 answers
46 views

REST API server with Typescript, Node.js, express.js and MySQL: A few questions

I'm developing a Conway's Game of Life / generalised cellular automata simulation app for Android using React Native. One of the planned features will be the ability for users to access a catalogue ...
user avatar
  • 31
1 vote
1 answer
142 views

React Native login, sign up and sign out using Firebase project

I have built a basic app which uses firebase for authentication. The app is pretty simple. Sign up the user to firebase using email and password. Sign in the user Sign out the user Also, I have ...
user avatar
  • 213
1 vote
0 answers
19 views

Using React Native to implement Conway's Game of Life

I'm using React Native to implement Conway's Game of Life as a mobile phone app. So far I've implemented the game logic and a main screen with an embedded GLView component where the game board is ...
user avatar
  • 31
0 votes
0 answers
15 views

React Native useForegroundResettingState hook

would love a review for this hook. The context: I have a "date slider", which has "today", and previous days It's possible that a user leaves the app, and when he re-opens it from ...
user avatar
1 vote
0 answers
26 views

Typescript React-Native Component Dimension Hook

I did a lot of research trying to find a React Native component which could reference its own dimensions in order to scale different elements in its style, but could not find any solid examples. I ...
user avatar
0 votes
0 answers
79 views

Crud operations for profiles with React hooks

I'm creating a small app to get familiarize with React. I'm trying to follow the pattern introduced in this Kent C Dodds article. But I have more states than the article. Here is my initial state <...
user avatar
  • 47
0 votes
0 answers
44 views

TypeScript + React Native: Button Stepper Component

I built a ButtonStepper component and it's sharing quite a bit of the same logic, so I was wondering if it could be refactored better. It's sharing quite a bit of ...
user avatar
  • 109
1 vote
1 answer
45 views

abstract navigationOptions react navigation

I have many stacks with the same navigation options, how do I abstract the navigationOptions part to have it repeat in all my stacks? ...
user avatar
0 votes
2 answers
75 views

React Native screen to add a city to a weather app using a REST API

In a recruitment process, the company gives me a project to do in react native. I finished all the tasks. But company gave me a feedback and said that your project was good, but you did not apply best ...
user avatar
2 votes
1 answer
58 views

React component to render price change

I've written this Card component which is composed of thumbnail image, name, symbol, ...
user avatar
  • 123
0 votes
1 answer
21 views

react native refactor theme handling

I am styling my react native component according to some conditions, here the code, The question is how do I make this cleaner? functional style? ...
user avatar
-1 votes
1 answer
22 views

JS react manage dark mode ternary

How to choose the dark mode properly? ...
user avatar
1 vote
0 answers
78 views

React-Native: Using expo-font hook to retrieve assets

I am using expo and wanted to use the hook 'useFonts' from expo-fonts to retrieve fonts. While the assets are being retrieved a splashscreen is displaying. This is my solution. ...
user avatar
  • 111
0 votes
0 answers
19 views

react, react native refactor component for style

I have a button component on react native, depending on the "theme" prop I need to render a different style for the button ...
user avatar
1 vote
0 answers
10 views

react string replace {image0} with actual image ramda?

I can feel the following is definitely not the optimal nor the cleanest way to do this. But I'm not quite sure how to refactor this. ...
user avatar
  • 193
2 votes
1 answer
99 views

Managing redux state of mutiple switch components

I have a react native native app and I am fetching the state of the toggle buttons from an API and then putting them into redux state. I do not like the way I have implemented it cause it seems very ...
user avatar
5 votes
1 answer
12k views

React hooks update array of object

I have declared a react hook which will contain an array of object as follows: const [rowDataTracker, setRowDataTracker] = useState([]); Now I need to update the ...
user avatar
  • 53
4 votes
1 answer
44 views

Clean up and Refactor react code to increase performance

I am new in coding in React and I have just joined a new organization where I need to send my code for review .The functionality is working fine but it seems to me that code in my component has become ...
user avatar
  • 143
2 votes
1 answer
41 views

Displaying information from shops

To display all the shops, I get data from a database (Firestore) and push them into array and setState, and use map to display shops from ...
user avatar
  • 21
2 votes
1 answer
139 views

How to change the text in the flatlist items with improved performance?

I am working on a react native android app that generates fancy text. Similar to this Fancy Text Generator For every letter being typed fancy text will be generated. I implemented everything and it ...
user avatar
  • 123
3 votes
1 answer
91 views

React-native component

I've written this react-native component which is giving me a bad feeling that it's not as good as my expectations. I want to make it look cleaner with smart and less code. ...
user avatar
3 votes
1 answer
119 views

Minimize Hard Coding in React Native

Can anybody help me to minimize my hard coding? Also please give me any suggestions for improving my code for the future? My Source Code: ...
user avatar
5 votes
1 answer
57 views

How can I implement this React Native component without relying on a conditional statement?

I have a component, it's actually an entire screen in my application. This screen/component renders multiple other components. However, what it renders is conditional. Currently, I have an if ...
user avatar
  • 53
1 vote
0 answers
237 views

React Native form for entering one-time password [closed]

Here is the React Native code to optimize: it's an OTP form. I want it to be as small as possible. ...
user avatar
  • 111
1 vote
0 answers
87 views

React Native Lazy Collapsible Panel

What is it? React native Accordion Collapsible Panel. You pass the summary (always shown bit) and the detail (sometimes hidden bit). If the detail is passed as a function or promise (ie async ...
user avatar
2 votes
1 answer
49 views

Date prompt React.js component

I have created a date component (working GIF at the bottom; please ignore the styling). There isn't a problem with the working of the code but rather the code I wrote seems messy and something hard ...
user avatar
  • 121
1 vote
0 answers
507 views

Monitoring Services And Characteristics on React-Native [closed]

I have two questions for you about my code :) I'm creating an android to connect to ble device. I'm using ble-plx library. ...
user avatar
0 votes
0 answers
50 views

React filtering by key strings

I have the following code to filter some items by the keys. ...
user avatar
  • 109
5 votes
1 answer
59 views

Comparing 2 iOS and Android versions

Please review and let me know which version is better. I'm just trying to find any caveats or better ways to accomplish the a version comparison independent from Android and iOS. Formats accepted: '1....
user avatar
  • 51
3 votes
1 answer
433 views

React code to build shopping cart

I have built a basic shopping cart simulator. All it does is add and remove items between two different basket (i.e. aisle vs basket). While working on the problem I started to think about the ...
user avatar
  • 131
1 vote
0 answers
643 views

React Native app screen for booking appointments

I've been building a two-sided (both clients and service providers would use the app) appointment booking app. This is a screen from which a service provider can confirm their profile after having ...
user avatar
5 votes
1 answer
539 views

Creating directory within Application Support, and preventing iCloud backup

I'm using react native to build an iOS app, but have little to no experience in obj C or iOS development. The app I'm building has a bunch of content files that aren't user specific, will be ...
user avatar
  • 51
2 votes
0 answers
3k views

Get count of unread messages from google firestore

I am creating an app (with react native) on where messages can be viewed. On the home screen you can see a badge with the unread/new messages. It shows the badge (after a short delay, you will see ...
user avatar
  • 121
3 votes
0 answers
887 views

React native circular progress view

This is a functional component that I have developed in React Native for creating a circular progress view. The code does not use any external libraries, just pure CSS. Article that I wrote while ...
user avatar
0 votes
2 answers
270 views

Common styles in React-Native

Background: I am completely new to react-native. Question: Is there any reason why I shouldn’t do this from an experienced point of view? Goal: - have common styles in my react-native app? - use ...
user avatar
  • 111
1 vote
0 answers
4k views

Custom header with React-Navigation and React-Native-Paper

Thanks to the discussion in this issue combined with issue 1886 and issue 716 and issue 570 I was able to integrate the Toolbar of react-native-paper and with react-navigation. As I am quite new to ...
user avatar
  • 111
0 votes
1 answer
737 views

Using a destructuring assignment on a style object to extract two members

Recently, one of my colleague decided to destructure the React-Native styles object this way: ...
user avatar
  • 101
2 votes
0 answers
47 views

Create exact replica of react component with different name

I have a react native component called "width". It has 3 width values which have associated <TextInput>s which map to the redux store as ...
user avatar
1 vote
0 answers
362 views

Squares with different background colors

Titles is an array populated by numbers (1, 2 and 3). Depending on the number, a Square component should have a different ...
user avatar
  • 527
2 votes
0 answers
1k views

Small camera app in react-native for Android

I'd like you to help me review a small camera app. Most of the code comes from here; I just changed it a little bit. I started dabbling with react-native for the first time. It seems kinda neat but I ...
user avatar
  • 255
7 votes
1 answer
3k views

React Native - Combining login and signup pages into one component

I have been building an app in React Native and have decided that since my Login and Signup components share much of the same ...
user avatar
  • 315
7 votes
0 answers
4k views

React Native - Rendering different scenes based on application state

I am using react-native-router-flux to organize the routes for my application. Using Firebase, I am able to call ...
user avatar
  • 315