- 前端(HTML/CSS/JavaScript)filesmax.com
前端部分负责展示游戏列表、处理用户交互(如点击购买按钮)等。这里是一个简单的HTML页面示例,用于显示游戏列表。
html
Welcome to Our Game Store
<script>
// 假设这是从后端API获取的游戏数据
const games = [
{ id: 1, name: "Cyberpunk 2077", price: 59.99 },
{ id: 2, name: "The Witcher 3", price: 29.99 }
];
function displayGames(games) {
const gameList = document.getElementById('gameList');
gameList.innerHTML = ''; // Clear existing list
games.forEach(game => {
const listItem = document.createElement('li');
listItem.textContent = `${game.name} -
$$
{game.price}`;
gameList.appendChild(listItem);
});
}
displayGames(games);
// 这里可以添加更多JavaScript代码来处理用户交互,如购买按钮点击事件等
</script>
2. 后端(多种语言示例) Python (Flask) python from flask import Flask, jsonify
app = Flask(name)
假设的游戏数据,实际中应从数据库加载
games = [
{“id”: 1, “name”: “Cyberpunk 2077”, “price”: 59.99},
{“id”: 2, “name”: “The Witcher 3”, “price”: 29.99}
]
@app.route(‘/api/games’, methods=[‘GET’])
def get_games():
return jsonify(games)
启动Flask应用
if name == ‘main’:
app.run(debug=True)
JavaScript (Node.js + Express)
javascript
const express = require(‘express’);
const app = express();
// 假设的游戏数据
const games = [
{id: 1, name: “Cyberpunk 2077”, price: 59.99},
{id: 2, name: “The Witcher 3”, price: 29.99}
];
app.use(express.json());
app.get(‘/api/games’, (req, res) => {
res.json(games);
});
app.listen(3000, () => {
console.log(‘Game Store API listening on port 3000’);
});
Java (Spring Boot)
这里只给出GameController的简化示例,你需要创建一个完整的Spring Boot项目。
java
import org.springframework.web.bind.annotation.*;
import java.util.Arrays;
import java.util.List;
@RestController
@RequestMapping(“/api/games”)
public class GameController {
private static final List<Game> games = Arrays.asList(
new Game(1L, "Cyberpunk 2077", 59.99),
new Game(2L, "The Witcher 3", 29.99)
);
@GetMapping
public List<Game> getAllGames() {
return games;
}
// 假设Game是一个简单的Java类,包含id、name和price属性
static class Game {
private Long id;
private String name;
private Double price;
// 构造函数、getter和setter省略
}
}
3. 数据库(可选)
对于生产环境,你会需要一个数据库来存储游戏数据。这可以是MySQL、PostgreSQL、MongoDB等任何数据库。你需要编写