Giter Club home page Giter Club logo

blog-vue-express's Introduction

简介

一个简单的前后端分离的博客,拥有完整的接口与后台

前端:仓库 blog-vue

Vue3 + Vite + Vue Router + Pinia + Naive UI + wangEditor + axios + sass

后端:仓库 blog-server

NodeJS + Express + MongoDB + Mongoose + jsonwebtoken

后端

接口文档:API文档

  1. 登陆、注册、自动登陆校验
  2. 分类的增删改查
  3. 文章的增删改查
  4. 敏感操作(增删改)校验token
  5. API视情况返回不同的json信息

获取文章时通过携带的query参数不同,可以实现分页查询、查询指定分类的文章、标题和内容关键词搜索等

前端

  1. 路由拦截,自动登陆
  2. 完整的管理后台,文章管理、富文本编辑、分类管理
  3. 人性化的交互,加载提示、信息提示
  4. 适配移动端
  5. 表单输入内容的校验
  6. 管理员登陆状态的管理
  7. 对分类等数据进行暂存,除非进行了修改,否则不去请求后端接口
  8. 使用pinia管理状态以及对状态的操作,两个store:UserStore、PostStore
  9. 代码上,对文章列表、富文本编辑等组件的封装,方便复用

Tip

因为是个人博客,所以后端没有设计区分多用户的文章、分类管理,注册好管理员就改后端代码把注册接口堵死吧

后端config.js保存了token加密字符串、数据库连接url等配置

截图

image

image

image

image

blog-vue-express's People

Contributors

qxchuckle avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.