title: Question for stripe-webhooks with node.js
body: <p>I just watched a youtube to create a payment system with stripe API, react, and node.js. I am not  sure what webhook is and the purpose on this stirpe api. This code already checks the error, but why webhook is necessary and how does it work? I saw bunch of node.js stripe webhook examples but still could not understand. I am a super beginner</p>
  <p>Here is my code</p>
  <p>React(index.html)</p>
  <pre><code>import React, {useState} from 'react';
  import logo from './logo.svg';
  import './App.css';
  import StripeCheckout from &quot;react-stripe-checkout&quot;
  
  function App() {
  
    const [product, setstate] = useState({
      name: &quot;React from FB&quot;,
      price: 10,
      productBy:&quot;facebook&quot;
    })
  
    const makePayment = token =&gt; {
      const body = {
        token, 
        product
      }
      const headers = {
        &quot;Content-Type&quot;: &quot;application/json&quot;
      }
  
      return fetch('http://localhost:8282/payment', {
        method: &quot;POST&quot;,
        headers,
        body: JSON.stringify(body)
      }).then(response =&gt;{
        console.log(&quot;RESPONSE&quot;, response)
        const{status} = response;
        console.log(&quot;STATUS&quot;, status)
      })
      .catch(error =&gt; {
        console.log(error);
      })
    }
  
    return (
      &lt;div className=&quot;App&quot;&gt;
        &lt;header className=&quot;App-header&quot;&gt;
          &lt;img src={logo} className=&quot;App-logo&quot; alt=&quot;logo&quot; /&gt;
        
          &lt;a
            className=&quot;App-link&quot;
            href=&quot;#&quot;
            target=&quot;_blank&quot;
            rel=&quot;noopener noreferrer&quot;
          &gt;
            Learn React
          &lt;/a&gt;
  
        &lt;StripeCheckout
        stripeKey=&quot;KEY&quot;
        token={makePayment}
        name=&quot;Buy React&quot;
        amount = {product.price * 100}&gt;
          &lt;button className=&quot;btn-large pink&quot;&gt; buy react is just {product.price}$&lt;/button&gt;
        &lt;/StripeCheckout&gt;
  
        &lt;/header&gt;
      &lt;/div&gt;
    );
  }
  
  export default App;
  </code></pre>
  <p>Node.js (index.js)</p>
  <pre><code>const cors = require('cors');
  const express = require('express');
  const stripe = require('stripe')(&quot;KEY&quot;);
  const uuid = require(&quot;uuid&quot;);
  
  const app = express();
  
  
  //middleware
  app.use(express.json());
  app.use(cors());
  
  
  //routes
  app.get(&quot;/&quot;, (req,res)=&gt;{
      res.send(&quot;It works!!!&quot;)
  });
  
  app.post(&quot;/payment&quot;, (req,res)=&gt;{
      const{product, token} = req.body;
      console.log(&quot;PRODUCT&quot;, product);
      console.log(&quot;PRICE&quot;, product.price);
      const idempontencyKey = uuid();
  
      return stripe.customers.create({
          email: token.email,
          source: token.id
      }).then(customer =&gt; {
          stripe.charges.create({
              amount: product.price * 100,
              currency: 'usd',
              customer: customer.id,
              receipt_email: token.email,
              description: product.name,
              shipping: {
                  name: token.card.name,
                  address: {
                      country: token.card.address_country
                  }
              }
          }, {idempontencyKey})
      })
      .then(result =&gt; res.status(200).json(result))
      .catch(err =&gt; console.log(err));
  })
  
  //listen
  app.listen(8282, () =&gt;{
      console.log(&quot;Listening at PORT 8282&quot;);
  });
  
  </code></pre>