We have almost finished our final app, so it's a good time to review what we have learned so far.

Recap#

First, we learned there are two ways to create a React Native skeleton project. We also learned how to choose between them by understanding whether your project depends on a third-party library with native code.

Then, we learned how to configure a React Native project with NFC.

For Android, we simply add uses-permission into our AndroidManifest.XML, and it's done.

For iOS, we add NFC Tag Reading capability in both the Apple developer website as well as in our XCode project. Remember to add the privacy string into Info.plist as well.

After configuring our NFC project, we install react-native-nfc-manager

We walked you through how to identify the native part in platform IDEs Xcode and Android Studio. We also did a quick review of the NFC technology stack.

Then, we used API provided from react-native-nfc-manager to implement our TagCounterGame.

Those APIs are:

NfcManager.isSupported

NfcManager.isEnabled

NfcManager.start

NfcManager.setEventListener

NfcManager.registerTagEvent

NfcManager.unregisterTagEvent

NfcManager.setAlertMessageIOS

Please remember that most of these APIs are async functions.

After the iOS app, we mentioned that Android provides no system scan UI, so we implemented one from scratch.

During this process, there are several fun parts:

• How to use React Ref to construct imperative API

• How to use Animated from react-native

Awesome! Before we wrap it up, let's do some final styling to let our NFC game app looks better.

That is the fun part, and I hope you enjoy it as much as I do!

In the next module, we will explore NDEF, which is the most widely used data structure for NFC tags. I'll see you there!