【博客开发】开发进度:基本界面已实现

简介: 【博客开发】开发进度:基本界面已实现

一、首页


image.png

  • 阅读摘要:好记性不如烂笔头,在互联网时代,拥抱个人的互联网记事本。未来将支持云端速递摘要到手机的功能
  • 文章锦集:我们的创作都在这儿,精彩的创作不仅是才华的横溢,更是不朽的人生。未来将支持更多社交特性
  • 图片足迹:旅行过程中的绝美风景将永远定格在记忆深处。未来将支持更多社交特性
  • 成长规划:定下我们的目标,每天更新我们的进度,让成长有迹可循。未来将支持更多社交特性
  • 关注我:与你共同见证一个快乐的 IT 从业者在帝都的逆袭之旅。
  1. 左上角logo:在任意界面回到首页
  2. 右上角个人中心:创作入口
  3. 中间图片,博客内容的分类入口
  4. 右边:个人简介




二、登录界面


image.png

  1. 点击首页的【个人中心】或者其他需要登录权限的界面,就会弹出登录界面
  2. 点击右上角关闭,可关闭登录界面
  3. 正确输入完用户名密码,点击登录,校验成功会关闭登录界面,校验失败会提示登录失败




三、阅读摘要

image.png

阅读摘要


  1. 列表展示从书籍里摘录的句子
  2. 滚动到底部,自动加载数据
  3. 支持搜索



四、文章锦集


image.png



  1. 展示创作的文章
  2. 滚动到底部,自动加载数据
  3. 支持搜索




五、个人中心


image.png

个人中心


  1. 整体布局参考简书,左侧是各项博客内容(后面皆称作:维度)分类入口
  2. 中间是维度列表,支持添加维度(对于【文章锦集】来说,就是写新的文章)
  3. 最右边是文章编辑器,本质上就是个 <textarea/>
  4. 【发布】功能,支持将写的文章公开给其他人阅读
  5. 【预览】功能,支持左侧编辑维度,右侧预览展示效果




image.png



六、代码统计

image.png


image.png



服务端代码只有 1900 行,代码重复率11.6%主要集中在 Graphql 的服务端解析函数未能抽出公用代码(是对GraphQL和go语言本身的不熟练造成),整体来说,自我感觉还是挺干练的,毕竟是需要什么才加什么,并没有使用其他人现成的代码,代码编译出可执行程序是20M 大小。


image.png


image.png



  • 客户端代码 4300 行,代码重复率 6%,看起来实现的界面并不多,但代码量比起服务端可多多了,这也验证了一个事实:服务端比客户端更接近底层,越底层的代码抽象度越高,代码量越少。



七、总结


本次博客开发基本告一段落,个人博客的文章展示、编辑、发布等基础功能已经完成,以后每次简书写完文章,都可以同步到自己的个人博客。


博客开发项目启动时间从 2022 年 12 月 21 日开始算,到今天 2023 年 1 月 7 日,可以算是博客开发项目一期已完结。当然了,各项功能并不是很完善,但半个月时间勉强算是实现了个小需求,将应用开发的前前后后涉及到的各个技术点,再次巩固了一遍。





下一步


实现手机端,计划使用前端技术:Taro,实现手机浏览器访问,和小程序访问;

实现评论功能;

实现阅读量、评论数、点赞量等社交数据统计;


















目录
相关文章
一键自动化博客发布工具,用过的人都说好(51cto篇)
使用一键自动化博客发布工具blog-auto-publishing-tools把博客发布到51cto上。
一键自动化博客发布工具,用过的人都说好(51cto篇)
|
6月前
|
Web App开发
一键自动化博客发布工具,用过的人都说好(简书篇)
给大家推荐一个一键自动化博客发布工具,完全的一键操作,让你轻松告别手动发布博客的烦恼。
|
11月前
|
数据库
【博客项目】—登录功能实现( 四)
【博客项目】—登录功能实现( 四)
|
IDE JavaScript 前端开发
个人软件思维导图介绍。下载在以后的博客中。本博客是展示软件页面。(一)
个人软件思维导图介绍。下载在以后的博客中。本博客是展示软件页面。
120 0
个人软件思维导图介绍。下载在以后的博客中。本博客是展示软件页面。(一)
|
应用服务中间件
个人软件思维导图介绍。下载在以后的博客中。本博客是展示软件页面。(二)
个人软件思维导图介绍。下载在以后的博客中。本博客是展示软件页面。
101 0
个人软件思维导图介绍。下载在以后的博客中。本博客是展示软件页面。(二)
|
域名解析 弹性计算 资源调度
工具分享【一】5分钟搭建自己的博客
本文利用vuePress快速构建大气好看的个人博客,vuePress是由Vue 驱动的静态网站生成器,可以基于markdown语法生成网页,君哥的个人博客就是由vuepress构建
396 0
工具分享【一】5分钟搭建自己的博客
|
数据库 数据安全/隐私保护
5、后台基础权限框架搭建实现[木字楠博客]
5、后台基础权限框架搭建实现[木字楠博客]
89 0
5、后台基础权限框架搭建实现[木字楠博客]
|
弹性计算 人工智能 大数据
我的博客网站初体验
利用博客网站编写和呈现新闻,融合多种媒介,综合性的呈现信息,既满足了当下人们的阅读习惯,也丰富了内容的呈现形式,让一个事件、一个故事变得更加立体、丰富。利用网站编写融合新闻将成为我创建云场景、构建云服务的起点,未来我会充分利用博文网站平台,结合自己的专业讲好生活中的好故事。另外,继续探索新的云服务领域,例如AI、编程、大数据等,文科生也可以“牛”起来。
|
JSON IDE 前端开发
博客升级之在线代码编辑器
最近打算对个人博客进行优化,主要涉及两个方面,文章编辑器和代码展示分享模块,因此就需要考虑选择什么样的在线编辑器,顺道总结一下在线代码编辑及分享一些可能用得上的优秀代码编辑器。
541 0
博客升级之在线代码编辑器
|
数据采集 搜索推荐 Shell
Hexo博客功能扩展 - 菜单,SEO以及作者信息
Hexo博客功能扩展 - 菜单,SEO以及作者信息
210 0