How to implement device-specific element visibility while integrating Memberstack 2.0 with React Native?

• 

  A J

  • October 31, 2024 15:00

  Hey Felix Gräf, if you are using Webflow, you can do that by selecting that particular device view and then changing its Display as highlighted in the screenshot. You can set it for tablets / mobiles as well. Hope this helps.

  

  0
• 

  Vaibhav

  • May 14, 2025 18:21

  Hi Everyone!

  I am just trying to integrate Memberstack 2.0 with react native, and as you can imagine there are lots of issues as it's not build for mobile frameworks, if anyone has any experience in this then please Let me know!!

  Specific issues i am facing -
  1.Plan Listing: How can I fetch or list the subscription plans created in the Memberstack dashboard within my app? Is there an API or method to do this?
  2.Payment Management: How do I handle payments for paid plans? Specifically, how can I initiate and manage Stripe payments via Memberstack on the mobile app side?

   

  Much Appreciated!!
  0
• 

  Raquel Lopez

  • May 14, 2025 18:22

  Hello,I’m not too familiar with React Native, so I can’t say for sure if the libraries are compatible or how to manage workarounds. The Memberstack DOM library is built for web apps, but I can guide you on what needs to be done so you can adapt it to your framework.So, for listing the available plans you can use the method getPlans()

  let allPlans = memberstack.getPlans();
  

  To initiate the payment of a plan, Memberstack uses purchasePlansWithCheckout(options) for users that had not yet subscribed to any paid plan yet or launchStripeCustomerPortal(options) method, to update billing and upgrade/downgrade plans

  await memberstack.purchasePlansWithCheckout({
    priceId: "prc_123", // required
    cancelUrl?: string,
    successUrl?: string,
    autoRedirect?: boolean,
  })
  

  await memberstack.launchStripeCustomerPortal({ 
    priceIds?: string[],
    configuration?: object,
    returnUrl?: string,
    autoRedirect?: boolean,
  })
  

  These two methods redirect the user to a Stripe-hosted page where the user can add their payment methods. This ensures that your site never has access to any personal payment data.You can find more info about all the methods available in the frontend here: https://developers.memberstack.com/docs/dom-front-end-package

  0
• 

  Vaibhav

  • May 14, 2025 18:23

  That's the challenge! DOM packages don't work in react native 😔

  0

Please sign in to leave a comment.