Real World React Native
Real World React Native
About the Book
- React Navigation
- React Native Paper
- Dark Mode
- Offline Handler
- Push notification,
- In-App Purchase
- and more.
https://play.google.com/store/apps/details?id=com.kriss
Contents
Chapter 0: Prerequisites
In this chapter, we are going to take note of the required prerequisites in order to create the mobile application and integrate Admob into it.
Chapter 1: Splash Screen and App Icon
This chapter will go through the integration of the Splash screen and an App icon to our React Native application in a simple way.
Chapter 2: Getting started with React Navigation
In this chapter, we are going to make use of React navigation version 5. This chapter will show the creation of stack navigation and tabs navigation with icons from the vector icons package.
Chapter 3: Home Screen with React native paper
In this chapter, we are going to use a react native paper package for UI components to create Flatlist, Itemtiles, and also implement pull to refresh and infinite scroll.
Chapter 4: Content placeholder
This chapter will navigate through the addition of content placeholders. The idea is to show the content placeholders while the content is being loaded from the server.
Chapter 5: Single Post screen
In this chapter, we are going to create a post screen that shows all the details of the post along with bookmark and share icons.
Chapter 6: Bookmark functionality
In this chapter, we are going to make use of the AsyncStorage module in order to save bookmark data by creating a simple CRUD operation. We are also going to show posts that have bookmarked in tabs.
Chapter 7: Display categories
Here, we are going to create a screen that shows categories of a different post. Then, show the posts based on those categories.
Chapter 8: Feedback
In this chapter, we are going to use Formik and Yup packages in order to save feedbacks from end-users to Firebase database then using cloud function forward the message to the inbox using Sendgrid.
Chapter 9: Dark mode
In this chapter, we are going to learn how to add dark mode to react-navigation and react-native paper with automatic and manual triggers. Lastly, we will use the react-native-darkmode package to trigger initial theme selection through operating system preference.
Chapter 10: Offline handle
In this chapter, we will learn how to use the React native NetInfo package to handle internet connectivity status in the app.
Chapter 11: Admob
This is the highlighted chapter where we learn how to add Admob to the app. We will also learn some tricks that persuade users to watch ads and create context component in order to share code.
Chapter 12: In-App Purchase
After the installation of Admob, we will want to offer ends users to pay in order to remove ads. This chapter follows this purpose by setting up an in-app purchase on iOS and Android. This chapter is considerably long.
Chapter 13: Push notification with OneSignal
This is one of the most important chapters. Here, we are going to implement push notification using the OneSignal package. The notification will persuade users to open the app again and again. This feature is the most important piece of the puzzle that makes our app ecosystem complete.
Chapter 14: Publish on Play store
Here, we complete the development of our app by creating a production release version APK. Then, we learn to publish the app in the play store. It will take almost two days for the app to be live in the store. Then, you guys can freely test the app. Until then, you guys can buy this ebook.
Chapter 15: publish on AppStore
Here, we are going to learn to publish the app in the iOS App Store. We learn how to add screenshots and the Archive app from Xcode. Then, upload to the app store connect and submit to review.
Over time we will continually update this book by fixing issues, updating information, adding new relevant content, etc.
Have any feedback on what could be fixed/changed/added? Feel free to contact us!
Table of Contents
- Preface
-
Chapter 0: Overview & Pre requirement
- App Overview
- Pre requirement
-
Chapter 1 — SplashScreen and App icon
- Generate Icon
- Icon and splash screen for iOS
- Update new splash screen
- Icon and Splash Screen for Android
- Install React Native Splash Screen
- Conclusion
- Github Branch
-
Chapter 2 - React navigation and React native vector icons
- install react-navigation version 5
- setup React Navigation on iOS
- setup React Navigation on Android
- Organize a new structure
- handle Navigation
- Make tab look nice with React native vector icons
- installation on iOS
- Installation on Android
- Add icon to the tab
- Conclusion
- Github Branch
-
Chapter 3 — Create Home Screen With React Native Paper
- Bootstrap screen with React Native paper
- Fetch data from WordPress API
- Display Html on app with react-native render html
- add pull to refresh and Infinite scroll
- pull to refresh
- Infinite Scroll
- Conclusion
- GitHub Branch
-
chapter 4 Preloaders and Separate Components
- Creating preloader Component
- How to use
- Image placeholder
- Extracting Flatlist
- Conclusion
- Github Branch
-
Chapter 5 SinglePost screen
- Adding a Share button
- Conclusion
- Github Branch
-
Chapter 6 Handling Bookmark
- Installing AsyncStorage
- Setup on iOS
- Setup on android
- Bookmark CRUD
- Bookmark List Screen
- Using Focus Hook
- Conclusion
- Github Branch
-
Chapter 7 Categories screen
- Display Categories list
- Conclusion
- Github Branch
-
Chapter 8 Send Feedback
- Formik and Yup Setup
- Setting up React Native Firebase
- Setup on iOS
- Setup on Android
- Using Database package
- Sending email with Firebase Cloud Function
- Conclusion
- Github Branch
-
Chapter 9 Dark Mode
- Initial setup
- Changing Theme with React Context
- Activate context
- Change Theme on HTML
- No re-render problem
- Change theme on SinglePost Screen
- Change theme by using Operating System Preference Configuration
- Setup on iOS
- Setup on Android
- How to use…?
- Conclusion
- Github Branch
-
Chapter 10 Handling Offline Mode
- Installing React native Netinfo
- Setup on iOS
- Setup on Android
- Creating Context
- Testing on Android
- Conclusion
- Github Branch
-
Chapter 11 Monetize with Admob
- Setup Admob package
- Find Publisher ID
- Setup on iOS
- Installation on Android
- Display Banner
- Ad Banner in Single Post Screen
- Watch video ads in exchange to access more Post
- Launching Ad
- Conclusion
- Github branch
-
chapter 12 In-app purchase
- Installing React Native IAP
- Setup on iOS
- Product and Subscription
- App Store Connect
- Creating Tester
- Implementing RemoveAds screen
- Checking Product status
- Setup on Android
- Conclusion
- Github Branch
-
Chapter 13: Push Notification with OneSignal
- Pre-requisites to get started…
- Setting up OneSignal account
- Getting Certificate on iOS
- Setup on Android
- Setup Onesignal on React native
- Conclusion
- Github Branch
-
Chapter 14 Publish on Play Store
- Updating the App Version
- Creating Production Release
- Conclusion
-
Chapter 15 Submit to App Store
- Preparing ScreenShot
- Xcode Archive
- Conclusion
The Leanpub 60 Day 100% Happiness Guarantee
Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.
Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.
You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!
So, there's no reason not to click the Add to Cart button, is there?
See full terms...
Earn $8 on a $10 Purchase, and $16 on a $20 Purchase
We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.
(Yes, some authors have already earned much more than that on Leanpub.)
In fact, authors have earnedover $14 millionwriting, publishing and selling on Leanpub.
Learn more about writing on Leanpub
Free Updates. DRM Free.
If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).
Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.
Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.
Learn more about Leanpub's ebook formats and where to read them