Shop
/
Shop-Storefront
4
0
Fork 0
Code Issues 25 Pull Requests Packages Projects 1 Releases Wiki Activity

Layout Template System Guidelines hinzugefügt

Stephan 2025-11-24 22:04:39 +00:00
parent 33b1b2c268
commit af26ec29de
1 changed files with 33 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
Layout-Template-System-Guidelines.md Normal file

@ -0,0 +1,33 @@
### Guidelines
- We have [defined 3 example pages](https://drive.google.com/file/d/1wt-UzSd1XdbUucTjAh2dAMhuO1HyCAoj/view) which should be recreatable by our layout template system.
- Our starting point is the [next.js-starter ](https://next.medusajs.com/de) template provided by medusa.
- The starter template uses [medusa ui ](https://docs.medusajs.com/ui/).
- Our Layout Template System should use medusa ui as base.
- Custom Components should be built on top of medusa ui. If medusa ui does not provide a specific component, a custom component should be implemented.
- To look into how different medusa patterns work, there are tutorials and resources for building a[ custom storefront](https://docs.medusajs.com/resources/storefront-development).
- Do not work destructively! This means guaranteeing that the new system can still represent the starter template design
### Layout System
The Layout System is comprised of following modules:
1. Data Layer: json data file
- This file defines which component should be rendered where and how by parameters.
- This should be the only file to edit.
- A configloader.ts loads the json by filesystem.
- It is abstracted as LayoutComponentNodes and LayoutContext
2. Dynamic Render System
- The Render System should be based on medusa next.js starter routes, components and templates.
- Additional components and templates should be put into /vibentec/ subfolders
- Each renderable component has to be added to the ComponentMap
3. Shared dynamic Components
- Each of the 3 example pages has to be analyzed and components have to be extracted so any of those different pages can be rendered by those same components.
- This should never result in 3 different templates or components for the same ui-component or layouting block. (e.g. menu or button)
- If the differences are great, try to manage differences by creating reusable sub-components first.
### Goal
* **Only the Json File** is responsible for layout and design for the pages
* Dynamic Render System uses json-file to build layout and page using **shared dynamic components**.