仿简书博客开发

作者: real_ting | 来源:发表于2018-11-09 19:14 被阅读243次

空闲时间写了个类似简书的博客系统,写篇文章记录一下,因为我主要是做前端的,并不会后台语言,所以对于后台数据处理这块主要使用了ExpressSequelize

主要功能

  • 注册
  • 登录(第三方github登录、邮件验证)
  • 用户管理
  • 文章管理
  • 标签管理(管理员可见)
  • 用户管理
  • 评论、回复
  • 点赞、关注
  • 个人主页
  • 设置、修改密码
  • 站内信等功能

技术栈

前端
  • Vue + Element-UI,标准的vue-cli项目。
  • Vue-router管理路由,vue-axios管理http请求。
  • 写文章那块使用的markdown编辑器,功能强大且好用,快捷方式很多。
  • 为了实现类似简书的图片预览功能,使用了vue-photo-preview插件,前面写的文章中有介绍,请参考
  • 关于项目中的图标,一部分使用Element-UI自带的,另一部分使用的是阿里的图标库iconfont.
后端
  • Node.js + Express + Sequelize
  • Sequelize 是一个基于 promise 的 Node.js ORM, 目前支持 Postgres, MySQL, SQLite 和 Microsoft SQL Server. 它具有强大的事务支持, 关联关系, 读取和复制等功能.
  • 使用Nodemailer实现发送邮件功能
  • 上传的图片上传到青云,数据库只存储图片地址

效果图

只展示主要页面


注册
登录
首页
消息页面
私信页面
个人主页

后台主页
文章详情页面评论

运行

  • cd client 进入前端目录,执行npm run dev
  • cd server 进入后端目录,执行npm start, 数据库使用的wampserver的MySql

源码地址:github,技术小白一个,代码写的比较乱,边做边学,多多交流,仅供参考。

相关文章

  • 仿简书博客开发

    空闲时间写了个类似简书的博客系统,写篇文章记录一下,因为我主要是做前端的,并不会后台语言,所以对于后台数据处理这块...

  • first

    第一此接触简书的博客是要仿作一个简书的网站当作期末作业。

  • 漫码生活

    简书不记录记录开发相关博客。请移步:我的博客我的思否

  • 做商城开发时一些收藏

    Android开发之仿淘宝商品详情页 - AnalyzeSystem的博客 - CSDN博客 GitHub - l...

  • 动画系列之——高仿简书App登录注册3D旋转

    常常会登录简书App看文章和技术博客,很喜欢简书App清新的设计。今天,仿着简书登录注册页面的3d翻转效果做了一个...

  • 手把手教你打造简书风格的精美个人博客

    废话晚点说,先上图,以下是本人天地会珠海分舵仿简书风格的博客科技向前冲: 如之前本人跟简书的“简叔”互动讨论上海的...

  • 高仿花田小憩OC版

    前段时候在简书看博客时,看到Monkey_ALin 分享的高仿花田小憩(Swift版),项目整体不是太复杂,并且展...

  • 链接资源

    一.各路大神的博客链接 唐巧的技术博客唐巧总结的大神博客IOS开发系列文章张茫源老师的技术博客凉风的简书:很详细徐...

  • iOS优秀网站集锦(持续更新中)

    优秀的个人博客收集 OneV's Den 岁寒 里脊串的开发随笔其简书 sunny的技术博客 南峰子的技术博...

  • CocoaPods-1. 概况介绍

    引用至简书作者‘评评分分的博客’ 什么是CocoaPods?CocoaPods 是开发 OS X 和 iOS 应用...

网友评论

本文标题:仿简书博客开发

本文链接:https://www.haomeiwen.com/subject/hmgoxqtx.html