Eva: 简洁，优雅的博客系统实现

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

爱意满满的作品展示区。

这是一个创建于 2796 天前的主题，其中的信息可能已经有所发展或是发生改变。

就像她的名字，Eva 是一个简洁,美观,优雅的博客，我相信所有坚持写用她写博客的人都能找到自己的女神．

DEMO (后台开放，不做坏事呀，选择相信你)　 Github

Eva使用了轻量级的 JavaScript 框架Vue.js和 Web 框架Express.js来开发，界面设计参考了Material Design规范．如果你觉得这个项目不错，请为她点赞支持

特性

设计简洁，界面美观
支持 Markdown 文章的预览和发布
部署简单
设计了很多贴心的细节

预览

PS: 从零开始写这个博客的缘由有两个：一是我之前的博客用 Hexo 搭建的，这样会始终受限于 Hexo，自由度低，比如想加的功能因为后端不支持就没办法上了．还有一个原因是我想趁此机会再练习下 Vue 和 Express ．为过段时间找工作做准备．

第 1 条附言 · 2017-04-27 14:29:42 +08:00

[很尴尬啊，没想到这么多人访问．]
[我用的可是腾讯学生云，就 1M 带宽啊．诸位打开慢的话，请体谅．]

第 2 条附言 · 2017-04-28 11:22:10 +08:00

[ 第一次上线的匆匆忙忙，导致有很多问题，接下来就逐个解决．]

EVA

博客

Vue

Hexo

44 条回复 • 2017-04-30 11:29:04 +08:00

chengfu

2017-04-27 13:28:41 +08:00

我闺女就叫 Eva，anyway，支持一个

nightwind

2017-04-27 13:29:38 +08:00

支持~~~
带把的，还是妹子？

qfdk

2017-04-27 13:41:26 +08:00 via iPhone

回答你个问题 https://github.com/Automattic/mongoose/issues/4291

Kilerd

2017-04-27 13:41:52 +08:00 via iPhone

@nightwind 带把的妹纸

seeker

2017-04-27 13:43:24 +08:00

赞。楼主 SEO 考虑吗

shuirong1997

2017-04-27 13:44:25 +08:00

@chengfu 那长大一定是女神一枚咯

shuirong1997

2017-04-27 13:45:42 +08:00

@seeker 你是指？

seeker

2017-04-27 13:46:41 +08:00

@shuirong1997 谷歌可以索引到你博客的正文吗？

jtsai

2017-04-27 13:46:58 +08:00

@chengfu 俺女朋友叫 Eva

shuirong1997

2017-04-27 13:51:28 +08:00

@seeker 博客里的文章是刚填加的，我刚 Google 了下，还搜不到．不过搜到了之前博客里的文章．我想等等就应该可以搜到了．

shuirong1997

2017-04-27 13:51:54 +08:00

@jtsai 那可．．．真让人羡慕

shuirong1997

2017-04-27 13:57:36 +08:00

@qfdk 感谢提醒，我注意到但忽略了．我写后端接口时顺便曲翻了翻文档，看到了这种写法，就试了试，发现不能用．没多想，就有在诸如　 blog.save()　外面套了一层 Promise ．．．

geelaw

2017-04-27 13:58:32 +08:00

几个建议

不要设置元素的 opacity 来达到背景半透明的效果，用 argb 设置背景色来取得半透明效果。因为如果你设置 opacity 会导致高对比度模式下无法正确地去掉这个透明度。

“编辑”、“删除”、“…”按钮读不出来，你需要 aria-label ；此外应该加上 role=button。

文章中没有分隔语义的横线，你需要 aria-hidden。

作为 SPA，你没有把元素删除干净——在主页，你可以通过读屏器读出“我和权威的故事”这篇博文 - -

chengfu

2017-04-27 14:02:25 +08:00

@shuirong1997 哈哈，谢谢，肯定是啊～～～

scarlex

2017-04-27 14:03:39 +08:00

我打开网站花了 18 秒...

qfdk

2017-04-27 14:06:26 +08:00 via iPhone

似乎外面的框框不是圆角差评要 5px 的圆角才好看

neighbads

2017-04-27 14:10:17 +08:00

@scarlex 1 分钟。。。。

shuirong1997

2017-04-27 14:11:10 +08:00

@geelaw 感谢建议．汗颜，马上去看看怎么回事．和找文章看看 aria-label ．．．

ziki

2017-04-27 14:11:18 +08:00

老人机字体，这么大一个

shuirong1997

2017-04-27 14:12:33 +08:00

@qfdk 感谢差评，再微调下

shuirong1997

2017-04-27 14:13:52 +08:00

@neighbads １分钟是有点尴尬了．（着急上线没有顾及到这个，接下来就优化速度）

gdsagdada

2017-04-27 14:20:10 +08:00

<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1,user-scalable=0"><link rel="shortcut icon" type=image/png href=/static/zhihu2.png><title>Eva</title><link href=/static/css/app.e566e243fdc705412436666108f607da.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=/static/js/manifest.1cbc5d51d3ba1378d7f7.js></script><script type=text/javascript src=/static/js/vendor.de75f5fbbefb33c26abe.js></script><script type=text/javascript src=/static/js/app.f0d548dff95e73e0606f.js></script></body></html>

对搜索引擎极不友好

gdsagdada

2017-04-27 14:21:16 +08:00

<div class="reply_content"><!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1,user-scalable=0"><link rel="shortcut icon" type=image/png href=/static/zhihu2.png><title>Eva</title><link href=/static/css/app.e566e243fdc705412436666108f607da.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=/static/js/manifest.1cbc5d51d3ba1378d7f7.js></script><script type=text/javascript src=/static/js/vendor.de75f5fbbefb33c26abe.js></script><script type=text/javascript src=/static/js/app.f0d548dff95e73e0606f.js></script></body></html>
<br />
<br />对搜索引擎极不友好</div>

这是 v2 的源码，楼主你懂我的意思了吗