new class js -advanced
This commit is contained in:
@@ -0,0 +1,9 @@
|
||||
Code,Short Description,Tagline,Quantity,Price
|
||||
MUG0007,coffee mug with LCD level indicator,never again reach for the empty mug,20,49.90
|
||||
MUG0013,coffee mug with bluetooth-connected coffee grounds scanner for automatized fortune telling,put the smart into coffee reading,20,99.90
|
||||
OFF3145,pen with pre-warmed ink (tested on the South Pole),the pen is mightier than the cold,50,29.90
|
||||
COM1001,ambidextrous computer mouse,end the dictate of left and right,10,19.90
|
||||
COM0404,Easter egg themed webcam for your monitor,put an Easter egg on hardware too,20,149.90
|
||||
COM0001,Vulcan language vi cheatsheet,learn vi and Vulcan at the same time,3,9.90
|
||||
COM1536,Klingon language emacs cheatsheet,learn emacs and Klingon at the same time,50,9.90
|
||||
MOB0555,smartphone case with built-in screen,never miss a message,20,39.90
|
||||
|
@@ -0,0 +1,61 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Products</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" />
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<div class="container py-5">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item">
|
||||
<h2>coffee mug with LCD level indicator</h2>
|
||||
<p>never again reach for the empty mug</p>
|
||||
<p><strong>Price:</strong> EUR 49.90</p>
|
||||
|
||||
</li><li class="list-group-item">
|
||||
<h2>coffee mug with bluetooth-connected coffee grounds scanner for automatized fortune telling</h2>
|
||||
<p>put the smart into coffee reading</p>
|
||||
<p><strong>Price:</strong> EUR 99.90</p>
|
||||
|
||||
</li><li class="list-group-item">
|
||||
<h2>pen with pre-warmed ink (tested on the South Pole)</h2>
|
||||
<p>the pen is mightier than the cold</p>
|
||||
<p><strong>Price:</strong> EUR 29.90</p>
|
||||
|
||||
</li><li class="list-group-item">
|
||||
<h2>ambidextrous computer mouse</h2>
|
||||
<p>end the dictate of left and right</p>
|
||||
<p><strong>Price:</strong> EUR 19.90</p>
|
||||
|
||||
</li><li class="list-group-item">
|
||||
<h2>Easter egg themed webcam for your monitor</h2>
|
||||
<p>put an Easter egg on hardware too</p>
|
||||
<p><strong>Price:</strong> EUR 149.90</p>
|
||||
|
||||
</li><li class="list-group-item">
|
||||
<h2>Vulcan language vi cheatsheet</h2>
|
||||
<p>learn vi and Vulcan at the same time</p>
|
||||
<p><strong>Price:</strong> EUR 9.90</p>
|
||||
<p class="alert alert-warning">Last items in stock!</p>
|
||||
</li><li class="list-group-item">
|
||||
<h2>Klingon language emacs cheatsheet</h2>
|
||||
<p>learn emacs and Klingon at the same time</p>
|
||||
<p><strong>Price:</strong> EUR 9.90</p>
|
||||
|
||||
</li><li class="list-group-item">
|
||||
<h2>smartphone case with built-in screen</h2>
|
||||
<p>never miss a message</p>
|
||||
<p><strong>Price:</strong> EUR 39.90</p>
|
||||
|
||||
</li>
|
||||
</ul></div>
|
||||
</main>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
@@ -0,0 +1,10 @@
|
||||
const fs = require('fs');
|
||||
|
||||
fs.readFile('data/products.csv', 'UTF8', (error, data) => {
|
||||
console.log(data); // 2 output
|
||||
});
|
||||
|
||||
for (let i = 0; i < 2000000000; i++) {
|
||||
// be busy for a few seconds
|
||||
}
|
||||
console.log('ready'); // 1 output
|
||||
@@ -0,0 +1,32 @@
|
||||
const fs = require('fs');
|
||||
|
||||
const data = fs.readFileSync('data/products.csv', 'UTF8');
|
||||
|
||||
const STOCK_WARN_AMOUNT = 5;
|
||||
|
||||
const products = data.split('\n');
|
||||
products.shift(); // remove header
|
||||
|
||||
const recordToHTML = (record) => {
|
||||
const fields = record.split(',');
|
||||
const html = `<li class="list-group-item">
|
||||
<h2>${fields[1]}</h2>
|
||||
<p>${fields[2]}</p>
|
||||
<p><strong>Price:</strong> EUR ${fields[4]}</p>
|
||||
${
|
||||
Number(fields[3]) <= STOCK_WARN_AMOUNT
|
||||
? '<p class="alert alert-warning">Last items in stock!</p>'
|
||||
: ''
|
||||
}
|
||||
</li>`;
|
||||
|
||||
return html;
|
||||
};
|
||||
|
||||
const entries = products.filter((row) => row !== '').map(recordToHTML);
|
||||
|
||||
console.log('<ul class="list-group">');
|
||||
entries.forEach((entry) => console.log(entry));
|
||||
console.log('</ul>');
|
||||
|
||||
console.log('ready');
|
||||
@@ -0,0 +1,39 @@
|
||||
const fs = require('fs');
|
||||
|
||||
const STOCK_WARN_AMOUNT = 5;
|
||||
|
||||
// Function to convert a CSV record to HTML
|
||||
const recordToHTML = (record) => {
|
||||
const fields = record.split(',');
|
||||
const html = `<li class="list-group-item">
|
||||
<h2>${fields[1]}</h2>
|
||||
<p>${fields[2]}</p>
|
||||
<p><strong>Price:</strong> EUR ${fields[4]}</p>
|
||||
${
|
||||
Number(fields[3]) <= STOCK_WARN_AMOUNT
|
||||
? '<p class="alert alert-warning">Last items in stock!</p>'
|
||||
: ''
|
||||
}
|
||||
</li>`;
|
||||
|
||||
return html;
|
||||
};
|
||||
|
||||
// Asynchronous version
|
||||
fs.readFile('data/products.csv', 'UTF8', (err, data) => {
|
||||
if (err) {
|
||||
console.error(err);
|
||||
return;
|
||||
}
|
||||
|
||||
const products = data.split('\n');
|
||||
products.shift(); // remove header
|
||||
|
||||
const entries = products.filter((row) => row !== '').map(recordToHTML);
|
||||
|
||||
console.log('<ul class="list-group">');
|
||||
entries.forEach((entry) => console.log(entry));
|
||||
console.log('</ul>');
|
||||
|
||||
console.log('ready');
|
||||
});
|
||||
@@ -0,0 +1,5 @@
|
||||
const fs = require('fs'); // commonjs
|
||||
|
||||
const data = fs.readFileSync('data/products.csv', 'utf-8');
|
||||
|
||||
console.log(data);
|
||||
Reference in New Issue
Block a user