使用node.js语言写一个新闻管理系统 且需要前端显示新闻 后端可以控制管理新闻
时间: 2023-09-06 14:13:24 浏览: 57
好的,我可以给你一个简单的新闻管理系统的示例。首先,你需要安装node.js和一些相关的包。然后创建一个名为`news-management-system`的文件夹,进入该文件夹,执行以下命令:
1. 初始化npm
```bash
npm init -y
```
2. 安装express、body-parser、ejs和mongoose
```bash
npm install express body-parser ejs mongoose --save
```
3. 创建一个名为`app.js`的文件,并输入以下代码:
```javascript
const express = require('express');
const bodyParser = require('body-parser');
const ejs = require('ejs');
const mongoose = require('mongoose');
const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.set('view engine', 'ejs');
mongoose.connect('mongodb://localhost/news', { useNewUrlParser: true })
.then(() => console.log('Connected to MongoDB...'))
.catch(err => console.error('Could not connect to MongoDB...', err));
const newsSchema = new mongoose.Schema({
title: String,
content: String,
date: { type: Date, default: Date.now }
});
const News = mongoose.model('News', newsSchema);
app.get('/', async (req, res) => {
const news = await News.find().sort({ date: -1 });
res.render('index', { news });
});
app.get('/news/create', (req, res) => {
res.render('create');
});
app.post('/news/create', async (req, res) => {
const news = new News({
title: req.body.title,
content: req.body.content
});
await news.save();
res.redirect('/');
});
const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`Listening on port ${port}...`);
});
```
以上代码会创建一个express应用程序,并提供以下API:
- GET /:显示所有新闻
- GET /news/create:显示创建新闻的表单
- POST /news/create:创建新的新闻
4. 在根目录下创建一个views文件夹,并创建以下两个文件:
- index.ejs:用于显示所有新闻
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>News Management System</title>
</head>
<body>
<h1>News Management System</h1>
<a href="/news/create">Create News</a>
<hr>
<% news.forEach(function(item){ %>
<h2><%= item.title %></h2>
<p><%= item.content %></p>
<p><%= item.date.toLocaleString() %></p>
<hr>
<% }) %>
</body>
</html>
```
- create.ejs:用于创建新闻
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Create News</title>
</head>
<body>
<h1>Create News</h1>
<form action="/news/create" method="POST">
<div>
<label for="title">Title:</label>
<input type="text" id="title" name="title" required>
</div>
<div>
<label for="content">Content:</label>
<textarea id="content" name="content" required></textarea>
</div>
<div>
<button type="submit">Create</button>
</div>
</form>
</body>
</html>
```
5. 运行应用程序
```bash
node app.js
```
现在你可以在浏览器中访问`http://localhost:3000`来查看新闻列表,并通过`http://localhost:3000/news/create`来创建新闻。注意,这是一个非常简单的示例,你可以根据自己的需求进行修改和扩展。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)