DEV Community

Cover image for How to build a news app with JavaScript and React Native

How to build a news app with JavaScript and React Native

Mohammed Salman on May 05, 2018

Requirements for building the app: A basic understanding of the JavaScript language. Node.js, and react native. Libraries used: moment, react-na...
Collapse
 
ethan profile image
Ethan Stewart

Great post! I might have to go play with this news API sometime.

One possible improvement in code clarity: in your getNews function, should this

let result = await fetch(url).then(response => response).then(response => response.json());

be replaced with this?

let result = await fetch(url).then(response => response.json());

Since you're just passing it along to the next then call, it seems redundant to me and could be removed to make the code a little more clear. If you do have a reason for doing it that way, I'd love to hear why!

Collapse
 
msal profile image
Mohammed Salman

thanks, i might've forgot that i added the await keyword.

Collapse
 
drakexiang profile image
DrakeXiang

I'm stuck at the fetch section... It keeps giving me Network request failed error, however I can manage to request using the same code in chrome console or using other api, any idea?

Collapse
 
msal profile image
Mohammed Salman

what is your device?

Collapse
 
drakexiang profile image
DrakeXiang

Thanks for reply, I was developing with Genymotion, I tried a real device after you brought it up and it worked.. that's weird, thanks anyway :)

Collapse
 
skptricks profile image
skptricks

Hello,
I have found similar article related to react native, hope this will be helpful to create first reactapp : skptricks.com/2018/06/how-to-creat...

Collapse
 
fadhilshu profile image
fadhilshu

What are you use of theme for syntax in your Code EDITOR

Collapse
 
msal profile image
Mohammed Salman • Edited

Sorry for the late reply, I use Relaxed color theme, indent-rainbow and Rainbow Brackets plugins for VS Code:)

Collapse
 
fadhilshu profile image
fadhilshu • Edited

What are you use of theme for this syntax in your Code Editor?
thepracticaldev.s3.amazonaws.com/i...

Collapse
 
jaakap profile image
Jaakap

Thank You Mohammed.. I will give it a try 👏🏽👏🏽

Collapse
 
msal profile image
Mohammed Salman

Sure thing, thanks for reading👍

Collapse
 
kishanjvaghela profile image
Kishan Vaghela

Hello All, I have implemented CardView for react-native with elevation, that support android(All version) and iOS. github.com/Kishanjvaghela/react-na.... Check this out

Collapse
 
rokkoo profile image
Alfonso

Thx Mohammed, nice post!

Collapse
 
msal profile image
Mohammed Salman

happy you liked it:)

Collapse
 
kwabenberko profile image
Kwabena Bio Berko

Hey Mohammed, you might want to hide your api key?

Collapse
 
msal profile image
Mohammed Salman

Thanks, i fixed the issue:)

Collapse
 
matperera profile image
matperera

Can I search for specific articles in the api

Collapse
 
oathkeeper profile image
Divyesh Parmar

This seems awesome, are you planning to do more such tutorials that'd be awesome

Collapse
 
msal profile image
Mohammed Salman • Edited

Yes, I will definitely be making more of these:)