React Native Components III [Day 3/30 — React Native]

Still exploring and experimenting with React Natives’ components as of day 3. I added an important feature that is very common with lists on mobile apps, the RefreshControl component.

You can read more about this component from the official documentation

RefreshControl Component

The RefreshControl component allows users to fetch new data on their screen when they pull the list down. In simple terms, it adds pull to refresh functionality inside of a ScrollView or ListView(FlatList and SectionList).

What I Built for Day 3

As I mentioned on day 2, I had some challenges styling the course card whiles using the FlatList component and had to fall back on the ScrollView component due to time constraints.

For day 3, I refactored the code to use FlatList instead, and to my surprise, fixing the day 2 problem was quite a breeze.

I then added the pull to refresh functionality to the FlatList component since it is a very common feature associated with lists on mobile apps.

Wrap up:

I’m very happy with what I have been able to achieve today. I’m hoping to build on this knowledge and apply the skills acquired in the projects I’ll be embarking on soon. To view the source code for day 3, kindly click on this link.

Thank you for your time. Any feedback and suggestions are welcomed in the comment section below. See you on day 4!😊



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Victor Bruce-Crabbe

Victor Bruce-Crabbe

A Frontend and Mobile Developer. I share my learning experience through writing based on what I will want to read when learning a new concept to help others.