About the Legacy Demoshop Front-end Guides

The Legacy Demoshop Front-end guides provide information of how the front-end was built in the Legacy Demoshop. Here you will find the following information:

• Overview of the Twig Template Engine used for building the front-end;
• Twig Templates best practices providing in-depth information on how to extend Twig templates: create pages in Zed, add multiple widgets to pages, add forms etc.

The Demoshop Guide will work you through the process of building your assets. The assets is a set of resources used to build the UI, that includes html, css (or less, sass, stylus, etc.) and js (or jsx, etc.) files, images, fonts and so on.

Assets represent a large collection of files, and to manage them effectively, we came up with the following 4-step procedure:

1. Download and structure: get external dependencies and put assets into the corresponding folders;
2. Development tools: create your project front-end;
3. Transpile/build and optimization: manipulate and optimize assets;
4. Public folder: place built output into a public and accessible folder.

We use the following path aliases to help you dive into the assets docs:

• @project: your project root folder;
• @core: Spryker core folder, usually (but not necessary) @project/vendor/spryker.