使用Nodejs开发的链接分享网站

使用Nodejs开发的链接分享网站

kproto.me 分享小朋友喜欢的内容

7 回复

使用Node.js开发的链接分享网站

在本篇帖子中，我们将探讨如何使用Node.js开发一个简单的链接分享网站。该网站允许用户提交他们喜欢的链接，并且可以查看其他用户的分享。我们将使用Express框架来构建后端服务，并使用MongoDB作为数据库来存储链接数据。

1. 环境搭建

首先，确保你已经安装了Node.js和npm（Node包管理器）。接下来，创建一个新的项目目录并初始化项目：

mkdir link-sharing-app
cd link-sharing-app
npm init -y

安装所需的依赖库：

npm install express mongoose body-parser ejs
  • express：用于构建Web应用。
  • mongoose：MongoDB的对象模型工具。
  • body-parser：解析HTTP请求体。
  • ejs：视图引擎。

2. 创建服务器

创建一个名为app.js的文件，用于设置Express服务器和路由：

const express = require('express');
const bodyParser = require('body-parser');
const mongoose = require('mongoose');
const app = express();

// 连接到MongoDB
mongoose.connect('mongodb://localhost/link-sharing', { useNewUrlParser: true, useUnifiedTopology: true });

// 定义Link模型
const LinkSchema = new mongoose.Schema({
    title: String,
    url: String
});
const Link = mongoose.model('Link', LinkSchema);

// 设置视图引擎
app.set('view engine', 'ejs');

// 使用body-parser中间件
app.use(bodyParser.urlencoded({ extended: true }));

// 路由定义
app.get('/', async (req, res) => {
    const links = await Link.find();
    res.render('index', { links });
});

app.post('/submit', async (req, res) => {
    const { title, url } = req.body;
    await Link.create({ title, url });
    res.redirect('/');
});

app.listen(3000, () => console.log('Server is running on port 3000'));

3. 视图模板

创建一个名为views的目录，并在其中创建一个名为index.ejs的文件，用于渲染主页：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Link Sharing App</title>
</head>
<body>
    <h1>Share Your Favorite Links</h1>
    <form action="/submit" method="POST">
        <input type="text" name="title" placeholder="Title" required>
        <input type="url" name="url" placeholder="URL" required>
        <button type="submit">Submit</button>
    </form>
    
    <ul>
        <% links.forEach(link => { %>
            <li><a href="<%= link.url %>"><%= link.title %></a></li>
        <% }) %>
    </ul>
</body>
</html>

4. 启动应用

运行你的应用：

node app.js

现在，你可以在浏览器中访问http://localhost:3000，看到一个简单的链接分享网站，用户可以提交他们喜欢的链接，并查看其他用户的分享。

通过以上步骤，我们成功地使用Node.js、Express和MongoDB搭建了一个简单的链接分享网站。


很漂亮

这股风潮这么劲？

很喜欢

nice

蛮好看的

使用Node.js开发的链接分享网站

创建一个简单的链接分享网站可以帮助用户分享他们感兴趣的内容。我们可以使用Node.js和一些流行的库来实现这个功能。以下是一个简化的示例，展示如何构建一个基本的链接分享网站。

1. 技术栈选择

  • Node.js - 后端运行环境。
  • Express.js - 用于搭建Web服务器和处理路由。
  • MongoDB - 数据库存储链接信息。
  • EJS - 视图模板引擎。

2. 安装依赖

首先，初始化项目并安装必要的依赖：

mkdir link-share-site
cd link-share-site
npm init -y
npm install express ejs mongoose body-parser

3. 创建项目结构

.
├── app.js
├── models
│   └── Link.js
├── views
│   ├── index.ejs
│   └── add.ejs
└── package.json

4. 实现核心功能

app.js

const express = require('express');
const bodyParser = require('body-parser');
const mongoose = require('mongoose');

const app = express();
const port = process.env.PORT || 3000;

// 连接数据库
mongoose.connect('mongodb://localhost:27017/linkshare', {
  useNewUrlParser: true,
  useUnifiedTopology: true
});

// 模型定义
const LinkSchema = new mongoose.Schema({
  title: String,
  url: String
});
const Link = mongoose.model('Link', LinkSchema);

// 设置视图引擎
app.set('view engine', 'ejs');

// 中间件
app.use(bodyParser.urlencoded({ extended: true }));
app.use(express.static('public'));

// 路由
app.get('/', async (req, res) => {
  const links = await Link.find({});
  res.render('index', { links });
});

app.get('/add', (req, res) => {
  res.render('add');
});

app.post('/add', async (req, res) => {
  const link = new Link({
    title: req.body.title,
    url: req.body.url
  });
  await link.save();
  res.redirect('/');
});

// 启动服务
app.listen(port, () => {
  console.log(`Server running on http://localhost:${port}`);
});

models/Link.js

const mongoose = require('mongoose');

const LinkSchema = new mongoose.Schema({
  title: String,
  url: String
});

module.exports = mongoose.model('Link', LinkSchema);

views/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Link Share Site</title>
</head>
<body>
  <h1>Links</h1>
  <ul>
    <% links.forEach(link => { %>
      <li>
        <a href="<%= link.url %>"><%= link.title %></a>
      </li>
    <% }) %>
  </ul>
  <a href="/add">Add a link</a>
</body>
</html>

views/add.ejs

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Add Link</title>
</head>
<body>
  <h1>Add a new link</h1>
  <form action="/add" method="post">
    <label for="title">Title:</label>
    <input type="text" id="title" name="title" required><br>
    <label for="url">URL:</label>
    <input type="url" id="url" name="url" required><br>
    <button type="submit">Submit</button>
  </form>
</body>
</html>

5. 启动应用

在命令行中运行：

node app.js

然后访问 http://localhost:3000 查看效果。

以上就是一个简单的链接分享网站的实现，它允许用户添加链接，并在首页显示所有已添加的链接。

回到顶部