React Native Fetch Data From API and Render FlatList

Learn how to use the React Native FlatList component by fetching data from API and then rendering the results.

----
Watch me live:

----
Video Suggestions:

----
Follow Me Online Here:

----
#benawad
​
----
#benawad

[RichardCodes]

This is great man. Learning react native now and the tutorial I was working on was a bit dated and messed up with the flatlist key. You’ve helped me out.

[dglonassik]

thanks for the video, it helped me a lot

[jeyko]

absolute lifesaver, helping me build my slackline social network! :D it's gonna be truly awesome

[hannanshabbir]

thanks brother its really helpful for me

[tejasmehta]

Wow... spent awhile trying to get this to work... your video did it perfectly!!! Thanks! One *small* thing to add: React is expecting the keys to be strings and you may get an error like "Warning : Failed child context type: Invalid child context 'virtualizedCell.cellKey' of type 'number' supplied to 'CellRenderer', expected 'string'". Simply update the keyExtractor with a .toString(), like: keyExtractor={(x, i) => i.toString() }

[bikal_kc]

I want to make the display dynamic so is there any options that i can modify the looks of the flat list?

[fflgamers]

What method you have used post, get, put??

[hicodeguru]

thanks for the video.. but for the separation of code how can I create and use a service.
js that will use the fetch api?

[arulyanasokan]

Hi Ben, Gr8 video. Can you also make video on doing the above using React Hooks? Or if you already have one video, can u direct me there?

[barnamam]

how to update a single item in flatlist without re-rendering all flatlist items

[deividbyrdarov]

Can you cover routing in react native?

[notiashvili]

It is generally considered an anti-pattern to be fetching any data inside `componentWillMount` or the constructor. All DOM manipulation and data fetching should be done inside `componentDidMount`.

[abdallahabderrahmen]

Hello, thank you for this video.Please can you help me ? I want to display list of option to textinput onchange ?

[prabu]

Hi, Actually I am trying to add TextInputs instead of names based on the number of items in the (responseJSON).For ex: if 3 items are received as response then it should add 3 TextInputs.

[SudhirKumar-ovee]

hi, i wan to use camera plugin, as well as contact plugin in react native, but i did not understand how to use it, plz guide me with iam using ubuntu with android phone.

[alezanchet]

how do i use it without the random user generator, with my firebase database?

[edocamoro]

keyExtractor has to be
keyExtractor={(x, i) => i.toString()}
to work

[khurramfarooqi]

can you help me with something i am trying to fetch a selected json object like if i press a name on my list it should only fetch and return the details of that particular name, is it possible ?? reply please

[flolegend]

How to extract data from json file store on disk rather than that link?

[mijaz]

would i do the same thing for only single item, results=1