Let’s Build: Cryptocurrency Native Mobile App With React Native + Redux — Chapter IV

Greetings! Glad to see you back.

This is the fourth and final chapter in our React Native and Redux cryptocurrency app series.

Chapter III

So far we have:

• Set-up our project
• Wired up Redux
• Fetched data with Redux

The only thing for us to do is create our views with React. The most fun part!

Where we left off

Quick change: set the CryptoReducer.js initialState data prop to an empty array instead of null! It won’t work if you don’t do this — apologies!

Alrighty, here’s what’s left to do:

Create a stateless component called CoinCard.js and create the list item.

Remember the sketch called “thinking in React” from the old times?

“Thinking in React” Source

This perfectly explains how our app works. It goes like this:

• The yellow border is our App.js — app container
• The blue border is our Header.js component
• Green border is our CryptoContainer.js — holds our list items
• Red and neon blue is our CoinCard.js — lists items.

Makes sense, right? All we need to do is implement the red and neon blue borders.

Start by creating the stateless component.

Looks good!

Import View, Text, StyleSheet from "react-native" — we need these to create our view.