一个部署超简单的 Material Design 博客系统

[zhngnmng]

首先祝各位五一快乐

几年前写了个同类项目, 现在看来欠考虑的东西太多了, 近期重写了一个, 功能如下:

• 单页应用, 响应式布局
• Material Design 风格
• 访客无需注册即可对文章点赞和评论
• 编辑文章时, 粘贴上传剪贴板的图片内容
• 编辑文章时, 实时预览 markdown
• 按文章的类别标签筛选展示
• 阅读文章时展示索引
• 根据配置展示 GitHub 仓库, 社交资料和个人简历
• 部署非常简单

技术上:

• 个人设计开发, 未使用任何组件库 / 样式库 / 动画库
• 交互和样式设计参考 Google Design 旧站, AngularJS Material, Google 开发者 等站点
• 依赖尽可能少的前端工具库
• 集成嵌入式数据库 NeDB, 即插即用

仓库在这里, 欢迎大佬们点评, 试用, 拍砖, 加星

已用于个人站点

另外近期在考虑换工作, 有合适的北京前端岗欢迎交流

---

来几张截图:

笔记列表

笔记详情

代码仓库列表

编辑笔记

笔记评论

基于 react + koa

[kasusa]

不好看 浏览界面

[yafoo]

收藏了，学习下你是怎么粘贴上传图片的

[SenLief]

能不能让他不规则悬浮。

[learningman]

material 哭了

[elone]

不是很 material 啊

[hsfzxjy]

感觉配色有点奇怪

[zhngnmng]

@yafoo 监听 paste 时间取到 clipboardData.files[0] 就可以了

[zhngnmng]

@hsfzxjy 😂 是从官方的配色列表选的主色, 可能是我搭配上有问题

[zhngnmng]

@SenLief 抱歉 没明白

[fliu2476]

这个。。。不太像一个正经前端做出来的东西（请允许我实话实说）

[zhngnmng]

@fliu2476 可以具体说说么

[Donahue]

@zhngnmng 没有美感可言

[zhngnmng]

@kasusa
@learningman
@elone
@hsfzxjy
@fliu2476
@Donahue

感谢各位的回复, 大家觉得 https://web.archive.org/web/20170515193926/https://design.google.com/ 有美感么? 我主要是仿照这个设计的

(非抬杠, 真诚求问, 如果是我设计方面的审美不够, 回头就不搞这类东西了😂)

[learningman]

@zhngnmng #13 你看看人家的阴影，hover 动画，配色
人家是大图加 title 啊，你这黑压压的一片字是啥？你这没抄明白啊

[zhngnmng]

@learningman 我除了没有大图（不会画也没考虑为文章配图）其它都是一致的，谢谢你的时间

[hsfzxjy]

没有背景图，用大块高饱和度的色块就会很奇怪，喧宾夺主，还不如统一的浅色色块

[zhngnmng]

@hsfzxjy 感谢

[phony2r]

只有我一个人觉得很丑吗?

[zhngnmng]

@phony2r 上面没有说好看的，所以你不是一个人

[Pore]

感觉像缺少一点美感的 Google Keep，哈哈哈。
主要是太整齐，颜色选取差了一点。

[zhngnmng]

@Pore 有道理～

[kasusa]

它原版是有的，因为是图片