34 lines
1.2 KiB
HTML
34 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Simple Frontend</title>
|
|
<script>
|
|
function fetchData() {
|
|
fetch('http://localhost:8000/api/games')
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
// Assuming 'data' is an array of games
|
|
const display = document.getElementById('data-display');
|
|
display.innerHTML = ''; // Clear previous content
|
|
data.forEach(game => {
|
|
const listItem = document.createElement('li');
|
|
listItem.textContent = game.name; // Modify as per your data structure
|
|
display.appendChild(listItem);
|
|
});
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
document.getElementById('data-display').textContent = 'Error loading data';
|
|
});
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<h1>Welcome to the Proof of Concept Frontend</h1>
|
|
<button onclick="fetchData()">Fetch Data from Backend</button>
|
|
<div id="data-display"> <!-- Data will be displayed here -->
|
|
<!-- Fetched data will be inserted here -->
|
|
</div>
|
|
</body>
|
|
</html>
|