diff --git a/98-Minification and Bundling/index.html b/98-Minification and Bundling/index.html
new file mode 100644
index 0000000..e16bd54
--- /dev/null
+++ b/98-Minification and Bundling/index.html
@@ -0,0 +1,22 @@
+
+
+
+
+
+
+ Minification and Bundling App
+
+
+
+
Minification and Bundling App
+
+
+
+
+
+
+
+
diff --git a/98-Minification and Bundling/script.js b/98-Minification and Bundling/script.js
new file mode 100644
index 0000000..cd7881f
--- /dev/null
+++ b/98-Minification and Bundling/script.js
@@ -0,0 +1,30 @@
+function minifyAndBundle() {
+ const inputCode = document.getElementById("inputCode").value;
+
+ if (!inputCode.trim()) {
+ alert("Please enter code to minify and bundle.");
+ return;
+ }
+
+ // In a real-world scenario, you might use a library or an API for minification and bundling.
+ // Here, we'll simply use a placeholder to demonstrate the process.
+ const minifiedCode = minifyCode(inputCode);
+ const bundledCode = bundleCode(minifiedCode);
+
+ displayResult(bundledCode);
+}
+
+function minifyCode(code) {
+ // Placeholder for minification logic
+ return code.replace(/\s/g, ""); // Remove whitespaces
+}
+
+function bundleCode(code) {
+ // Placeholder for bundling logic
+ return `(function(){${code}})();`; // Wrap code in an IIFE (Immediately Invoked Function Expression)
+}
+
+function displayResult(result) {
+ const outputCode = document.getElementById("outputCode");
+ outputCode.textContent = result;
+}
diff --git a/98-Minification and Bundling/styles.css b/98-Minification and Bundling/styles.css
new file mode 100644
index 0000000..d1e4bf8
--- /dev/null
+++ b/98-Minification and Bundling/styles.css
@@ -0,0 +1,29 @@
+body {
+ font-family: Arial, sans-serif;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 100vh;
+ margin: 0;
+}
+
+.container {
+ text-align: center;
+}
+
+textarea {
+ width: 100%;
+ height: 150px;
+ margin: 10px 0;
+}
+
+button {
+ padding: 10px 20px;
+ font-size: 16px;
+ margin: 10px;
+}
+
+#outputCode {
+ margin-top: 20px;
+ font-size: 18px;
+}