Using Stripe API in NextJs

Поделиться
HTML-код
  • Опубликовано: 25 окт 2024

Комментарии • 65

  • @tajwarsaiyeedabid
    @tajwarsaiyeedabid Год назад +1

    Thank you. I had a problem in stripe Checkout payment intent. By completing your video i have solve my problem. Thank you again.

    • @hamedbahram
      @hamedbahram  Год назад +1

      Great to hear that! Happy to help.

  • @pablofernandezruiz8024
    @pablofernandezruiz8024 8 месяцев назад +1

    Hey Hamed thank you for this tutorial, I'm looking for a tutorial that covers subscriptions. I can't find a good video that explains it as detailed and organized as you do. Please do consider making one about integrating subscriptions! It would be greatly appreciated, even if it's paid, I bought your NextJS 14 course and it's awesome 😄

    • @hamedbahram
      @hamedbahram  8 месяцев назад

      Hey Pablo! For sure, I'll work on it. Glad to hear you liked the course.

  • @RaulReyesOnline
    @RaulReyesOnline 8 месяцев назад +1

    Thank you for the great tutorial, do you have an updated course or online tutorial that explains Nextjs and Stripe integración further? Like self hosted checkout, etc

    • @hamedbahram
      @hamedbahram  8 месяцев назад +1

      My pleasure! No I don't, but that's a great idea :) I may create one.

  • @RayTawil-en1ws
    @RayTawil-en1ws Год назад +1

    Well done! Great breakdown of the process and clean code organization.

  • @nogafouz2174
    @nogafouz2174 9 месяцев назад +1

    thanks alot well done
    but i have a question how can use payxpert instead od strip ?

    • @hamedbahram
      @hamedbahram  9 месяцев назад

      I haven't used that yet.

  • @Nitin_saini3542
    @Nitin_saini3542 3 месяца назад

    Thank you so much sir nobody telling how can we get user details after payment succeed by just using client side thanks again ❤

    • @hamedbahram
      @hamedbahram  3 месяца назад +1

      Glad you found it helpful!

  • @tjana-pengar-online
    @tjana-pengar-online Год назад

    This is really good tutorial, Thanks for sharing.

  • @jaykhan_sound
    @jaykhan_sound Год назад +1

    Great video, much appreciated!

    • @hamedbahram
      @hamedbahram  Год назад

      Anytime! Thanks for tuning in Jay.

  • @ledoublez
    @ledoublez Год назад +1

    Hey, it would really be interesting to add authentication to your app! Maybe also an order history for each user. Great video!

    • @hamedbahram
      @hamedbahram  Год назад +2

      Great suggestions! I appreciate your comment.

  • @HigherStudyAspirant
    @HigherStudyAspirant 9 месяцев назад +1

    Thank you. can we integrate our own html, css checkout page. I have seen many videos but didn't find any where they have integrated their own checkout page rather pre-build checkout page is used

    • @hamedbahram
      @hamedbahram  9 месяцев назад +1

      Hmm 🤔 yes you can build a custom checkout page and use Stripe APIs to power the functionality. I'll have that in mind for future videos.

    • @HigherStudyAspirant
      @HigherStudyAspirant 9 месяцев назад

      thanks, will be waiting...@@hamedbahram

  • @jackhump7676
    @jackhump7676 2 года назад +1

    thanks for your response
    I'm looking forward to going through the code😊

    • @hamedbahram
      @hamedbahram  2 года назад

      Hey Jack, did you have a chance to look at the code? was it helpful?

  • @ВиталийВвв-ж9о
    @ВиталийВвв-ж9о Год назад

    Nice video, the way how you explain is clear as well 👍

  • @eucheckout7
    @eucheckout7 Год назад +1

    Can you make a video about stripe elements?

    • @hamedbahram
      @hamedbahram  Год назад

      Can you expand on what you like to see in that video?

  • @berendvanbeerschot1472
    @berendvanbeerschot1472 Год назад

    I really like your way of working and explaining. Is it safe to use your stripe secret key in your client side code?

    • @hamedbahram
      @hamedbahram  Год назад

      Thanks Berend. Your stripe secret key is for server side use only, you can use the publishable key on the client side.

  • @mahesh-waghmare
    @mahesh-waghmare Год назад +1

    So, support I want to use the NextAuth In which I allowed user to authenticate with Google. And used the database MongoDb to store the information of authenticated user.
    Then after successful checkout I need to store the session id into the MongoDb user details.
    And when user again login then based on stored sessions I can fetch his/her subscriptions from the Stripe right?
    Is this the right way to connect Stripe + MongoDb + NextAuth on NextJs?

    • @hamedbahram
      @hamedbahram  Год назад

      Absolutely! That'll be a good work flow. Alternatively you can write the subscription details on the user record, so you don't have to hit Stripe API every time.

  • @8drapbeats873
    @8drapbeats873 2 года назад +1

    Thanks for video! Im using Auth0, how can i actually recognize and make some others actions such as add 'virtual funds' to logged user that paid? (How can I recognize logged user with his payment)?

    • @hamedbahram
      @hamedbahram  2 года назад +1

      Stripe returns the `sessionId` back to your success URL (once the user completes the payment), you can use the `sessionId` to retrieve the session from Stripe; on the session object you can see the customer details on `customer_details` field. You can then use the customer's email to connect it to the logged in user in Auth0.

  • @miguelyoutube100
    @miguelyoutube100 Год назад

    Thanks for the great video

    • @hamedbahram
      @hamedbahram  Год назад

      Glad you enjoyed it Edilberto, and welcome to the channel.

  • @jesusavila4306
    @jesusavila4306 Год назад

    Hi, very helpful, thanks man😄

  • @p_nik
    @p_nik Год назад

    very helpful! How can I make it so I can add the same product multiple times in the cart? to update the quantity
    thanks!

    • @hamedbahram
      @hamedbahram  Год назад

      Welcome to the channel Panos! you can add `quantity` to your `items` state or `cart` context and when calling the checkout method you can pass a quantity to Stripe. If you go to the `lib/checkout.js` file on my source code, you'll see that I'm adding the `quantity: 1` to my lineItems. Let me know if that makes sense.

    • @p_nik
      @p_nik Год назад +1

      @@hamedbahram thanks for the very fast reply, I am struggling to figure it out though. Could you please provide some sort of example? Thanks again

    • @hamedbahram
      @hamedbahram  Год назад

      @@p_nik I'll try to cover it in my next Stripe API tutorial. But from a high level when you're creating a Stripe checkout session you can pass quantity for each line item, how you are managing you quantity state depends on your app, but at the end you want to pass that quantity to Stripe.

    • @p_nik
      @p_nik Год назад +1

      @@hamedbahram thank you! I managed to do it eventually!

    • @hamedbahram
      @hamedbahram  Год назад

      @@p_nik Ok great! glad it worked out.

  • @hovivianwy
    @hovivianwy Год назад

    hi, your video has helped me greatly! may i ask how would i implement auto-pagination and Search query language (a search bar to search products) using your approach in this video? ive read through the stripe docs but couldn't fit those functions in my website

    • @hovivianwy
      @hovivianwy Год назад

      also, id like to know why you used {data: prices} to request the products instead of "products"? thank you

    • @hamedbahram
      @hamedbahram  Год назад

      Welcome to the channel Vivian. Good question, how many products do you have?

    • @hovivianwy
      @hovivianwy Год назад

      @@hamedbahram hi Hamed, since this is just a project of mine, i only have 30ish products, i was thinking maybe i could paginate my products into 3 pages, so 12 products on each page. not sure if this is feasible. thanks

    • @hamedbahram
      @hamedbahram  Год назад

      @@hovivianwy for sure. It's definitely doable, since there are only 30 products, you can fetch all and paginate in your state, or use something like SWR and fetch client-side. For search, we can either use the text search in stripe or something like algolia. Let me give it some thought and see what's the best way to do this.

    • @hovivianwy
      @hovivianwy Год назад

      @@hamedbahram thanks for your advice, i'll let you know how it goes!

  • @jackhump7676
    @jackhump7676 2 года назад

    looks good just what I'm after
    but any chance of seeing all the code

    • @hamedbahram
      @hamedbahram  2 года назад +4

      Thanks for watching Jack! you check out the code on the following repo:
      github.com/hamedbahram/stripe-payment

  • @clipartinc
    @clipartinc 2 года назад

    where do you include your publishableKey?

    • @hamedbahram
      @hamedbahram  2 года назад

      PublishableKey is for use with the `stripe-js` client-side package; You can define an environment variable in your `.env.local` file and prefix the variable name with `NEXT_PUBLIC_` so that it's accessible in your front end code.

    • @clipartinc
      @clipartinc 2 года назад +1

      @@hamedbahram Thanks, but, I was really asking him where he included his publishableKey in his code. I see it now though 11:43

  • @codewithfarhad8594
    @codewithfarhad8594 2 года назад

    when I go and type
    import "Stripe" from stripe;
    my nextjs can't resolve this module. I have triple checked my pkg json and all the pkgs you installed are there.
    so I don't know what's going on.
    any idea how to fix this?

    • @hamedbahram
      @hamedbahram  2 года назад +1

      If you've correctly installed the 'stripe' package, there shouldn't be a problem, can you tell me what error you're getting? Just keep in mind that the 'stripe' package is for the server side only and the '@stripe/stripe-js' is for the client side code.

    • @codewithfarhad8594
      @codewithfarhad8594 2 года назад +2

      @@hamedbahram thanks bro. I fixed it. I was mistakenly calling GetServerSideProps in a component instead of Pages so I was getting undefined and all the other errors. thanks for this great video 👏👏

  • @Diegoalllll
    @Diegoalllll 6 месяцев назад +1

    How to develop the refund api

    • @hamedbahram
      @hamedbahram  6 месяцев назад +1

      That makes a great topic for another video.

    • @Diegoalllll
      @Diegoalllll 6 месяцев назад

      @@hamedbahram please do it.

  • @quizguy17
    @quizguy17 Год назад

    great video man 🐐 , can i get source code ?

    • @hamedbahram
      @hamedbahram  Год назад +2

      Thanks Rishikesh. Here is the link to the source code:
      github.com/HamedBahram/stripe-payment
      You might also like this video I did on pagination and search in Stripe:
      ruclips.net/video/sMbfqmjy6e0/видео.html