Documentation

Architecture Overview

ShopBite follows a modern headless architecture that offers flexibility and scalability. This architecture separates the user interface (frontend) from the business logic (backend), enabling maximum adaptability.

System Components

graph TD
    A[ShopBite Storefront] -->|API Calls| B[Shopware 6]
    B -->|Database| C[MySQL/MariaDB]
    B -->|Events| D[Order Printer]
    D -->|Print Jobs| E[Thermal Printers]
    A -->|Web Interface| F[Customers]

Components in Detail

1. ShopBite Storefront (Nuxt.js)

The Storefront is a modern, responsive user interface developed with Nuxt.js. It communicates with the backend via the Shopware Store API.

Technologies:

  • Nuxt.js 3
  • Vue.js 3
  • TypeScript
  • Tailwind CSS

Responsibilities:

  • Customer user interface
  • Product catalog display
  • Order process (Checkout)
  • Real-time updates

2. Shopware 6

Shopware 6 serves as the core E-Commerce platform and offers:

  • Product management
  • Order management
  • Customer management
  • Payment processing

Extended Functions through ShopBite:

  • Gastronomy-specific data models
  • Extended API endpoints
  • Event-based integration

3. ShopBite Plugin

The ShopBite Plugin extends Shopware 6 with gastronomy-specific functions:

  • Business hours management
  • Holiday management
  • Special checkout functions
  • API extensions for the storefront

Technical Details:

  • PHP-based extension
  • Integration into Shopware admin interface
  • REST API extensions

4. Order Printer

The Order Printer is a special service that sends orders directly to kitchen or counter printers.

Supported Printers:

  • Thermal printers
  • ESC/POS printers
  • CUPS-compatible printers

Functionality:

  • Query new orders via API
  • Formatting print data
  • Direct communication with printers

Data Flow

  1. Customer places order → Storefront sends data to Shopware API
  2. Shopware processes order → Stores in database
  3. Shopware sends event → Order Printer receives order information
  4. Order Printer prints order → Directly to kitchen printer
  5. Status update → Storefront displays order status

Technical Advantages

  • Scalability: Components can be scaled independently
  • Maintainability: Clear separation of responsibilities
  • Flexibility: Easy adaptation of individual components
  • Future-proof: Modern technologies and standards

Next Steps