继歌德的理念后又一习作:Nodejs网聚值得买
继歌德的理念后又一习作:Nodejs网聚值得买
网址:http://www.wjzdm.com/ 技术架构: express + mongodb + nginx 前后端模板引擎均采用号称最快的模板引擎──doT 欢迎朋友们观摩、点评!
附: 学习nodejs两周的习作:《哥德的理念》 : http://cnodejs.org/topic/4fd2bf788a3186476622ac8b
继歌德的理念后又一习作: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模板引擎构建一个商品展示网页应用。希望这个例子能够帮助你更好地理解和应用这些技术。如果你有任何问题或建议,欢迎交流讨论!