Magento 2 Architecture Overview

Magento's Layers

┌─────────────────────────────────────────────────────┐
│                    Presentation                      │
│  (Themes, Blocks, Templates, JavaScript)            │
├─────────────────────────────────────────────────────┤
│                    Service Layer                     │
│  (APIs, Interfaces, Business Logic)                 │
├─────────────────────────────────────────────────────┤
│                    Domain                            │
│  (Entities, Value Objects, Repository)              │
├─────────────────────────────────────────────────────┤
│                    Infrastructure                    │
│  (Database, Cache, Search, File System)              │
└─────────────────────────────────────────────────────┘

Presentation Layer

Handles UI rendering:

• Themes: HTML, CSS, JavaScript layouts
• Blocks: PHP classes that prepare data for templates
• Templates (.phtml): PHP + HTML for rendering
• Layout XML: Defines page structure and block placement

Service Layer

Business logic and API:

• APIs (Service Contracts): Stable interfaces
• Business Logic: Validation, processing, orchestration
• Plugins/Interceptors: Method-level behavior modification
• Events/Observers: System-wide notifications

Domain Layer

Data models and persistence:

• Entities: Product, Order, Customer
• Repositories: Data access abstraction
• Resource Models: Database operations
• Collections: Query builders

Infrastructure

Technical foundation:

• ObjectManager: Dependency injection container
• Cache: Full-page, block, configuration
• Search: Elasticsearch/OpenSearch
• Queue: Message queue for async processing

How Magento is Modular

Every feature is a module. Even core functionality is modular:

app/code/Magento/
├── Catalog/          # Product catalog
├── Checkout/         # Shopping cart & checkout
├── Customer/         # Customer accounts
├── Sales/            # Orders & invoices
├── Shipping/         # Shipping methods
├── Payment/          # Payment methods
├── CMS/              # Content management
├── Store/            # Store configuration
├── Theme/            # Frontend themes
├── User/             # Admin users & roles
└── ... (100+ modules)

Module Structure

app/code/Vendor/Module/
├── registration.php          # Module registration
├── etc/
│   ├── module.xml            # Module definition
│   ├── di.xml               # Dependency injection
│   ├── events.xml           # Event observers
│   ├── frontend/
│   │   └── routes.xml       # Frontend routes
│   └── adminhtml/
│       └── routes.xml       # Admin routes
├── Api/
│   ├── Data/                # Data interfaces (DTOs)
│   └── *RepositoryInterface.php  # Repository interfaces
├── Model/
│   ├── Data/                # Data models
│   ├── *Repository.php      # Repository implementation
│   └── ResourceModel/       # Database operations
├── Controller/
│   ├── *Controller.php      # Action controllers
│   └── Adminhtml/           # Admin controllers
├── Block/
│   └── *.php               # Template blocks
├── view/
│   ├── frontend/
│   │   ├── layout/          # Layout XML
│   │   ├── templates/       # .phtml templates
│   │   └── web/             # CSS, JS, images
│   └── adminhtml/
├── Setup/
│   ├── InstallSchema.php    # Database install
│   └── UpgradeSchema.php    # Database upgrade
└── Test/
    ├── Unit/                # Unit tests
    ├── Integration/         # Integration tests
    └── Api/                 # API tests

Module Registration

// registration.php
use Magento\Framework\Component\ComponentRegistrar;

ComponentRegistrar::register(
    ComponentRegistrar::MODULE,
    'Vendor_Module',
    __DIR__
);

<!-- etc/module.xml -->
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Vendor_Module" setup_version="1.0.0">
        <sequence>
            <module name="Magento_Catalog"/>
        </sequence>
    </module>
</config>

The <sequence> tag defines load order (dependencies).

Areas

Magento divides the application into areas for different contexts:

// Area-specific configuration
// etc/frontend/di.xml — only loaded in frontend area
// etc/adminhtml/di.xml — only loaded in admin area
// etc/di.xml — loaded in all areas

Area Codes

// Area codes are set during bootstrap
use Magento\Framework\App\Area;

Area::AREA_FRONTEND   // 'frontend'
Area::AREA_ADMINHTML  // 'adminhtml'
Area::AREA_API        // 'api'
Area::AREA_CRONTAB    // 'crontab'

// Check current area
$areaCode = $this->state->getAreaCode();

Themes

app/design/frontend/Vendor/theme/
├── registration.php
├── theme.xml
├── etc/
│   └── view.xml           # Theme configuration
├── Magento_Catalog/       # Module-specific overrides
│   └── templates/
│       └── product/
│           └── list.phtml
├── web/
│   ├── css/
│   │   └── source/
│   │       └── _theme.less
│   ├── js/
│   │   └── main.js
│   └── images/
├── layout/
│   ├── default.xml
│   ├── catalog_product_view.xml
│   └── catalog_category_view.xml
└── templates/
    └── header.phtml

Theme Hierarchy

Parent Theme (e.g., Magento/luma)
└── Child Theme (e.g., Vendor/custom)
    └── Override specific files

Override order:
  1. Child theme files
  2. Parent theme files
  3. Module default files

Layout XML

<!-- layout/default.xml — applies to all pages -->
<page>
    <body>
        <referenceContainer name="header">
            <block class="Vendor\Module\Block\Logo" name="custom.logo"
                   template="Vendor_Module::logo.phtml"/>
        </referenceContainer>
    </body>
</page>

<!-- layout/catalog_product_view.xml — product page only -->
<page>
    <body>
        <referenceBlock name="product.info">
            <block class="Vendor\Module\Block\Product\CustomInfo"
                   name="custom.product.info"
                   template="Vendor_Module::product/custom.phtml"/>
        </referenceBlock>
    </body>
</page>

Layout XML is a powerful system for controlling page structure without modifying PHP code.