# Text strings must be rendered within a text component react native

**URL:** <https://forum.codewithmosh.com/t/text-strings-must-be-rendered-within-a-text-component-react-native/12779>\
**Category:** React Native\
**Created:** [June 1, 2022, 6:52am UTC](https://forum.codewithmosh.com/t/text-strings-must-be-rendered-within-a-text-component-react-native/12779 "2022-06-01T06:52:25Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![vishnulanka](https://avatars.discourse-cdn.com/v4/letter/v/8dc957/32.png) [@vishnulanka](https://forum.codewithmosh.com/u/vishnulanka)\
**Post date:** [June 1, 2022, 6:52am UTC](https://forum.codewithmosh.com/t/text-strings-must-be-rendered-within-a-text-component-react-native/12779/1 "2022-06-01T06:52:25Z")

</div>

Hello Everyone  
Am facing an error message which I have no idea where is it located, let alone know how to troubleshoot. Screenshot of the error message is below.

 ![Screenshot_1654066076](https://us1.discourse-cdn.com/flex020/uploads/codewithmosh/original/2X/c/c60ad20b0b5482da21a4a66647153ab64af50f0a.png)

Please find my code below

import {StyleSheet, View, Text} from ‘react-native’;  
import React from ‘react’;  
import ReactWeather, {useWeatherBit} from ‘react-open-weather’;

const App = () =\> {  
const {data, isLoading, errorMessage} = useWeatherBit({  
key: “b3b57b32b3bf44fabab0713e3362322b”,  
lat: “48.137154”,  
lon: “11.576124”,  
lang: “en”,  
unit: “M”,  
});  
return (  
  
\<ReactWeather  
isLoading={isLoading}  
errorMessage={errorMessage}  
data={data}  
lang=“en”  
locationLabel=“Munich”  
unitsLabels={{temperature: “C”, windSpeed: “Km/h”}}  
showForecast  
/\>  
  
)  
}

export default App;

const styles = StyleSheet.create({  
container: {  
flex: 1,  
},  
});

---

<div class="post-metadata">

**Author:** ![sufian.babri](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.codewithmosh.com/sufian.babri/32/1028_2.png) [@sufian.babri](https://forum.codewithmosh.com/u/sufian.babri)\
**Post date:** [June 1, 2022, 10:58pm UTC](https://forum.codewithmosh.com/t/text-strings-must-be-rendered-within-a-text-component-react-native/12779/2 "2022-06-01T22:58:03Z")

</div>

Can you please show us your code of the ReactWeather component?

---

<div class="post-metadata">

**Author:** ![vishnulanka](https://avatars.discourse-cdn.com/v4/letter/v/8dc957/32.png) [@vishnulanka](https://forum.codewithmosh.com/u/vishnulanka)\
**Post date:** [June 2, 2022, 3:52am UTC](https://forum.codewithmosh.com/t/text-strings-must-be-rendered-within-a-text-component-react-native/12779/3 "2022-06-02T03:52:40Z")

</div>

Hello Sufian, please find my code below:

import {StyleSheet, View, Text} from ‘react-native’;  
import React from ‘react’;  
import ReactWeather, {useWeatherBit} from ‘react-open-weather’;

const App = () =\> {  
const {data, isLoading, errorMessage} = useWeatherBit({  
key: “b3b57b32b3bf44fabab0713e3362322b”,  
lat: “48.137154”,  
lon: “11.576124”,  
lang: “en”,  
unit: “M”,  
});  
return (

\<ReactWeather  
isLoading={isLoading}  
errorMessage={errorMessage}  
data={data}  
lang=“en”  
locationLabel=“Munich”  
unitsLabels={{temperature: “C”, windSpeed: “Km/h”}}  
showForecast  
/\>  
)  
}

export default App;

const styles = StyleSheet.create({  
container: {  
flex: 1,  
},  
});

---

<div class="post-metadata">

**Author:** ![sufian.babri](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.codewithmosh.com/sufian.babri/32/1028_2.png) [@sufian.babri](https://forum.codewithmosh.com/u/sufian.babri)\
**Post date:** [June 2, 2022, 5:01am UTC](https://forum.codewithmosh.com/t/text-strings-must-be-rendered-within-a-text-component-react-native/12779/4 "2022-06-02T05:01:51Z")

</div>

You’re using a React.js dependency and it isn’t compatible with React Native, therefore it causes the issue.

This repository is doing something similar to what you’re aiming to do:

> **[GitHub - MuhammadTaimour95/Weather-App-React-Native](https://github.com/MuhammadTaimour95/Weather-App-React-Native)**
>
> Contribute to MuhammadTaimour95/Weather-App-React-Native development by creating an account on GitHub.

---

<div class="post-metadata">

**Author:** ![vishnulanka](https://avatars.discourse-cdn.com/v4/letter/v/8dc957/32.png) [@vishnulanka](https://forum.codewithmosh.com/u/vishnulanka)\
**Post date:** [June 2, 2022, 5:16am UTC](https://forum.codewithmosh.com/t/text-strings-must-be-rendered-within-a-text-component-react-native/12779/5 "2022-06-02T05:16:40Z")

</div>

okay thanks for reply. Can i implement the repo code in my application, as i am using bare react native in my application. Does your repo work for bear react native application.

---

<div class="post-metadata">

**Author:** ![sufian.babri](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.codewithmosh.com/sufian.babri/32/1028_2.png) [@sufian.babri](https://forum.codewithmosh.com/u/sufian.babri)\
**Post date:** [June 2, 2022, 5:23am UTC](https://forum.codewithmosh.com/t/text-strings-must-be-rendered-within-a-text-component-react-native/12779/6 "2022-06-02T05:23:24Z")

</div>

It’s not my repo. 🙂

With bare workflow, you can do anything, so yes you can.