Book Image

Mastering Adobe Commerce Frontend

By : Jakub Winkler
Book Image

Mastering Adobe Commerce Frontend

By: Jakub Winkler

Overview of this book

Navigating the frontend realm of the Adobe Commerce platform can often feel like a labyrinth, given its multifaceted systems and intricate layering. This book demystifies Adobe Commerce frontend development, guiding you through its paths with clarity and precision. You'll learn how to set up your local environment, paving the way for a smooth development experience and navigate the platform's theming ecosystem, exploring layout XML systems and the power of templates. As you progress through the book, you'll leverage an array of JavaScript libraries and frameworks that Adobe Commerce boasts of, with special emphasis on RequireJS, jQuery, Knockout.JS, and UI Components. Additionally, you'll gain an understanding of the intricacies of Adobe Commerce CMS, explore frontend-related configurations in the admin panel, and unlock the secrets of frontend optimization. Practical exercises provided in the book will enable you to create top-notch Adobe Commerce sites that are functional, optimized, user-centric, and a step ahead in the ever-evolving frontend landscape.
Table of Contents (18 chapters)

Installing Adobe Commerce – preparing Docker

We will install the platform from scratch using Warden, so let’s get started! Open your terminal application (we will be using it a lot more from now on) and follow these steps:

Working on Windows WSL

For this book, all coding tasks and operations will be done on a Windows machine to cover all based related to file sync between your local drive and the WSL 2 drive. The next few steps have been done on a Windows machine.

  1. Make sure your Warden environment is working by typing the following:
    warden svc up

    You should see the following output:

Figure 2.10 – Checking whether Warden is running

Figure 2.10 – Checking whether Warden is running

  1. Create a folder for your project. For our purposes, we will name it packt1 by using the mkdir command:
    mkdir packt1

    You can also create a folder by navigating to a proper folder, but you will still have to access it via CLI | terminal.

  2. Enter the folder you created using cd:
    cd packt1
  3. ...