How to add Stripe payments to ANY Next.js 14 App! (Easy Tutorial for Beginners)

Поділитися
Вставка
  • Опубліковано 18 лис 2024

КОМЕНТАРІ • 98

  • @gynflo
    @gynflo 4 місяці тому +5

    Your explanations are super clear and concise. Thanks Sonny

  • @povilaskirna4108
    @povilaskirna4108 Місяць тому +1

    Damn you are such a goat, I stopped the video when you started talking about LCLhost and went and started reserching why not use NGROK because that's what I was familiar with. The moment I come back to the video and continue playing it I see you talk about NGROK vs LCLhost. Thanks a lot for another great tutorial I was kinda weirded out by the new Elements components since I come from the days when everything was handled on the stripe side, seems like they created an amazing component so now I can make fully customized checkout pages easily.

  • @semsomify
    @semsomify 2 місяці тому +1

    Thank you so much Sonny. Super clear! I watched several tutorials on this and yours is the most comprehensive and update to date! Like and Subscribe.

  • @DigitalAlchemyst
    @DigitalAlchemyst 4 місяці тому

    A follow up on how to enter stripe data into a data base, pay out tenant users of the app isolate money to user accounts and things of that nature would be great. basically covering deeper in how to use this beyond just grabbing money for sale of something and getting it to you from your strip account.

  • @christianhammervig438
    @christianhammervig438 5 днів тому

    Thank you, even tho you used typescript it was easy to convert to more useable code, javascript, and still get it working 👍

  • @mileslegend
    @mileslegend 5 місяців тому +5

    my guy comes out with another banger ,, thanks man for not allowing us get dormant.....

  • @JeremyMoritz1
    @JeremyMoritz1 4 місяці тому

    Marvelous tutorial! Followed along and my app worked perfectly on the first try. Thank you for doing this and with such attention to detail! Subscribed.

  • @shawn.builds
    @shawn.builds 3 місяці тому

    Wow that was FAST! Thanks Sonny

  • @developmentwithtariq
    @developmentwithtariq 3 місяці тому

    Thank you for your great contribution in my life as a developer

  • @rudya.hernandez7238
    @rudya.hernandez7238 Місяць тому

    Thanks for this. Also had to 'Turn On' Google Pay payment method on Stripe dashboard.

  • @MD.RIAJULISLAM-o9p
    @MD.RIAJULISLAM-o9p 5 місяців тому +1

    Thanks a llot. love from Bangladesh. I have been waiting for such a video.

  • @emmanuelomonzebaguan726
    @emmanuelomonzebaguan726 15 днів тому

    Thank you for this great resource

  • @LbovboE
    @LbovboE 2 місяці тому +4

    what about webhook? do we need that? it doesn't seem secure.

  • @rushikeshgandhmal
    @rushikeshgandhmal 3 місяці тому

    Sonny you are awesome teacher.
    You made it so simple, I'm using this tutorial to integrate stripe in real world project now.
    Thanks a ton. Keep up the high quality work.

  • @olawunitemitope2738
    @olawunitemitope2738 5 місяців тому

    Please do full tutorial on testing... Like jest testing

  • @jhmesseroux
    @jhmesseroux 11 днів тому

    Great tutorial. But i have an issue using the subscription mode . That's my error message :
    The provided setup_future_usage (on_session) does not match the expected setup_future_usage (off_session). Try confirming with a Payment Intent that is configured to use the same parameters as Stripe Elements.
    How can i solve it ?

  • @alexsantosdev
    @alexsantosdev 4 місяці тому

    Thanks bro, excellent content!

  • @bespokeprogramming
    @bespokeprogramming 4 місяці тому

    Sonny! You are a Legend!

  • @brunowego
    @brunowego 3 місяці тому

    Thank you for this amazing video :)

  • @sadique_x_
    @sadique_x_ 5 місяців тому

    thanks sonny!, thank you so much
    i'm a big fan

  • @bodywithoutasoul
    @bodywithoutasoul 5 місяців тому

    Thank you for this Sonny, very useful! May I ask why you decided to deviate from the stripe docs and fetch the client secret in the checkout component as opposed to the page, as they show it?

  • @urtechvibe
    @urtechvibe Місяць тому

    awesome sonny thanks

  • @aimagicx
    @aimagicx 5 місяців тому

    Thanks Sonny, Can you please do a video for Lemon Squeezy payment gateway?

    • @egretfx
      @egretfx 5 місяців тому

      yes please:)

  • @urtechvibe
    @urtechvibe Місяць тому

    awesome tutorial thanks

  • @WajahatIslamGul
    @WajahatIslamGul 20 днів тому

    To Enable Apple pay we have to register the domain on stripe dashboard. But when I give the url created by anchor, stripe says it is invalid url. So it doesn't really serve the purpose. Or am I missing something?

  • @Imbalancement
    @Imbalancement 14 днів тому

    Thanks so much for the video! Very helpful. One question though: Why would I be getting a 500 internal server error within the route.ts while in production? In development this error does not occur.

  • @ValentineHunter
    @ValentineHunter 5 місяців тому

    This is great. Please make a similar video on LemonSqueezy

  • @mohamedanouarjabri271
    @mohamedanouarjabri271 3 місяці тому +1

    Hello , I can't see the payment tab in the stripe website

  • @shreyanshsinghal5457
    @shreyanshsinghal5457 4 місяці тому

    Thanks for awesome tutorial

  • @vukosavljevich4541
    @vukosavljevich4541 3 місяці тому

    Helped me thank you!

  • @adomicarts
    @adomicarts 4 місяці тому

    Thanks sonnyyyy!!!!

  • @_A1Anime
    @_A1Anime 5 місяців тому +9

    How did you learn all these technologies?

  • @tmuse333
    @tmuse333 4 місяці тому

    useful video I appreciate it dude

  • @parrou3
    @parrou3 4 місяці тому

    Hi, is next.js a must learn for 2024-2025 ?

  • @MD.RIAJULISLAM-o9p
    @MD.RIAJULISLAM-o9p 4 місяці тому

    When I am trying to pay the bill it is showing me "No such payment_intent", how can I solve this problem?

  • @savindugunasekara-xh3zx
    @savindugunasekara-xh3zx 4 місяці тому

    Hey my payment element somtimes shows and sometimes doesnt load at all.. why is that happening

  • @itsmkb1213
    @itsmkb1213 3 місяці тому

    Hi when I try to make payments I get three entries in my stripe dashboard. One completed and two incomplete any idea how to solve it

  • @ashishsubedi1400
    @ashishsubedi1400 4 місяці тому

    can you do paddle integration with next js?

  • @setupfile-f6v
    @setupfile-f6v 4 місяці тому

    Thank you a lot for this video! But i'm actually trynna add apple and google pay and cashpp it doesn't work for cash app

  • @vatsalcodes
    @vatsalcodes 4 місяці тому

    Can we use paypal along with google pay? if yes then how?

  • @it32_harsh_ninave49
    @it32_harsh_ninave49 5 місяців тому

    MERN project from scratch!❤️

  • @LeMusulmanSceptique
    @LeMusulmanSceptique Місяць тому

    ty brother

  • @dominikjojczyk
    @dominikjojczyk 3 місяці тому

    how can i prepare a invoice with code, pleaes help me asap

  • @keristang7208
    @keristang7208 4 місяці тому +1

    hi sonny, i have successfully following your code , and it works. but somehow my code create 2 transaction everytime i checkout. one transaction show succeeded and another show incomplete. do i implement correctly or this is normal.

    • @itsmkb1213
      @itsmkb1213 3 місяці тому

      Mine creats 3. 2 incomplete and 1 success. Did you manage to solve it?

    • @keristang7208
      @keristang7208 3 місяці тому

      @@itsmkb1213 im not manage to solve it. is that normal? hope sonny can explain that to us.

    • @itsmkb1213
      @itsmkb1213 3 місяці тому

      @@keristang7208 I see. Can you kindly update me if you manage to figure it out. I will update you if I could solve it

    • @itsmkb1213
      @itsmkb1213 3 місяці тому

      @@keristang7208 @SonnySangha can you please reach to us!!!

    • @itsmkb1213
      @itsmkb1213 3 місяці тому +1

      @SonnySangha both of us have same kinda issue

  • @egretfx
    @egretfx 5 місяців тому +1

    what about LemonSqueezy? some countries dont have stripe support.

  • @skhomo
    @skhomo 4 місяці тому

    Can you please do PayPal as well, Stripe doesn't work on most countries

  • @shibashishmohapatra
    @shibashishmohapatra 3 місяці тому

    How u registered the domain in stripe dashboard

  • @abhishekjr4448
    @abhishekjr4448 2 місяці тому

    Sucks that stripe services are not available in India

  • @ferhatsunaycansev106
    @ferhatsunaycansev106 15 днів тому

    thanks

  • @graphiclife5416
    @graphiclife5416 5 місяців тому +1

    You can easily hack the price on the front end

    • @SonnySangha
      @SonnySangha  5 місяців тому +1

      Typically pricing comes from the backend, this is just a simple demo where we use a variable on the front end for the price😄
      But yes nice point - fetch the amounts from the backend typically!

  • @SedricWinningham
    @SedricWinningham 7 днів тому

  • @NSKisHERE
    @NSKisHERE 4 місяці тому

    at 12:35 , i cant see your form in my site :/ is it changed in 1 week??

    • @NSKisHERE
      @NSKisHERE 4 місяці тому

      i think changed in 1 week...

  • @AbdelmadjidLablack
    @AbdelmadjidLablack 3 місяці тому

    How to add customer email and name

  • @desh_dev
    @desh_dev 4 місяці тому +1

    how to add email address and phone number custom field

    • @AbdelmadjidLablack
      @AbdelmadjidLablack 3 місяці тому

      I'm having the same issue, were you able to find how to do it ?

    • @desh_dev
      @desh_dev 3 місяці тому

      @@AbdelmadjidLablack no I couldn't figure it out natively. What I did was collect info before redirecting to that screen and storing it globablly

  • @danimusbar
    @danimusbar 5 місяців тому

    Please make another tutorial but using Paypal

  • @Vasu-f2m
    @Vasu-f2m 3 місяці тому

    is this nextjs front-end or full-stack integration with Stripe ?

    • @Mario_coding
      @Mario_coding 2 місяці тому

      full-stack as you have a frontend and (database and payment integrated) backend.

  • @hamza_Techy
    @hamza_Techy 5 місяців тому

    Great!

  • @KATHLEENWoods-gz8rd
    @KATHLEENWoods-gz8rd 4 місяці тому

    2024-2026. How important it is to learn next.js and react

    • @SonnySangha
      @SonnySangha  4 місяці тому +1

      Extremely important. Trust me - market is huge

  • @bilet.airgang
    @bilet.airgang Місяць тому

    Niceee brow

  • @AllahomAnsorGaza
    @AllahomAnsorGaza 4 місяці тому

    anyone know what is his headphone name please :D

    • @SonnySangha
      @SonnySangha  4 місяці тому

      Audiotechniqa! In my desk setup tour I show all

  • @MrPherez
    @MrPherez 5 місяців тому

    Intergrate M-Pesa payment

  • @EmmanDizon-x7o
    @EmmanDizon-x7o 19 днів тому

    no apple pay, lol

  • @sujayxaradhya
    @sujayxaradhya 2 місяці тому

    Why everybody or very second grade developer is creating video only using Stripe? Does Stripe pay you? And if not then please look into small businesses, startups, or individuals who are facing problems like getting blocked with existing multi-thousands of dollars in the account with no legit reason by the worst Stripe.
    Why you guys don't make video on any other payment gateway integration? I understand that Stripe has best docs experience but this is not the legit reason to not make video on using any other payment gateway.
    Please do favour and help those business, startups that are getting shutdown only because of Stripe.
    This is really sad.😢

  • @animeheadquarters8005
    @animeheadquarters8005 16 днів тому

    I lovvvvvve you, but im not gay

  • @mohamedanouarjabri271
    @mohamedanouarjabri271 3 місяці тому

    I've tried it with react js but when creating the env.local file and trying to use the env variable it keeps showing an error saying that the Stripe() should take an apiKey with string type and I'am sure thet the process.env.Key is a string 🤷

  • @tomding2789
    @tomding2789 Місяць тому

    Fantastic