🔴 Let’s build IN-APP SUBSCRIPTIONS with REACT NATIVE (RevenueCat, Tailwind CSS, Paywall, TypeScript)

84,648
0
Published 2023-01-26
🚨 Upgrade your coding skills by joining the world’s BEST developer community & course “Zero to Full Stack Hero”: www.papareact.com/course

📩 Want coding problems (with solutions!) delivered to your inbox daily!?
Sign Up Here: www.papareact.com/universityofcode

Join me as show you how to build in-app subscriptions with React Native. You'll learn the following in this build:

👉 How to add in-app subscriptions to ANY React Native App
👉 How to add Monthly & Annual in-app Subscriptions with localised pricing!
👉 How to integrate RevenueCat into an Expo app to easily manage your in-app subscriptions!
👉 How to set up App Store Connect
👉 How to set up Expo Application Services (EAS) using the EAS-CLI tools! (including how to deploy a development build to a LIVE iOS device!)
👉 How to add Tailwind CSS to your React Native app to seamlessly elevate your design!
👉 Add Expo Icons to level up your app's UI!
👉 How to add React Native Navigation to your application
👉 How to use TypeScript to reduce the overall number of Bugs and Errors
👉 How to write a custom hook in React

+ So Much More!

🔴 LOOKING FOR THE CODE? 🛠️
links.papareact.com/github

🎵 WANT TO LISTEN TO THE EXCLUSIVE PAPAFAM PLAYLIST?
Sign up for the PAPAFAM Newsletter here 👉 links.papareact.com/newsletter

👇🏻 FOLLOW ME HERE:
Instagram: links.papareact.com/instagram
Facebook: links.papareact.com/facebook
LinkedIn: links.papareact.com/linkedin
Twitter: links.papareact.com/twitter
Discord: links.papareact.com/discord

💰 WANT TO SUPPORT THE CHANNEL?
Donate here: links.papareact.com/donate
Grab some PAPA Merch: links.papareact.com/merch

🕐 TIMESTAMPS:
00:00 Introduction
01:25 Build Tech & Showcase
06:22 RevenueCat Sponsorship
9:41 Zero to Full Stack Hero
10:31 Initialising the Build (1/2)
11:37 Setting Up Expo
17:27 Initialising the Build (2/2)
18:47 Setting Up Native Wind & Tailwind CSS
24:14 Setting Up a Temporary iOS Simulator
35:05 Setting Up RevenueCat
37:25 Setting Up React Native Navigation
42:26 Building the Home Screen (1/2)
47:25 Building the Image in the Home Screen
49:20 Building the Pro / Upgrade Button in the Home Screen
55:06 Building the Action Row Component (1/2)
1:09:53 Creating the Demo Screen
1:11:16: Creating a Navigation React Hook
1:12:43 Setting up Type Definitions
1:13:54 Building the Action Row Component (2/2)
1:15:34 Building the Demo Screen
1:20:35 Creating the Paywall Screen
1:22:06 Building the Home Screen (2/2)
1:24:36 Building the Paywall Screen (1/2)
1:27:34 Building the Content Section of the Paywall Screen
1:31:22 Explaining RevenueCat
1:32:33 Setting Up App Store Connect
1:47:53 Creating Subscriptions using App Store Connect
1:58:00 Linking App Store Connect to RevenueCat
2:09:57 Creating a Custom React Hook for RevenueCat
2:22:04 Creating a Development Build
2:31:16 Testing the Development Build
2:32:01 Implementing Monthly Subscription Tier
2:37:23 Trying to Implement a Free Trial Functionality
2:40:35 Building the Paywall Screen (2/2)
2:48:25 Testing the Monthly Subscription
2:54:08 Implementing Annual Subscription Tier
2:57:17 Implementing Restore Purchases Functionality
2:58:58 Testing the Annual Subscription
3:03:10 Implementing the Free Trial Functionality
3:16:06 Final Build Demo
3:24:37 Final Build Summary
3:25:18 Outro

Let’s get it PAPAFAM 🔥.

DISCLAIMER: This Video is made for informational and educational purposes only. We do not own or affiliate with FASTFIT and it's subsidiaries in any form. Copyright Disclaimer under section 107 of the Copyright Act 1976, allowance is made for “fair use” of this video for education purposes.

#reactnative #appdevelopment #typescript #javascript #tailwindcss #revenuecat #tutorial #ios #android #reactjs

All Comments (21)
  • This YouTube CH has always bring us the best value content which we can implement it in to real world project,
    This is HUGEEEE ... Thank you for taking the time to do this.💯💥💥
  • @dje7382
    Oh my, this is huge.. you're a blessing Sonny. 💓
  • @Usq7213
    finally finish with a very interesting react native tutorials, love it!<333
  • @needyounow453
    I’ve searched for documentations and tutorials for expo in-app purchases for a month. Then I stucked. I feel so lucky today that you’ve exactly made this super helpful content for us. Thanks always for your help Sonny! I also wish you to teach us how to use expo push notification!
  • @FN-zg8lj
    you have the best energy of anyone on youtube!! Everyone else's tutorials always make me fall asleep haha. Thanks for the quality content
  • @CTBell-uy7ri
    This tutorial was so helpful! I can't even describe
  • @lopo889
    I like how his energy is, its just hype me up and forget this is a 3 hours live 😂
  • @kevinwang6066
    Thanks for making this! I love your videos and would love to see an Android version!
  • @iconpem5764
    Sonny... Thank you very much. I really do appreciate.
    Would love to see you do google pay or paypal with react native.
  • @SuperPompey77
    On the West coast of Canada these live builds are when it is 3am. East coast of Canada are 4.5 hours in front and so OK for them. Can you do these sometimes either 3 hours before or 3 hours after so we can all get a chance to watch live. 3am is right in the middle of do i go to sleep or do i get up now. Thanks for your consideration.
  • @Clytax
    Would be amazing if you could show the Android site of In app purchases aswell <3
  • @tinytrickz
    My Response in log can't show and this message, [Error: There is an issue with your configuration. Check the underlying error for more details. There's a problem with your configuration. None of the products registered in the RevenueCat dashboard could be fetched from App Store Connect (or the StoreKit Configuration file if one is being used). How to solve it? please
  • @enz1222
    Bro you got ro he the happiest developer out here 😂
  • @junenouh5404
    Hello And Thank you for the wonderful Tut...unbeliveable nice... in the minut 2:17:33 it shows error that the apikey is const and we pass a string ... what's wrong with taht ? any idea ?
  • @facelessdev107
    How are you casting your iPhone to Mac with the bezels ?
  • @alexisscuderi196
    this video helped me a lot, thanks!. Is it a bad practice if i restore purchases with a useEffect every time user logs in to the app?