ECommerce Web Shop - Build & Deploy an Amazing App | React.js, Commerce.js, Stripe
Why Stack Overflow recommends it
Stack Overflow users link it as the tutorial they followed when asking for help debugging their React, Commerce.js and Stripe checkout code.
Recommended by 0 people across 0 different months, 2021 to 2022.
What it is
A 3.5-hour project tutorial from JavaScript Mastery that builds and deploys a full eCommerce web shop using React.js, Commerce.js and Stripe for card payments. It walks through cart, checkout and payment flow and ends with a portfolio-ready app.
What people said
Cites tm616 · 2021-06 · Stack Overflow · on “Commerce JS API rejecting my test transaction”
I'm having a tricky problem. I've created this ecommerce platform with react and I'm using the commerce JS API. I connected my sandbox stripe API key with the sandbox commerce JS key so I could do a test transaction, but each time I get an error and the transaction doesn't go through, leaving my cart quantity unchanged. In console I get the following error from the commerce JS API: [LINK] According to the commerce JS developer setting logs this is the request I'm sending: { "line_items": [ { "id": "item_7RyWOwmK5nEa2V", "product_id": "prod_LvJjoPJGale0nO", "name": "Ferrari", "product_name": "Ferrari", "media": { "type": "image", "source": " [LINK] " }, "sku": null, "permalink": "kKwz9a", "qu
Cites Tremaine Ledbetter · 2022-05 · Stack Overflow · on “I cannot get the About Component to display on React”
I am trying to have my React code display. I followed an ecommerce website YouTube tutorial [this video] and I have tried everything to get it to display. I have read up on React routers and switches, but I really cant spot my mistake. The Switch and Router <Switch> <Route exact path="/"> <Products products={products} onAddToCart={handleAddToCart} handleUpdateCartQty /> </Route> <Route exact path="/about"> <About About={About} /> </Route> <Route exact path="/cart"> <Cart cart={cart} handleUpdateCartQty={handleUpdateCartQty} handleRemoveFromCart={handleRemoveFromCart} handleEmptyCart={handleEmptyCart} /> </Route> <Route exact path="/checkout" exact> <Checkout cart={cart} order={order} onCaptureChe
Cites BASSAM · 2022-07 · Stack Overflow · on “Stripe payment gateway ID”
The problem in short is that after I finish submitting the test card details on the payment form, It should process the payment with stripe's API via commerceJs. But I keep getting an error saying payment.gateway: Gateway with ID "stripe" not found. I looked around and people suggested that I check the stripe sandbox toggle on commerceJs, because it should be on but I already checked it since I added stripe payment. I also thought there was a problem with the orderData object but it's printing all the right values. PaymentForm.jsx import React from 'react'; import { Typography, Button, Divider } from '@material-ui/core' import { Elements, CardElement, ElementsConsumer } from '@stripe/react-s