I’m trying to go from a JSX page to an HTML page, but I always get an error when I try to do so. Always a 404 page saying it doesn’t exist. It’s as if it doesn’t exist although I have it clearly in my files and in the same directory.
games.jsx
import React from "react";
import { useEffect, useState } from "react";
import moment from 'moment';
import Link from 'next/link';
export default function Home() {
const[dataResponse, setdataResponse] = useState([]);
useEffect(() => {
async function getPageData() {
const apiUrlEndpoint = 'http://localhost:3000/api/games';
const response = await fetch(apiUrlEndpoint);
const res = await response.json();
console.log(res.games);
setdataResponse(res.games);
}
getPageData();
}, []);
return (
<div className='bg-gray-100 min-h-screen'>
<a href="newgame.html">Click to Add New Game Product.</a>
{dataResponse.map((games) => {
var d = new Date(games.DateWhenAdded);
var now = moment(d).format('l');
return (
<div key= {games.ProductID}>
<div>{games.ProductName}</div>
<div>
<img src={games.ProductImage} width="400" height="400" alt=""/>
</div>
<div>
{games.ProductDescription}
</div>
<div>
Product added on: {now}
</div>
<div>
Product price: ${games.ProductPrice}
</div>
</div>
)
})}
</div>
);
}
And this is the form I’m trying to redirect to. It’s called "newgame.html"
<!DOCTYPE html>
<html lang = "en">
<head>
<title>
New Game Addition
</title>
</head>
<body>
<form method="post" action="dbcon.php">
<input type="number" name="ProductID" placeholder="Product ID">
<input type="text" name="ProductName" placeholder="Name of Product.">
<input type="text" name="ProductDescription" placeholder="Describe the Product.">
<input type="file" name="ProductImage" placeholder="Put in Image">
<input type="date" name="DateWhenAdded" placeholder="01/01/2001">
<input type="submit" name="submit" value="SUBMIT">
</form>
</body>
</html>
If you can give me any suggestions on what I should try, that would be greatly appreciated. Thank you.
>Solution :
Put the newgame.html file into your public folder…
This folder is also useful for
robots.txt,favicon.ico, Google Site Verification, and any other static files (including.html)!
and use the following
<a href="/newgame.html">Click to Add New Game Product.</a>
Note the URL starts with /.