I’ve tried to figure out how to do it and I give up. I’m trying to code something that allows users to visit my github website and type into a textbox, then the website stores their output into a text file located into the website. I found out you could use a node.js module “fs” to append text into that file, so I tried to implement it. But its just not working no matter what I try. Right now, its giving me the error “require() is not a function” and I seriously don’t understand what the problem is. Any help would be appreciated.
My code: (Pasting the entire html file, just for better help.)
<html><head>
<meta property="og:title" content="OTFT: The Videogame Official Website">
<meta property="og:description" content="The Official Website for OTFT!">
<meta property="og:image:secure_url" content="https://otft.github.io/otft_tvg/images/OTFTSquare.png">
<title>OTFT: The Videogame</title>
<link rel="icon" href="../images/iconv1.png">
<style>
h1 {
font-size: 50px;
font-family: FlamingHope;
}
h2 {
font-size: 40px;
font-family: Blackentina;
}
body {
padding:0;
margin:0;
width:100%;
height:100%;
background-image: url("../images/WebsiteBackground02.png");
background-size: cover;
background-repeat: repeat-y;
background-position: center;
background-color: rgba(0,0,0,0.6);
}
p {
font-family: Tomorrow;
font-size:25px;
}
text {
font-family: Blackentina;
font-size:70px;
color:red;
offset-position:50px;
}
a {
font-family: Blackentina;
font-size: 30px;
color:red;
}
div {
display: block;
unicode-bidi: isolate;
}
@font-face {
font-family: FlamingHope;
src: url("../FlamingHope.ttf") format("opentype");
}
@font-face {
font-family: AnotherDanger;
src: url("../another danger.otf") format("opentype");
}
@font-face {
font-family: AnotherDanger;
font-weight: italics;
src: url("../another danger italics.otf") format("opentype");
}
@font-face {
font-family: Blackentina;
src: url("../Blackentina 4F.ttf") format("opentype");
}
@font-face {
font-family: Blackentina;
font-weight: italics;
src: url("../Blackentina 4F-Italic.ttf") format("opentype");
}
@font-face {
font-family: Tomorrow;
src: url("../Tomorrow.ttf") format("opentype");
}
@font-face {
font-family: Tomorrow;
font-weight: italics;
src: url("../Tomorrow-Italic.ttf") format("opentype");
}
@font-face {
font-family: Tomorrow;
font-weight: bold;
src: url("../Tomorrow-Bold.ttf") format("opentype");
}
</style>
</head><body><center><div id="headerthingie" style="background-color: black;color: white;display: flex;justify-content: center;align-items: center;flex-direction: column;"><h1 style="font-size:40px;">OTFT: The Videogame</h1><template id="weblinksDiv"></template><script type="text/javascript" src="../reusedivfix.js"></script></div>
<div style="width:700px;display: block;"><h1>FAQ</h1>
<p>For now, the FAQ will be stored in a file that I will check for new entries! Later on, I will update the website to display the questions.</p>
<textarea id="inputQuestion" rows="4" cols="50" placeholder="Question goes here..."></textarea>
<br>
<input type="submit" value="Submit" onclick="submitData()">
</center>
<br>
<div id="footerthingie" style="background-color: black;color: white;display: flex;justify-content: center;align-items: center;flex-direction: column;position: relative;bottom: 0px;width: 100%;"><template id="weblinksDiv01"></template><script type="text/javascript" src="../reusablesubdiv.js"></script><p style="height:20px;font-size:20px;">ⓒ OTFT Studios 2024</p></div>
</body>
<script type="module">
window.submitData = submitData();
import * as require from 'https://requirejs.org/docs/release/2.3.5/minified/require.js';
function submitData() {
var fs = require('node:fs');
let newData = "n" + document.getElementById("inputQuestion").value;
fs.appendFile('storeduserdata.txt', newData, (err) => {
if (err) throw err;
})
}
</script>
</html>
I tried a couple things, like double checking spelling, or my semi-colons, or reorganizing where everything goes. I’ve also consulted google to try and find my way around coding this, but now I’m stuck here.