From af26ec29de31f13104c29a500cfe506dcd72a5ba Mon Sep 17 00:00:00 2001 From: Stephan Date: Mon, 24 Nov 2025 22:04:39 +0000 Subject: [PATCH] =?UTF-8?q?Layout=20Template=20System=20Guidelines=20hinzu?= =?UTF-8?q?gef=C3=BCgt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Layout-Template-System-Guidelines.md | 33 ++++++++++++++++++++++++++++ 1 file changed, 33 insertions(+) create mode 100644 Layout-Template-System-Guidelines.md diff --git a/Layout-Template-System-Guidelines.md b/Layout-Template-System-Guidelines.md new file mode 100644 index 0000000..cd3cd79 --- /dev/null +++ b/Layout-Template-System-Guidelines.md @@ -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**.