From b3f3c298559ff41ba674ac9cdbd1300d3443c3da Mon Sep 17 00:00:00 2001 From: Pradip Chaudhary Date: Thu, 15 Feb 2024 21:00:36 +0545 Subject: [PATCH] init basic minification and bundling app [project98] --- 98-Minification and Bundling/index.html | 22 ++++++++++++++++++ 98-Minification and Bundling/script.js | 30 +++++++++++++++++++++++++ 98-Minification and Bundling/styles.css | 29 ++++++++++++++++++++++++ 3 files changed, 81 insertions(+) create mode 100644 98-Minification and Bundling/index.html create mode 100644 98-Minification and Bundling/script.js create mode 100644 98-Minification and Bundling/styles.css 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; +}