<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="favicon.png">
<title></title>
<meta name="description" content="" />
<style>
</style>
</head>
<body>
<table>
<thead>
<tr><th>a</th><th>b</th><th>c</th><th>d</th></tr>
</thead>
<tbody>
<tr><td>1</td><td>8</td><td>9</td><td>3</td></tr><tr><td>2</td><td>7</td><td>5</td><td>6</td></tr><tr><td>3</td><td>6</td><td>3</td><td>84</td></tr><tr><td>4</td><td>1</td><td>2</td><td>32</td></tr>
</tbody>
</table>
</body>
</html>
const fs = require('fs');
const nunjucks = require('nunjucks');
const express = require('express');
const Papa = require('papaparse');
const app = express();
function loadSheet() {
var table = {
head: [],
body: []
}
var csv = fs.readFileSync("table.csv",{encoding:"utf8"});
Papa.parse(csv.trim(),{
complete: function(results) {
table.head.push(results.data[0]);
for (var i=1;i<results.data.length;i++){
table.body.push(results.data[i]);
}
console.log(table);
var html = nunjucks.render("template.html",table);
fs.writeFileSync("index.html",html);
}
});
}
loadSheet();
app.use('/', express.static('./'))
app.listen(3000, () => {
console.log('server started');
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="favicon.png">
<title></title>
<meta name="description" content="" />
<style>
</style>
</head>
<body>
<table>
<thead>
{% for row in head %}<tr>{% for i in row %}<th>{{ i }}</th>{% endfor %}</tr>{% endfor %}
</thead>
<tbody>
{% for row in body %}<tr>{% for i in row %}<td>{{ i }}</td>{% endfor %}</tr>{% endfor %}
</tbody>
</table>
</body>
</html>
| a |
b |
c |
d |
| 1 |
8 |
9 |
3 |
| 2 |
7 |
5 |
6 |
| 3 |
6 |
3 |
84 |
| 4 |
1 |
2 |
32
|
About
This repl generates HTML tables automatically from a csv file. By default, the csv file is a local file but it is easy to download from a url.
To view this on TripleLog, click here
Papaparse
We will use the papaparse library to parse CSV. Read their documentation to convert just about any CSV to the table you want.
HTML
NodeJS Server
By default, the table is regenerated each time the server is loaded. You can adjust to generate more or less frequently depending on circumstances. Once the static HTML is generated, you can serve it however is easiest.
TripleLog