小程序前端与后端搭建

<!-- index.wxml -->
<view class="container">
  <text>{{message}}</text>
  <button bindtap="changeMessage">Change Message</button>
</view>

/* index.wxss */
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

// index.js
Page({
  data: {
    message: 'Hello, World!'
  },
  changeMessage: function() {
    this.setData({
      message: 'Hello, Mini Program!'
    });
  }
});

// server.js
const express = require('express');
const app = express();
const port = 3000;

app.use(express.json());

app.get('/', (req, res) => {
  res.send('Hello, Backend!');
});

app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});

// server.js
const cors = require('cors');
app.use(cors());

// server.js
app.get('/data', (req, res) => {
  res.json({ message: 'Hello, Frontend!' });
});