惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

阮一峰的网络日志
阮一峰的网络日志
Blog — PlanetScale
Blog — PlanetScale
B
Blog RSS Feed
L
LangChain Blog
Jina AI
Jina AI
爱范儿
爱范儿
C
Check Point Blog
云风的 BLOG
云风的 BLOG
Last Week in AI
Last Week in AI
月光博客
月光博客
GbyAI
GbyAI
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
Stack Overflow Blog
Stack Overflow Blog
V
V2EX
A
About on SuperTechFans
有赞技术团队
有赞技术团队
Microsoft Azure Blog
Microsoft Azure Blog
The GitHub Blog
The GitHub Blog
博客园 - Franky
Apple Machine Learning Research
Apple Machine Learning Research
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Google DeepMind News
Google DeepMind News
博客园 - 三生石上(FineUI控件)
S
SegmentFault 最新的问题

webfem

如何解决 Unexpected token = Turn Videos into AI Video Prompts:把视频变成可复用创意库 写作平台字数怎么算?公众号、论文和网文的统计口径 字数、字符数和英文单词数有什么区别?一次说清统计口径 中文字数统计是否包括标点?不同场景的计算口径说明 react-virtualized AutoSizer 实现原理详解 - webfem JWT技术详解:从入门到精通 - webfem 如何在电脑上调试手机网页 - webfem react-virtualized 的用法详解 - webfem MongoDB 入门详解 - webfem react-virtualized 无限列表图片闪屏问题修复 - webfem 博客搭建-创建文章接口 - webfem 代码相似性检查机制 - webfem WebSocket 技术详解:实时通信的利器 - webfem 小米YU7购车记-新能源购置税计算器的诞生 - webfem 博客搭建-项目工程搭建 - webfem Base64编码详解:原理、应用与实践 - webfem 字数统计算法深度解析:从Unicode到实际应用的硬核技术实现 - webfem 衬线体与无衬线体:字体设计的经典对决 - webfem 如何把 小程序 转换为 VUE - webfem 性能优化-核心指标-FP - webfem MD5算法原理及其实现 - webfem 性能优化-核心指标-SI 的介绍与优化 - webfem 如何设计一个后端管理平台 - webfem
手动搭建个人博客 - webfem
yimin,2316114920@qq.com · 2025-10-09 · via webfem

背景

前面,我们讲了如何用 hexo 搭建个人博客。这种方式适合只要写文章分享的同学。对于爱折腾的同学,当然是要自己手动搭建个人博客才有成就感。自己搭建博客还能学习前后端一体的全栈开发方式,一举两得。

下面,我们通过多个教程,一步步搭建起属于自己的博客系统。

技术选型

服务端

  1. 服务端框架:express
  2. 数据库:mongodb + redis
  3. 日志服务:log4js
  4. 模板:ejs

使用 express 的核心原因还是因为它足够简单,便于新人上手。

管理后台

  1. 前端框架:vue3 + arco
  2. 路由:vue-router
  3. 状态管理:pinia

技术架构

技术架构图

环境准备

在开始之前,确保你的电脑已经安装了 nodejs、 express、mongodb、redis 这四个开发工具。

  1. nodejs 安装 nodejs 下载
  2. express 安装 express 下载
  3. redis 安装 redis 下载
  4. mongodb 安装 mongodb 安装

接下来我们开始搭建博客系统的服务端。

原文地址:https://webfem.com/post/website,转载请注明出处