博客系统项目：设计篇

1 由来
2 需求
3 设计
- 3.1 功能设计
- - 3.1.1 用例图
  - 3.1.2 实体类图
  - 3.1.3 实体关系图
- 3.2 数据设计
- - 3.2.1 数据模型
- 4 版面设计
- - 4.1 首页版面
  - 4.2 详情页版面

1 由来

博客在2021年的今天已经不是一个新鲜的词汇，如果用一句话概述，就是电子化信息留存，跟我们以前的日记、摘要、报纸有很多相似之处。其来来源已久，搭载着网络这片土壤，生根发芽，茁壮生长。从最早的文字到图片到音频再到视频，一直是博客的范畴。还有近期火起来的vblog,视频的盛行。作为一个自称是技术出身的人员，写博客是一个不错的习惯，制作一个个人的博客也一直以来是自己的一个愿想，现在成熟的博客平台为我们提供了个性化和易用的服务，简单到我们拿来即用。制作一个博客的成本和时间就显得有点不那么必要了。但是有的时候其实有没有必要、合不合算往往成我们想法由来的第一道墙，很多想法都因为这道墙而从梦中的执念回到现实。其实这种问题用一句话就可以劝勉自己：但行好事，莫问前程。

博客（英语：Blog）是一种在线日记型式的个人网站，借由张帖子章、图片或视频来记录生活、抒发情感或分享信息[1]。博客上的文章通常根据张贴时间，以倒序方式由新到旧排列。

许多博客作者专注评论特定的课题或新闻，其他则作为个人日记。一个典型的博客结合了文字、图像、其他博客或网站的超链接、及其它与主题相关的媒体。能够让读者以互动的方式留下意见，是许多博客的重要要素。大部分的博客内容以文字为主，也有一些博客专注艺术、摄影、视频、音乐、播客等各种主题。博客是社交媒体网络的一部分。

信息的碎片化和泛滥化对我们的专注力产生了很大的挑战。对博客的要求也从单纯的文字记载向多元化，多媒体进行了延伸，个人博客平台慢慢的变成了个人的信息控制台。其实更多的还是个人的心结，博客的制作是一个贯穿全过程的软件设计开发部署流程。可以作为对自己技术的一个总结和技术路上的一个记录旅程。
本篇以制作个人博客的过程记录。分为三个部分：

博客的设计
博客的编码
博客的部署

2 需求

用博客干什么？要解决的问题？
记录工作生活中信息

3 设计

设计包括功能设计、数据模型设计、版面设计。
设计工具说明

工具	设计
StarUML	功能设计-用例图
StarUML	功能设计-实体类图
StarUML	功能设计-实体关系图
Navicat	数据设计-库表设计
diagrams	版面设计-原型图设计

3.1 功能设计

3.1.1 用例图

系统最终是需要人来使用的，系统设计通过功能来满足使用人员的需要。功能设计中使用用例图表示系统的参与人员与系统功能之间的联系。
系统分为两个角色：用户可游客用户：登录系统、创建文章、编辑文章、删除文章、查看文章、发表评论、查看评论、退出游客：查看文章、发表评论确认了系统的参与人员和系统的功能模块，下面进一步到实现功能的实体类中。

3.1.2 实体类图

实体类图是系统中归纳出的实体与实体的关系，从系统中可以抽象出5个实体类：

实体类
Article	文章
Category	分类
Tag	标签
Comment	评论
User	用户

关系说明

关系	说明
User—Article	用户发布文章
User—Comment	用户发表评论
Article—Category	文章隶属于一个分类
Article—Tag	文章添加标签
Article—Comment	评论是针对文章

实体类图标识了各个实体类之间的宽泛的关系，接下来进一步明确设计实体之间的详细的关系，进入到实体关系图

3.1.3 实体关系图

实体关系图学名E-R图也称实体-联系图(Entity Relationship Diagram)，提供了表示实体类型、属性和联系的方法，用来描述现实世界的概念模型。它是描述现实世界关系概念模型的有效方法。是表示概念关系模型的一种方式。

关系说明

关联实体	被关联实体	关系	关联字段
用户	文章	1对多	user_id
用户	评论	1对多	user_id
文章	用户	1对1	user_id
文章	评论	1对多	comment_id
文章	分类	1对1	category_id
文章	标签	1对多	tag_id
评论	文章	1对1	comment_id
分类	文章	1对多	category_id
标签	文章	1对多	tag_id
评论	用户	1对1	user_id

说明：
关联实体用户对被关联实体文章：一个用户可以发布多篇文章。
关联实体文章对被关联实体用户：一篇文章对应一个用户。

