I am making a little set of 'apps' for my little brother (as a learning experience)
but i have a problem... I cant get a list of all the apps
this (of course) means i need to get all directories in a directory, but i made this in vanilla js and i don't know much about http requests
i will also be fine if you answer a way to use fs in the frontend
(if you click the links it is supposed to redirect you... that only works for me since i cant and dont need to put ALL the code)
const apps = ['foo', 'bar'] // this is where all the apps are supposed to be
const ul = document.querySelector("ul")
apps.forEach(app => {
const el = document.createElement("li")
el.innerHTML = `<a href="/apps/${app}">${app}</a>`
ul.appendChild(el)
})
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@600&display=swap');
* {
font-family: 'Open Sans', sans-serif;
margin: 0;
padding: 0;
color: white;
text-align: center;
background-color: #333;
border: none;
font-size: large;
}
ul {
margin-top: 5%;
}
li, a {
list-style: none;
text-transform: capitalize;
text-decoration: none;
margin-bottom: 1%;
transition: color 500ms;
}
a:hover {
color: gray;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<script src="script.js" defer></script>
<title>Webbed Tools</title>
</head>
<body>
<ul></ul>
</body>
</html>