feat(quickstart): Add index-cdn.html

flovogt · flovogt · commit b2eb072617d7 · 2026-04-10T14:11:54.000+02:00
diff --git a/packages/quickstart/steps/01/README.md b/packages/quickstart/steps/01/README.md
@@ -13,7 +13,7 @@ Let's get you ready for your journey! We bootstrap OpenUI5 in an HTML page and i
 
 <sup>*The browser shows a "Ready" button that triggers a "Hello World" message*</sup>
 
-You can access the live preview by clicking on this link: [🔗 Live Preview of Step 1](https://ui5.github.io/tutorials/quickstart/build/01/index.html).
+You can access the live preview by clicking on this link: [🔗 Live Preview of Step 1](https://ui5.github.io/tutorials/quickstart/build/01/index-cdn.html).
 
 ***
 
diff --git a/packages/quickstart/steps/01/webapp/index-cdn.html b/packages/quickstart/steps/01/webapp/index-cdn.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<title>Quickstart Tutorial</title>
+	<script id="sap-ui-bootstrap"
+		src="https://sdk.openui5.org/resources/sap-ui-core.js"
+		data-sap-ui-libs="sap.m"
+		data-sap-ui-compat-version="edge"
+		data-sap-ui-async="true"
+		data-sap-ui-on-init="module:ui5/quickstart/index"
+		data-sap-ui-resource-roots='{
+			"ui5.quickstart": "./"
+		}'>
+	</script>
+</head>
+<body class="sapUiBody" id="content"></body>
+</html>
diff --git a/packages/quickstart/steps/02/README.md b/packages/quickstart/steps/02/README.md
@@ -13,7 +13,7 @@ Now we extend our minimalist HTML page to a basic app with a view and a controll
 
 <sup>*The browser shows a Steady button in an app*</sup>
 
-You can access the live preview by clicking on this link: [🔗 Live Preview of Step 2](https://ui5.github.io/tutorials/quickstart/build/02/index.html).
+You can access the live preview by clicking on this link: [🔗 Live Preview of Step 2](https://ui5.github.io/tutorials/quickstart/build/02/index-cdn.html).
 
 ***
 
diff --git a/packages/quickstart/steps/02/webapp/index-cdn.html b/packages/quickstart/steps/02/webapp/index-cdn.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<title>Quickstart Tutorial</title>
+	<script id="sap-ui-bootstrap"
+		src="https://sdk.openui5.org/resources/sap-ui-core.js"
+		data-sap-ui-libs="sap.m"
+		data-sap-ui-compat-version="edge"
+		data-sap-ui-async="true"
+		data-sap-ui-on-init="module:ui5/quickstart/index"
+		data-sap-ui-resource-roots='{
+			"ui5.quickstart": "./"
+		}'>
+	</script>
+</head>
+<body class="sapUiBody" id="content"></body>
+</html>
diff --git a/packages/quickstart/steps/03/README.md b/packages/quickstart/steps/03/README.md
@@ -13,7 +13,7 @@ Finally, we add a second page to our app showcasing some of the key OpenUI5 conc
 
 <sup>*The second page shows plenty of UI controls and concepts to explore*</sup>
 
-You can access the live preview by clicking on this link: [🔗 Live Preview of Step 3](https://ui5.github.io/tutorials/quickstart/build/03/index.html).
+You can access the live preview by clicking on this link: [🔗 Live Preview of Step 3](https://ui5.github.io/tutorials/quickstart/build/03/index-cdn.html).
 
 ***
 
diff --git a/packages/quickstart/steps/03/webapp/index-cdn.html b/packages/quickstart/steps/03/webapp/index-cdn.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<title>Quickstart Tutorial</title>
+	<script id="sap-ui-bootstrap"
+		src="https://sdk.openui5.org/resources/sap-ui-core.js"
+		data-sap-ui-libs="sap.m"
+		data-sap-ui-compat-version="edge"
+		data-sap-ui-async="true"
+		data-sap-ui-on-init="module:ui5/quickstart/index"
+		data-sap-ui-resource-roots='{
+			"ui5.quickstart": "./"
+		}'>
+	</script>
+</head>
+<body class="sapUiBody" id="content"></body>
+</html>
