Project: online store of sporting goods, started cooperation in 2021, the client needed custom functions

Project features: 20,000+ products in the catalog

Sync-Hub: About the Feature Usefulness

It took more than a year for WooCommerce experts to develop the function. Sync-Hub is a complex that consists of two components: a WP plugin and an AWS (Amazon Web System) system. It synchronizes sites with the Microsoft Dynamics 365 Business Central system. Let’s consider how this complex helps online sales businesses:

  • Synchronization of products from Business Central to WordPress. The client runs a business using several online stores. Accordingly, products presented on one site are duplicated on others. To ensure the correct flow of products, data is loaded from Business Central. Orders for products in an online store on WooCommerce are also synchronized with Business Central, Sync-Hub collects data and updates information on all linked sites. In addition, products are automatically created and deleted, and content on pages is updated.
  • Automatic loading of additional information about products. If items are out of stock, the system notifies the user when they appear. Restocking orders are sent to the site owner automatically.
  • Content synchronization. When the manager updates the content on the main site, the content on the subsidiary sites also changes automatically.
  • Order synchronization. With Business Central, owner can manage orders coming from different sites. Since Business Central is connected to the delivery service used by the warehouses, it takes only minutes from the time a customer places an order to the time it is packed.

In addition, the remaining goods are calculated automatically, and the system has many settings for different sites’ flexible work.

Why Does Business Need an Auxiliary System on AWS?

Dynamics 365 Business Central from Microsoft is a system that does not provide for any updates in third-party services. Data must be constantly pulled up to the WooCommerce online store, and this provokes a load on the server. That is why this work is performed by the AWS system. It constantly monitors changes in Dynamics 365 Business Central and synchronizes them with the site using a plugin. Also, order data from the site is automatically sent to Dynamics 365 Business Central from Microsoft. This system helps to withstand the load during promotions and marketing campaigns, when the number of purchases reaches peak levels.

AWS Sync-Hub Technologies

  • API Gateway;
  • Simple Queue Service;
  • Amazon EventBridge;
  • S3.

Plugin Technologies

  • custom API Endpoints;
  • Action Scheduler, CRON for asynchronous and deferred tasks;
  • large log system;
  • custom tables for storing data;
  • functional and easy-to-use UI/UX for administrators;
  • automation (for updating data from Business Central), which are responsible for disabling WP actions in the administrative panel settings;
  • internal system integrations with the parcel tracking plugin, order processing.

Another feature is the recalculation of the taxation system. The highest product tax value in the order is used as the index. For example, if there are 5 products in the order, of which:

  • two products are food with a tax of 15%;
  • three products are shoes with a tax of 25%.

The program will calculate all lines of the order with a tax rate of 25% (the business then deducts taxes according to this report at 25% for all lines), which can save at least €100,000 per year.

About the B2B System for Business

This is a system that our expert WooCommerce developers have jointly thought out and implemented for  «business customers» who buy in bulk, for example, boutiques, stores. It works on the basis of the following technologies and structures:

WPGraphQL Plugin

GraphQL is a modern query language for APIs that allows customers to request only the data they need, which increases the efficiency of interaction between the frontend and backend. In the context of WordPress, the WPGraphQL plugin provides an extensible GraphQL schema and API for any WordPress site. It allows developers to build rich JavaScript applications using WordPress as the CMS and modern frameworks like Next.js, Gatsby, Astro and others for the presentation layer.

For WooCommerce integration with GraphQL, there is a WooGraphQL plugin that extends WPGraphQL capabilities by adding support for WooCommerce features. This simplifies the creation of headless ecommerce sites by allowing developers to efficiently query and modify data about products, orders, coupons and more via GraphQL. WooGraphQL supports mutations, which allows for fast order processing and other operations.

Our WooCommerce experts created a main auxiliary plugin for extending WooGraphQL functionality — GraphQL. It adds the ability to extend the main one using Wordpress hooks from other internal B2B plugins, for example, adding the necessary data from related plugins to the frontend, which in turn is automatically deployed from the Git repository on Vercel.

What is Vercel?

