SSR渲染开发个人博客V1.0.0后台使用koa(开发中已经封装大量组件更新到本项目完结)


目录结构和路由

在这里插入图片描述
在这里插入图片描述

所有已经开发完毕组件的封装

1.switch-theme
在这里插入图片描述
2.desktop-nav(PC端适配)
在这里插入图片描述
3.page-header
在这里插入图片描述
4.page-footer
在这里插入图片描述
5.split-line
在这里插入图片描述
6.detail-header
在这里插入图片描述
7.article-list
在这里插入图片描述
8.tag-detail
在这里插入图片描述
9.empty(当没有文章的时候显示)使用pulugin全局挂载(无需引入)
在这里插入图片描述
在这里插入图片描述

封装http请求参考大牛的封装(使用axios)

在这里插入图片描述

已经完成的页面

1.tag标签页(分为标签页和分类页)
在这里插入图片描述
2.标签页
在这里插入图片描述
3.分类页(未完成)

4.关于我们
在这里插入图片描述
5.关于我们某个人(使用_id来开发原生vue没有的功能)
在这里插入图片描述

待完成的页面

1.主页(轮播图实现)2.分类 3.留言墙 4.搜索

vuex(状态管理)和models(业务处理)

vuex(已完成部分)!!!!全部关联models

1.app.js(处理switch-theme主题切换使用缓存)
在这里插入图片描述
2.about.js 获取作者信息和相关文章和更多文章(LoadMore)
在这里插入图片描述
3.获取友链 friend.js
在这里插入图片描述
4.tag.js 获取标签和分类和文章列表和更多文章(LoadMore)
在这里插入图片描述

models已完成部分

1.tag.js

import {
  get
} from '@/services/http/axios'

class Tag {
  // 获取所有标签
  async getTags() {
    const res = await get('v1/blog/tag/tags')
    return res
  }
}

export default new Tag()

2.category.js

import {
  get
} from '@/services/http/axios'

class Category {
  // 获取所有分类
  async getCategories() {
    const res = await get('v1/blog/category/categories')
    return res
  }

  // 获取分类详情
  async getCategory(id) {
    const res = await get('v1/blog/category', {
      id
    })
    return res
  }
}

export default new Category()

3.friend.js

import {
  get
} from '@/services/http/axios'

class Blog {
  async getFriends() {
    const res = await get('v1/blog/blog/friend/friends')
    return res
  }
}

export default new Blog()

4.author.js

import {
  get
} from '@/services/http/axios'

class Author {
  // 获取所有作者
  async getAuthors() {
    const res = await get('v1/blog/author/authors')
    return res
  }

  async getAuthorDetail(id) {
    const res = await get('v1/blog/author/detail', {
      id
    })
    return res
  }
}

export default new Author()

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值