3.2 数据设计

3.2.1 数据模型

1、文章数据模型

分类表

标签表

评论表

用户表

4 版面设计

页面设计又称版面设计，包括主页、详情页、列表页、
主页采用半屏式设计风格
超级头版风格最突出的特点就是博客首页的大banner，通常占据很大一块面积，甚至是全屏，比如现在的博客风格。关于这种类型的作品，在国外的一些博客主题设计中，是十分常见的，甚至一些商业化的展示网站都渐渐使用这种类型的设计。通常一个精心设计的头版，会瞬间吸引住浏览者的眼球。
关于超级头版的设计，还有很多变种。比如用全屏化的 Video 来展示，更能突出我们博客的特点。

4.1 首页版面

首页中包括导航栏、banner、列表页、翻页按钮、footer

项目	功能
导航栏	快速跳转页面
banner	美化页面，吸引眼球
列表页	展示文章
翻页按钮	翻页作用
footer	版权所属、工商局备案信息

4.2 详情页版面

详情页用来展示文章的详细信息，展示文章的标题、摘要、正文信息。
导航栏、footer跟首页复用。

以上为博客系统的设计部分，下一篇中进行博客的编码实现，在编码实现阶段涉及到开发环境的介绍、开发语言的选型、开发框架的选型、数据库选型、IDE的选型、以及软件架构模式选型。

博客系统项目：设计篇相关推荐

博客系统项目：编码篇-基础篇-架构搭建
博客系统项目:编码篇-基础篇 1 背景 2 环境 2.1 环境说明 2.2 模式说明 2.2.1 MTV模式 2.2.2 MVC 3 前置工作 3.1 环境搭建 4 编码实现 4.1 项目调整 4.1 ...
个人博客系统--项目实战
个人博客系统–项目实战先附上设计文档和项目源码. 个人博客设计文档 Github 这项目大概做了十多天,其基本功能都实现了,因为没有美工的关系,界面可能有点丑,请谅解. 后台采用SSH技术,版本为: ...
02-大鸭梨博客系统数据库设计及Dapper的使用
毫无疑问,数据库的设计在一个系统中起了至关重要的作用.我们都知道,系统设计分为两部分,或者说是两个阶段,即数据库设计和功能设计.构建一个完善的系统需要这两个阶段的充分考量.周密设计.合理联接以及密切配 ...
基于ssm的个人博客系统的设计与实现(含源文件)
欢迎添加微信互相交流学习哦! 项目源码:https://gitee.com/oklongmm/biye 进入二十一世纪,以Internet为核心的现代网络积水和通信技术已经得到了飞速的发展和广泛的应用 ...
基于Spring Boot的个人博客系统的设计与实现毕业设计源码271611
目录摘要 1 绪论 1.1研究意义 1.2开发背景 1.3系统开发技术的特色 1.4论文结构与章节安排 2个人博客系统系统分析 2.1 可行性分析 2.2 系统流程分析 2.2.1数据增加流程 ...
Blog博客系统数据库设计
2019独角兽企业重金招聘Python工程师标准>>> 项目--Blog博客系统数据库设计:http://blog.163.com/sean_zwx/blog/static/1690 ...
基于python的个人博客系统的设计开题报告_基于SSM的个人博客系统设计开题报告...
本科毕业设计(论文)开题报告题目:基于SSM的个人博客系统设计与实现专题题目(若无专题则不填): 本课题来源及研究现状: 关于博客的未来:在创办了博客中国(blogchina) ...
基于python的个人博客系统的设计开题报告_基于JavaSSM框架的个人博客系统设计与实现开题报告...
1.本课题研究的意义: 研究目的: 从本质上讲,博客是一种表达个人思想.网络连接.内容,按时间排列顺序,并且不断更新的出版方式,是网络时代的个人文摘,它代表着新的生活.工作方式,更代表着新的学习方式. ...
前端 - 博客系统(页面设计)
博客系统(页面设计) 实现一个简单的博客系统. 当前先完成页面设计的部分. 通过前面学习的前端知识来构建出网页. 主要分成四个页面: 博客列表页博客正文页博客登陆页博客编辑页预期效果博客列表 ...

博客系统项目：设计篇

博客系统项目：设计篇

1 由来

2 需求

3 设计

3.1 功能设计

3.1.1 用例图

3.1.2 实体类图

3.1.3 实体关系图

3.2 数据设计

3.2.1 数据模型

4 版面设计

4.1 首页版面

4.2 详情页版面

博客系统项目：设计篇相关推荐

最新文章

热门文章