Vercel is a frontend deployment platform that supports serverless functions and integrates with Next.js, React, Svelte, Vue and other frameworks. What does this system provide?

  • Automatic deployment from GitHub, GitLab, Bitbucket;
  • CDN (Content Delivery Network) for lightning-fast loading;
  • Serverless functions for serverless backend;
  • Edge Functions — distributed executable functions for minimal latency.

What is Remix and How Does Vercel Work with it?

Remix is ​​a full-fledged React framework that focuses on server-side rendering (SSR) and efficient data handling.

Unlike Next.js, Remix focuses on:

  • Server-side data loading without the need for useEffect;
  • Content streaming and progressive page loading;
  • Optimized navigation without client-side Fetch requests.

On Vercel Remix, you can run in serverless mode, where each request is processed by a separate serverless function, or through Edge Functions for even faster work.

What Has This System Given to the Business?

Vercel + Remix + React allows you to create fast, scalable, serverless websites and online stores on WooCommerce, which work without unnecessary client Fetch requests and with maximum performance on the server. Thanks to this, our client’s online store with a high flow of orders and a wide range of products in the catalog works at lightning speed.

Architecture Key Advantages

  • Flexibility — WP is used as a CMS, and the frontend has complete freedom in UI/UX.
  • Speed ​​— Vercel provides caching and CDN, and Remix minimizes unnecessary requests.
  • Query optimization — a custom plugin helps remove unnecessary fields, improve performance.

About Plugins: What Have The WooCommerce Experts Developed?

The special feature of this project is the more than 115 plugins that our team created. The main tools that we developed and how they helped our client:

  • AutomateWoo Improvements. This is an extension of the AutomateWoo plugin functionality. Various triggers, actions, variables are added, everything that the client needs for convenient automation of processes that AutomateWoo can cover.
  • Inventory Lists. Reports on product balances and other data are created automatically. A csv file is generated and a link to it is sent to a specified channel in the Slack app. Additional information about the execution time, the number of processed products, etc is stored. Settings are provided for deleting outdated files.
  • Add to Cart Popup. This is a WooCommerce feature for the cart. When adding a product from the catalog, a window with product data appears, the user can select the proposed options.
  • Blacklist. Allows admin to block users and cancel all their orders.
  • Bundle Additional Info. This is a mini-plugin that allows admin to display auxiliary content on the checkout page for product bundles if they are added to the cart.
  • Bundle Auto Update Price. The price of a product bundle is updated automatically depending on the change in the cost of the products in it. The discount percentage can be adjusted.
  • Charpstar. Integration of this third-party service provides the ability to add 3D models to the product gallery in different positions in the slider.
  • Delivery Promise. Depending on the settings in the administrative panel, the user is shown the time when the product will be delivered if he orders it right now in the WooCommerce online store.
  • Export finance reports. This WooCommerce feature works in tandem with the AWS system. Every month, financial reports on the operation of selected sites are automatically created. The data is stored in Google Sheets, access to them is limited to certain people. After generating reports, messages with a link to the tables are sent to Slack.
  • Mini Cart. Plugin for a mini-cart. Editing and customization are available.
  • Product Enhanced Selects. Variant product customization options, admin can add different product characteristics. If the product is out of stock, specialists can specify the date when it will appear for the selected variation.
  • Tracking Engine. The plugin allows users to track their packages.
  • Find My Size. A WooCommerce feature that calculates from the client’s previous orders what sizes of products he buys depending on the type of product.
  • Draft Products. Products that are out of stock can be transferred to Draft, they will not be displayed in the online store catalog on WooCommerce.

Results: What Did The Client Get?

As a result, the client received a fast and incredibly functional website. The results of our Ecommerce website development:

  • Sync-Hub for full synchronization of products, orders, content and automatic loading of information;
  • B2B-system for high site loading speed, its flexibility and query optimization;
  • Many plugins to automate business processes and improve the UX of the online store.

All technical interventions were aimed at improving the WooCommerce online store performance and automating business processes. As a result, the administrator needs to spend a minimum of time adding products, editing information, and other processes on different sites.