基于vueBlog的个人博客系统使用指南

基于vueBlog的个人博客系统使用指南

vueBlog vue + node + express + mongodb 个人博客系统 项目地址: https://gitcode.com/gh_mirrors/vue/vueBlog

项目基础介绍和主要编程语言

vueBlog是一个个人博客系统项目，采用当前流行的前端框架Vue.js结合Node.js后端技术，使用Express作为后端框架，以及Mongoose与MongoDB进行数据交互。项目将前端与后端分离，前端主要负责展示和与用户交互，后端负责业务逻辑处理和数据库操作。该项目使用Markdown编辑器，支持用户注册和登录系统，用户可以创建、修改、删除文章，并可以为文章添加标签。

主要编程语言和工具包括：

• Vue.js（前端框架）
• Node.js（后端平台）
• Express（后端框架）
• Mongoose（MongoDB对象模型工具）
• MongoDB（文档型数据库）

新手在使用这个项目时需要特别注意的3个问题和解决步骤

问题1：如何正确设置开发环境

解决步骤：

1. 克隆项目到本地：

   git clone ***
   

2. 安装项目依赖：

   cd vueBlog
   npm install
   

3. 启动MongoDB服务：

   mongod
   

4. 启动应用服务器：

   node app
   

5. 启动前端开发服务器：

   npm run dev
   

确保数据库和服务器均能正常启动，否则前端页面可能无法正确加载数据或出现错误。

问题2：项目启动后无法看到首页

解决步骤：

1. 确认是否有浏览器兼容性问题。vueBlog支持主流浏览器，如Chrome、Firefox等。
2. 查看控制台错误信息，可能会有资源加载失败或JavaScript错误。
3. 检查后端服务和数据库是否正常运行。可以检查端口监听情况（通常为MongoDB的默认端口27017和Node.js的端口3000）。
4. 如果以上步骤无误，可以尝试清除浏览器缓存或使用私密模式访问。

问题3：如何在本地编辑和预览文章

解决步骤：

1. 找到项目中src文件夹下的Markdown文件，这些文件代表博客文章。
2. 根据Markdown语法编辑内容。项目支持Markdown编辑器，可通过特定的语法来添加标题、链接、图片等元素。
3. 本地运行项目，通过前端开发者模式（npm run dev），即可看到所编辑内容的实时预览。
4. 如果需要添加文章标签，编辑时在对应文章的Markdown文件中添加标签信息，然后保存。

确保遵循Markdown的语法规则进行编辑，避免格式错误导致预览效果不正确。如果遇到具体问题，可以查看项目中的README.md文件，通常会有关于如何使用项目的详细说明。

vueBlog vue + node + express + mongodb 个人博客系统 项目地址: https://gitcode.com/gh_mirrors/vue/vueBlog