当前位置:首页 > 技术分析 > 正文内容

Node.js入门:从零开始搭建个人博客

ruisui881个月前 (03-24)技术分析3

随着互联网的快速发展,个人博客作为一种重要的网络信息载体,依然是许多开发者展示技术成果和分享经验的重要平台。使用Node.js和Express框架可以快速实现一个简洁高效的博客系统,同时也能帮助我们理解后端服务的基本原理。

本文将从零开始,手把手教你使用Node.js和Express搭建一个简单的个人博客系统。


一、项目初始化

在开始之前,我们需要确保已经安装了Node.js和npm。如果尚未安装,可以访问Node.js官网下载并安装最新版本的Node.js。

接下来,我们创建一个新的文件夹,并初始化一个Node.js项目:

mkdir my-blog && cd my-blog
npm init -y

这会生成一个package.json文件,用于管理项目的依赖和脚本。接下来,我们需要安装Express框架和其他必要的依赖:

npm install express ejs

o express: Node.js的高效轻量级Web框架。

o ejs: 一个简洁的模板引擎。


二、创建博客的基本结构

我们将在项目目录下创建以下文件和文件夹:

my-blog/
├── package.json
├── public/ # 静态资源目录(可选)
├── routes/ # 路由处理逻辑
├── views/ # 模板文件
└── app.js # 主应用文件


三、配置Express应用

在app.js中,我们需要完成以下步骤:

1. 引入Express模块:

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

2. 配置模板引擎:

app.set('view engine', 'ejs');
app.set('views', __dirname + '/views');

3. 设置静态资源目录(可选):

app.use(express.static(__dirname + '/public'));

4. 定义路由:

// 首页路由
app.get('/', (req, res) => {
res.render('index', {
title: '我的博客',
posts: [
{ id: 1, title: 'Hello World', content: '这是我的第一篇博客文章...' },
{ id: 2, title: '学习Node.js', content: 'Node.js是一门值得学习的语言...' }
]
});
});

// 文章详情页路由
app.get('/post/:id', (req, res) => {
const postId = req.params.id;
// 假设我们从数据库中获取文章数据,这里使用静态数据示例:
const posts = [
{ id: 1, title: 'Hello World', content: '这是我的第一篇博客文章...' },
{ id: 2, title: '学习Node.js', content: 'Node.js是一门值得学习的语言...' }
];

const post = posts.find(post => post.id === parseInt(postId));
if (!post) {
res.status(404).send('文章不存在');
} else {
res.render('post', {
title: post.title,
content: post.content
});
}
});

5. 启动服务器:

app.listen(port, () => {
console.log(`博客已启动,访问地址为 http://localhost:${port}`);
});


四、创建模板文件

在views/目录下创建以下EJS模板文件:

index.ejs(首页)

<!DOCTYPE html>


</span><span style='color: #FF0000; --tt-darkmode-color: #FF0C00;'><</span></strong>%= title %><strong><span style='color: #007020; --tt-darkmode-color: #4ED775;'>


<%= title %>




    <% posts.forEach(post => { %>

  • <a href="/post/<%= post.id %>"><%= post.title %>

    <%= post.content %>



  • <% }); %>


<a href="/post/1">查看更多文章



post.ejs(文章详情页)

<!DOCTYPE html>


</span><span style='color: #FF0000; --tt-darkmode-color: #FF0C00;'><</span></strong>%= title %><strong><span style='color: #007020; --tt-darkmode-color: #4ED775;'>


<%= title %>




<%= content %>



五、运行博客

启动服务器:

node app.js

打开浏览器,访问http://localhost:3000即可看到你的个人博客。


六、扩展功能

目前的博客系统非常基础,你可以根据需求添加更多功能:

1. 用户认证:使用 Passport 或其他身份验证库实现用户登录和注册。

2. 数据库集成:将文章数据存储到 MongoDB 或 MySQL 数据库中。

3. 评论功能:为每篇文章添加评论模块。

4. 富文本编辑:使用 CKEditor 等工具帮助用户更方便地撰写文章。

5. 静态资源优化:将 CSS 和 JavaScript 文件托管到 CDN,或使用Webpack进行打包。


七、部署博客

当你的博客功能完善后,可以将其部署到云服务器上(如阿里云、AWS、DigitalOcean等)。常见的部署方式包括:

1. 使用 pm2 管理进程:

npm install -g pm2
pm2 start app.js
pm2 save

2. 部署到容器化平台(如 Docker)。


总结

通过以上步骤,我们已经完成了一个简单的个人博客系统的搭建。虽然功能有限,但这个过程涵盖了Node.js和Express框架的基础知识,包括路由处理、模板引擎的使用以及基本的后端逻辑实现。

随着对技术的深入学习,你可以逐步为博客添加更多高级功能,使其更加完善和强大。无论是技术分享还是个人展示,这样一个基于 Node.js 的博客系统都能很好地满足你的需求!

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/2967.html

标签: res.render
分享给朋友:

“Node.js入门:从零开始搭建个人博客” 的相关文章

一套智能停车场收费管理系统设计方案,拓扑图VISIO格式

大家好,我是薛哥。最近VIP会员群的读者咨询停车场管理系统的规划设计方案,今天分享一个模板素材,主要里面的拓扑图可以编辑的,VISIO格式,建议收藏备用。此套完整的Word方案,VIP会员下载!智能停车场收费管理子系统1、系统概述本次停车场管理系统设计纯车牌识别系统,并可在合适的位置设置中央收费点,...

5个看起来像 MacOS 的 Linux 发行版,赶紧收藏!

既想使用 Linux,又想同时使用 Mac ?那么你可以尝试这些 Linux 发行版,你肯定会觉得自己在用 Mac 系统。1. Elementry OSElementry OS 是看起来像 Mac OS 的最好的 Linux 发行版。和 Mac 一样,这个操作系统也是为了保护隐私而设计的。因此你会得...

基于archlinux的发行版有哪些?

Arch Linux 是一个 Linux 发行版,采用滚动更新的模型,这意味着 Arch Linux 不会定期发布新版本,而是持续接收更新和升级,保持系统与最新软件版本的同步。Arch Linux 以其极简主义、简单性和用户定制为中心的特点而闻名,专注于让用户对其系统配置具有完全控制权。然而,它也以...

「图解」父子组件通过 props 进行数据交互的方法

1.组件化开发,经常有这样的一个场景,就是父组件通过 Ajax 获取数据,传递给子组件,如何通过 props 进行数据交互来实现,便是本图解的重点。2.代码的结构3.具体代码 ①在父组件 data 中存放数据 ms。 ②将父组件 data 中的数据 ms 绑定到子组件中的属性 ms。 ③子组件在 p...

gitlab简单搭建与应用

一、gitlab1、简介GitLab是利用Ruby on Rails一个开源的版本管理系统,实现一个自托管的Git项目仓库,可通过Web界面进行访问公开的或者私人项目。与Github类似,GitLab能够浏览源代码,管理缺陷和注释。可以管理团队对仓库的访问,它非常易于浏览提交过的版本并提供一个文件历...

使用cgroup限制进程资源

这里使用containerd项目中的cgroup包来实现进程资源限制。先写一个耗费一个CPU并且一秒增加10m内存的测试进程package mainimport ( "fmt" "math/rand" "time")func main() { go f...