---
title: Shopware Frontend Development Intermediate | Shopware Community Hub
description: >-
  Deepen your Shopware frontend expertise and take the next step toward building
  more complex storefront customizations. Learn powerful customization…
canonical_url: 'https://hub.shopware.com/learn/path/shopware-frontend-development-intermediate'
---

# Shopware Frontend Development Intermediate

# Shopware Frontend Development Intermediate

The **Shopware Frontend Development Intermediate** learning path builds on the foundations of the [Shopware Frontend Development Essentials](/learn/path/shopware-frontend-development-essentials) learning path and takes your Shopware frontend development skills to the next level.

You will explore **more complex storefront customization**, effective use of Twig, SCSS, and performance optimization.

In the second part, you will dive into the **Shopware administration** – learning its structure, the global `Shopware` object, and how to extend and customize it safely.

By the end of this learning path, you will be able to:

- Customize the storefront in a maintainable way using Twig, snippets/translations, and theme assets.
- Apply theme inheritance and styling patterns (SCSS, CSS variables, Bootstrap utilities/breakpoints) to build consistent UI changes.
- Understand and use the storefront JavaScript plugin system (lifecycle, extension patterns, and clean responsibility splits).
- Improve storefront performance with HTTP caching concepts, lazy loading, and practical measurement/validation.
- Understand the Shopware administration architecture and extend it using modules, routing/navigation, and the global `Shopware` object.
- Load and display backend data in the administration using DAL repositories, `Criteria`, and standard listing components (`sw-data-grid` / `sw-entity-listing`).

This learning path is designed for developers who want to dive deeper into **Shopware frontend development**. It equips you with the skills to build **robust**, **maintainable**, and **customized solutions** for Shopware projects. Whenever we mention "Shopware," we are referring to Shopware 6.

This learning path is based on Shopware 6.7 and reflects the latest recommended development patterns.

## Prerequisites

Before you start this learning path, make sure you have completed the following:

- Have Shopware **6.7** installed and running locally. You can follow our [Shopware setup course](https://hub.shopware.com/learn/course/shopware-setup) for guidance.
- Completion of the learning path [Shopware Frontend Development Essentials](/learn/path/shopware-frontend-development-essentials).
- Completion of the learning path [Shopware Backend Development Essentials](/learn/path/shopware-backend-development-essentials).

## Courses

## Courses
- [Storefront: Customization](/learn/course/storefront-customization): Learn how to customize the Shopware storefront using translations, theme assets, theme inheritance, SCSS styling, Twig templates, focused Playwright…
- [Storefront: JavaScript Mechanics and Patterns](/learn/course/storefront-javascript-mechanics-and-patterns): Learn how the Shopware storefront JavaScript runtime works, how to structure plugin classes safely, how to reuse core helpers, and how to apply these concepts…
- [Storefront: Performance Optimization](/learn/course/storefront-performance-optimization): Learn how to improve storefront performance using HTTP caching, lazy loading, deferred JavaScript execution, and practical measurement techniques.
- [Administration: Fundamentals](/learn/course/administration-fundamentals): Understand the purpose, architecture, and extension model of the Shopware administration. Learn how administration modules are structured and how the global…
- [Administration: Extended Concepts and Practical Labs](/learn/course/administration-extended-concepts-and-practical-labs): Deepen your understanding of Shopware administration development by exploring advanced component behavior, module extension patterns, routing, translations,…