继歌德的理念后又一习作:Nodejs网聚值得买

继歌德的理念后又一习作:Nodejs网聚值得买

网址:http://www.wjzdm.com/ 技术架构: express + mongodb + nginx 前后端模板引擎均采用号称最快的模板引擎──doT 欢迎朋友们观摩、点评!


附: 学习nodejs两周的习作:《哥德的理念》 : http://cnodejs.org/topic/4fd2bf788a3186476622ac8b


3 回复

继歌德的理念后又一习作:Nodejs网聚值得买

网址:

技术架构:

  • Express: 一个简洁而灵活的 Node.js Web 应用程序框架。
  • MongoDB: 一个基于分布式文件存储的数据库。
  • Nginx: 一个高性能的 HTTP 和反向代理服务器。

前后端模板引擎:

  • doT: 一种号称最快的模板引擎。

示例代码

以下是一个简单的 Express 应用程序示例,用于展示如何使用 Express 框架来构建一个基本的 Web 应用程序。

const express = require('express');
const app = express();
const port = 3000;

// 设置模板引擎为 doT
app.set('view engine', 'dot');

// 静态文件服务
app.use(express.static('public'));

// 路由定义
app.get('/', (req, res) => {
    // 渲染 doT 模板
    res.render('index.dot', { title: '值得买', content: '欢迎来到值得买网站!' });
});

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

解释

  • Express: 使用 express 模块创建一个应用实例 app
  • 模板引擎设置: 使用 app.set('view engine', 'dot') 将模板引擎设置为 doT
  • 静态文件服务: 使用 express.static 中间件提供静态文件服务(例如 CSS 文件)。
  • 路由: 定义一个根路径 / 的 GET 请求处理函数。该函数使用 res.render 方法渲染 index.dot 模板,并传递数据对象 { title: '值得买', content: '欢迎来到值得买网站!' }
  • 启动服务器: 使用 app.listen 方法启动服务器,监听指定端口。

doT 模板示例

假设你有一个 index.dot 模板文件:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{=it.title}}</title>
</head>
<body>
    <h1>{{=it.content}}</h1>
</body>
</html>

解释

  • {{=it.title}}: 这是 doT 模板语法,用于插入传递给模板的数据中的 title 属性。
  • {{=it.content}}: 类似地,插入 content 属性。

通过上述代码和配置,你可以搭建一个简单的 Node.js Web 应用程序,使用 Express 和 doT 模板引擎,配合 MongoDB 数据库和 Nginx 服务器,实现一个基本的 “值得买” 网站。希望这能帮助你理解和实现你的项目!


我没有申请易讯联盟。

继歌德的理念后又一习作:Nodejs网聚值得买

简介

本项目旨在实现一个简单的网页应用,展示值得购买的商品信息。使用的技术栈包括 Express 框架、MongoDB 数据库以及 nginx 作为反向代理服务器。前端和后端均采用高性能的模板引擎 doT

技术栈

  • Node.js: 后端运行环境。
  • Express: Web应用框架。
  • MongoDB: 数据库,存储商品信息。
  • nginx: 反向代理服务器,提高性能和安全性。
  • doT: 前后端模板引擎,号称最快。

示例代码

安装依赖

首先,确保已安装 Node.js 和 npm(Node包管理器)。

npm install express mongodb dot
创建Express应用

创建 app.js 文件,并编写以下代码:

const express = require('express');
const MongoClient = require('mongodb').MongoClient;
const dot = require('dot');

const app = express();
const url = 'mongodb://localhost:27017'; // MongoDB连接字符串
const dbName = 'wjzdm'; // 数据库名称

// 连接MongoDB
MongoClient.connect(url, { useNewUrlParser: true, useUnifiedTopology: true }, (err, client) => {
    if (err) throw err;
    console.log("Connected successfully to server");
    const db = client.db(dbName);

    // 获取商品数据
    app.get('/products', async (req, res) => {
        const products = await db.collection('products').find().toArray();
        res.send(products);
    });

    // 渲染页面
    app.get('/', async (req, res) => {
        const products = await db.collection('products').find().toArray();

        const template = doT.template('<div><h1>{{=it.title}}</h1><p>{{=it.price}}</p></div>');
        const renderedHTML = products.map(product => template(product)).join('');

        res.send(renderedHTML);
    });
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});
配置doT模板引擎

确保 doT 模板引擎正确配置和使用。你可以通过以下方式在前端渲染模板:

<script src="path/to/doT.min.js"></script>
<script id="product-template" type="text/x-dot-template">
  <div>
    <h1>{{=it.title}}</h1>
    <p>{{=it.price}}</p>
  </div>
</script>

<script>
  var source = document.getElementById('product-template').innerHTML;
  var template = doT.template(source);
  var data = {title: 'Product Title', price: 'Price'};
  var html = template(data);
  document.body.innerHTML += html;
</script>
配置nginx

/etc/nginx/sites-available/default 中添加以下配置:

server {
    listen 80;
    server_name yourdomain.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

重启nginx服务:

sudo systemctl restart nginx

结语

这个简单的示例展示了如何使用Node.js、Express、MongoDB和doT模板引擎构建一个商品展示网页应用。希望这个例子能够帮助你更好地理解和应用这些技术。如果你有任何问题或建议,欢迎交流讨论!

回到顶部