B2C API React Example
  • Updated on 03 Apr 2020
  • 2 minutes to read
  • Print
  • Share
  • Dark
    Light

B2C API React Example

  • Print
  • Share
  • Dark
    Light

As a part of documentation related to Spryker Glue REST API, we have also developed a B2C API React Example. It is a React single page application based on a webpack devserver, Typescript, Redux, and Material UI.

The application has been developed for four primary purposes:

  1. Provide a simple yet fully functional example of Glue REST API usage.
  2. Illustrate a complete B2C Spryker experience using REST endpoints, starting from selecting the necessary product all the way through to placing an order. The shop also demonstrates the use of the API resources to create such features as the product catalog, search, auto-suggestions, customer registration, cart management, displaying order details etc.
  3. Allow you to try Glue REST API without any coding.
  4. Provide sample REST requests that can facilitate custom touchpoint development.
The shop is provided for display purposes only and should not under any circumstances be used as a starting point for any project.

API Resources

The Demo shop has been built using and demonstrates the use of the endpoints and resources provided by the following APIs:

API Reference Documents
Search API Catalog Search
Getting Suggestions for Auto-Completion and Search
Category API Browsing a Category Tree
Product API Retrieving Product Information
Product Availability API Retrieving Product Information
Product Price API Retrieving Product Information
Product Tax Sets API Retrieving Product Information
Product Image Sets API Retrieving Product Information
Product Labels API Accessing Product Labels
Login API Authentication and Authorization
Customer API Managing Customers
Cart API Managing Carts
Checkout API Checking Out Purchases and Getting Checkout Data
Order History API Retrieving Customer's Order History
Wishlist API Managing Wishlists
Store API Retrieving Store Configuration

Running the Example Application

The app source code can be found in the following GitHub repository: https://github.com/spryker-shop/b2c-api-react-example. You can install it inside Spryker Development Virtual Machine or on a dedicated web server.

For detailed installation steps, see B2C API React Example Installation.

Peeking Requests

After installing and running the example app, you can try its functionality. Depending on how you installed it, the shop will be available at:

To get a list of Glue API requests that were used to build a page:

  1. Open the F12 menu of your web browser.
  2. Activate the Console section.
  3. To get details of a specific request, expand it in the console.

glue-requests-sample.png

Was this article helpful?