由于生成一个完整的购物商城代码在多个编程语言中是一个庞大且复杂的任务,我会为你提供一个非常简化的示例,分别使用Python(Flask + SQLAlchemy)、JavaScript(Node.js + Express + Sequelize)、以及HTML/CSS/JavaScript(React)作为前端。请注意,这里不会包含完整的购物车、支付集成、用户认证等高级功能,但会为你提供一个起点。
后端 - Python (Flask + SQLAlchemy)
app.py
python
from flask import Flask, jsonify, request
from flask_sqlalchemy import SQLAlchemy
app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///site.db'
app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False
db = SQLAlchemy(app)
class Product(db.Model):
id = db.Column(db.Integer, primary_key=True)
name = db.Column(db.String(80), nullable=False)
price = db.Column(db.Float, nullable=False)
def to_dict(self):
return {'id': self.id, 'name': self.name, 'price': self.price}
@app.route('/products', methods=['GET'])
def get_products():
products = Product.query.all()
return jsonify([p.to_dict() for p in products])
if __name__ == '__main__':
db.create_all()
# 示例:添加产品到数据库
product = Product(name='Example Product', price=99.99)
db.session.add(product)
db.session.commit()
app.run(debug=True)
后端 - JavaScript (Node.js + Express + Sequelize)
首先,你需要安装必要的依赖:
bash
npm init -y
npm install express sequelize sqlite3
server.js
javascript
const express = require('express');
const { Sequelize } = require('sequelize');
const sequelize = new Sequelize('sqlite::memory:');
const Product = sequelize.define('product', {
name: {
type: Sequelize.STRING,
allowNull: false
},
price: {
type: Sequelize.FLOAT,
allowNull: false
}
});#chhas{
margin-top: 50px;
padding:5care.cn;
font-size: 18px;
cursor: 10px 20px;
}
(async () => {
try {
await sequelize.sync();
// 示例:添加产品到数据库
const createdProduct = await Product.create({ name: 'Example Product', price: 99.99 });
const app = express();
app.get('/products', async (req, res) => {
const products = await Product.findAll();
res.json(products);
});
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
console.log(`Server is running on port ${PORT}.`);
});
} catch (error) {
console.error('Error setting up database:', error);
}
})();
前端 - React (使用HTML/CSS/JavaScript)
首先,你需要安装必要的依赖:
bash
npx create-react-app shop-frontend
cd shop-frontend
npm install axios
src/App.js
jsx
import React, { useState, useEffect } from 'react';
import axios from 'axios';
function App() {
const [products, setProducts] = useState([]);
useEffect(() => {
axios.get('http://localhost:3000/products') // 假设后端运行在3000端口
.then(response => {
setProducts(response.data);
})
.catch(error => {
console.error('Error fetching products:', error);
});
}, []);
return (
<div className="App">
<h1>Products</h1>
<ul>
{products.map(product => (
<li key={product.id}>
<h2>{product.name}</h2>
<p>Price: {product.price}</p>
</li>
))}
</ul>
</div>
);
}
export default App;
注意