THE E-MILLENIAL STORE

An E-commerce website with payment via Stripe (A Gadgets Store) This is a React.js project bootstrapped with create-react-app.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Useful resources

Overview

The challenge

Users should be able to:

• View the optimal layout for the site depending on their device's screen size
• Search for items
• view results
• Add, update and remove from cart
• Make payments for items with stripe payments
• Navigate to the cart page

Screenshot

Links

• Solution URL: (https://github.com/faozziyyah/E-Millenial-store)
• Live Site URL: (https://faozziyyah.github.io/E-Millenial-store/)

My process

Built with

• CSS
• React-bootstrap - React Bootstrap: CSS framework
• React - React: JS library

What I learned

• React Bootstrap
• Stripe payment integration

<Dropdown.Toggle className={styles.cart}>
    <img src={cartLogo} alt="cart" className={styles.cartLogo} />
    <Badge>{cart.length}</Badge>
</Dropdown.Toggle>

<StripeCheckout
    className={styles.checkoutbutton}
    label='Pay Now'
    name='Gadgets Store.'
    billingAddress
    shippingAddress
    description={`Your total is $${price}`}
    amount={priceForStripe}
    panelLabel='Pay Now'
    token={onToken}
    allowRememberMe
    stripeKey={publishableKey}
/>

<StripeButton price={total} />

Useful resources

• React-bootstrap - React Bootstrap: CSS framework
• React - React: JS library
• Stripe Payment processing platform