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

news/2024/7/10 1:38:30 标签: js, vue, html, es6, vue.js

好的代码一定有好的目录结构,本项目不同于原生html" title=vue>vue

  • 目录结构和路由
    • 所有已经开发完毕组件的封装
      • 封装http请求参考大牛的封装(使用axios)
        • 已经完成的页面
          • 待完成的页面
            • html" title=vue>vuex(状态管理)和models(业务处理)


目录结构和路由

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

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

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来开发原生html" title=vue>vue没有的功能)
在这里插入图片描述

待完成的页面

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

html" title=vue>vuexmodels_44">html" title=vue>vuex(状态管理)和models(业务处理)

html" title=vue>vuex(已完成部分)!!!!全部关联models

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

models已完成部分

1.tag.html" title=js>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.html" title=js>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.html" title=js>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.html" title=js>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()


http://www.niftyadmin.cn/n/1542374.html

相关文章

SQL SERVER 2008 镜像 主体连不到镜像数据库服务器

正常工作的数据库镜像不知什么原因造成主休连接不上镜像数据库服务器,报如下错误: 服务器网络地址 "TCP://192.168.1.4:5022" 无法访问或不存在。请检查网络地址名称,并检查本地和远程端点的端口是否正常运行。 (Microsoft SQL Ser…

什么时候可以用delete替代delete[]

针对gcc编译器 C内存分配和释放函数 //分配单个对象 operator new(std::size_t size)//分配数组对象 operator new[](std::size_t size) 这两个函数都有size参数,作为传入要分配空间的大小,内部实现完全一样。只不过在分配数组空间之前,会在前…

nuxt开发个人博客完结(代码已开源)

项目地址,喜欢的可以star github地址 项目效果图

SQL Server 2005报表服务入门(一)

源文地址:http://www.cnblogs.com/bluesky7305/archive/2007/10/23/934455.html 一、创建并部署基本报表 在开发程序中,报表总是一件繁琐工作。其实报表就是格式化数据输出,真正需要编程的地方很少。而且报表工具也比较繁琐, 要编…

用JS写的一个简单的时钟

没什么技术含量&#xff0c;单纯的想传上去。手痒了 <!DOCTYPE html> <html> <head> <meta charset"utf-8"> <title>AAA</title> <script> function startTime(){var todaynew Date();var htoday.getHours();var mtoday.g…

Vue3.0beta版本实战小demo(ref reactive torefs computed watch watcheffect vuex router)

项目首页截图 github地址 觉得写的还不错的可以给一个star

反射学习系列-反射实例应用

http://www.cnblogs.com/nuaalfm/archive/2008/09/08/1286640.html 转载于:https://www.cnblogs.com/wangshijie/archive/2009/05/14/1456467.html

经常使用的C#代码(每日更新)

欢迎使用该软件&#xff0c;软件中包括了经常使用的代码。而且每日更新。该软件还在开发中&#xff0c;O(∩_∩)O~ 目的&#xff1a; 1.提高工作效率 2.格式化代码&#xff0c;方便阅读 3.必备工具 4.偷懒专用 点击下载 无法下载请点击下面链接 http://pan.baidu.com/s/1gdQYNa…