推荐关注 Meteor JSLint - a Javascript code quality tool jsFiddle D3.js WebStorm 推荐书目 Javascript 权威指南第 5 版
Closure: The Definitive Guide
Closure: The Definitive Guide 
我寒假开发的 react spa 博客，和博文推荐（上次发到这的 es6 简版教程搬新家了）
SimplyY 2016-02-23 13:59:20 +08:00 11056 次点击这是一个创建于 3531 天前的主题，其中的信息可能已经有所发展或是发生改变。
介绍
这个属于 作品发布型专题 and 分享型主题，我是前端开发者，这个项目是全栈项目，所有代码托管在 github 上面
github 项目地址（求 star ）： https://github.com/SimplyY/blog
博客已经搭成，里面写了一篇详细介绍（包括内容和技术）地址： http://simplyy.space/article/56cb46564496cee272dea173
我这里写写简单的介绍：内容值得一看、开发方面值得借鉴和学习的。
适合人群
博客文章方面适合编程者， JS 前端学习者， mac 用户。
博客开发方面适合 初学（或想学） node 、初学（或想学） react 的学习，当然非常欢迎大家（大牛们）说说我的项目的不足，可以优化的地方，一些好点子，或者初学者对开发方面知识的提问，都行。
ps ：对了现在 博客不支持手机端的适配，准备用 vue 写手机端的（其实这个项目纯粹是为了练手，老博客也能用，不过技术栈和我现在不一样）但是要准备 2-4 月份的暑假实习生面试了，时间不够，等面试通过来全部完成。
内容方面
精品系列
- es6 简版入门 ： es6 快速上手
- js thinking ： js good part 心得
- clean code note ：写优雅的代码
- mac tips(实用技巧) ： for osx 用户
其他不错的文章
开发方面
技术栈
- 后端： express + mongodb + node-restful, 也就是使用 node 遍历文件目录作为文章和标签的数据源，提供 rest api （前端通过 ajax 请求就可以去获取数据）
- 前端： react + react router + redux + es6 + webpack + sass 开发的 spa 博客应用。 大致如此，感谢阅读。
ps ：之前发错节点了，，，
第 1 条附言 2016-02-23 19:39:24 +08:00
大家就别 star 了，帖子也不能删，真是后悔发帖。
第 2 条附言 2016-02-24 21:35:40 +08:00
自从学会了 block ，整个世界都变好了。。。
第 3 条附言 2016-04-03 12:02:04 +08:00
seo 搞定了， react 服务器端渲染，并且通过各种性能优化手段，首屏显示 500ms 内。
 | 1 banricho 2016-02-23 14:00:48 +08:00 via Android  1 好东西，感谢分享 |
 | 2 SimplyY OP 1 ps ：性能优化方面，之前发的节点里有人说打开很快，大体我做了 5 点： 1. webpack 打包，大大 减少 http 请求， 2. 把 js 、 css 资源全部 min + gizp 。 3.libs 放到 cdn 4. react-router spa （单页应用，访问应用内新的 url 时，不需要重新去向服务器发送请求去加载新的 html ） 5.在用 react 渲染页面之前， ajax 只用加载 mustData(也就是分批加载数据，延迟了非必要数据的加载) |
 | 3 ewBuyVmLZMZE 2016-02-23 14:05:41 +08:00 速度很快，有意思。 |
 | 5 walter 2016-02-23 14:10:47 +08:00 已顶 |
 | 6 7sDream 2016-02-23 14:29:45 +08:00 6666666666 让我来学习一哈~ |
| 9 SimplyY OP 1 @zonghua 渲染页面之前按需(10kb 左右)，渲染完成后，再加载全部(其实全部也不超过 100kb)，属于分批加载 |
 | 11 zdkmygod 2016-02-23 15:14:11 +08:00 貌似是一次性把所有博客的内容都放在一个 json 里下载下来，那么如果博客有几千条记录怎么办？ |
 | 12 jarlyyn 2016-02-23 15:16:43 +08:00 随便问句，怎么解决 seo 的问题？ react 服务器端渲染？ |
| 17 SimplyY OP @zdkmygod 博客内容不是一条 json ，是提供了一个 rest api ，可以通过 qureystring 定制 json ，比如只加载十篇最新的这种，也就几 kb 到样子 |
 | 18 xcodebuild 2016-02-23 16:54:49 +08:00 1 @jarlyyn 认为搜索引擎对付不了动态内容是老观点了，看这里 http://searchengineland.com/tested-googlebot-crawls-Javascript-heres-learned-220157 |
 | 19 NaG24 2016-02-23 17:21:45 +08:00 我想知道。编译出来的 js ，怎么做到这么小的？ |
| 21 jarlyyn 2016-02-23 18:14:18 +08:00 @codefalling 首先，搜索引擎并不意味着 google 。 其次。这个文章和 mvvm 的没啥关系。又不只是动态渲染，连路径都是动态虚拟的好不。 具体拿 react 做个项目就知道了。靠 hash 和 route 的还好点，如果是绑定时间的话打死我也想不出搜索引擎怎么收录。所有标签点一遍？ |
 | 22 reverland 2016-02-23 18:18:05 +08:00 来 V2EX 膜拜下，教我前端带我飞，带我找工作 orz orz orz orz orz orz |
| 23 xcodebuild 2016-02-23 18:36:04 +08:00 @jarlyyn "搜索引擎并不意味着 google" 这句话确实对的，这也是服务器端渲染要解决的问题之一。但对个人博客来说基本就是 google 了，我才懒得关心 baidu 收不收录我的博客。 他这也不是 mvvm ，是 react 写的，不太明白你说的“绑定时间”指的是什么。 最后：最大不了上服务器端渲染吧，不至于成为什么致命缺陷 |
| 24 jarlyyn 2016-02-23 18:54:25 +08:00 @codefalling 绑定事件。 个人博客基本就是 google 了？大概你不写中文博客可以这么说。多的我也不想说了。说出来撕脸对我也没价值。 另外，你看过他代码了吗？我发评论的时候把大部分代码都看了。连 ajax 的 seo 都没考虑，那么这个基本和各个框架的 blog 范例差不多的 “ blog ”程序价值在哪？ |
| 26 SimplyY OP @jarlyyn ajax ， seo ，不需要前端代码实现，后端用 node 库就 ok ，写一下配置就行，谷歌支持，我只需要支持谷歌罢了 |
| 28 SimplyY OP 而且作为个人独立开发的项目，我是只写给自己用的，你上来就说没有意义，我就不知道了，难道我是写给你用的？ 我不想被百度收录，而且 seo 对我来说都是次要的，反而我更看重 rss ， rss 我也是放在以后得 todo ，和 seo 一样 而且我也说了我写这个是为了纯粹的练手， 任何的技术难点就是去攻克的，这样才有提高，而不是说不行，然后否定一切。 十几年前，你能想象出 iphone ？ |
| 29 xcodebuild 2016-02-23 19:16:00 +08:00 @jarlyyn 我写中文啊=。=我很严肃的说我只考虑 Google 不考虑 Baidu-。-本来博客就是自己随便写点东西,我说的“个人博客”指的只是我的博客不是所有人的个人博客。 另外，即使考虑了 SEO ，难道就不是一个’基本和各个框架的 blog 范例差不多的 “ blog ”程序‘了么，那么你仍然会在下面留下“毫无任何意义”的评价？这只不过是个个人作品， LZ 也没有安利你去使用吧。 |
| 30 jarlyyn 2016-02-23 19:16:58 +08:00 |
| 31 jarlyyn 2016-02-23 19:19:23 +08:00 @SimplyY 只写给自己的就不要来求 star,谢谢。 技术难点？ 提技术难点的花我也太刁难你了。 react 本身的特色之一就是支持服务器段 render 所以我才问了一句。 这代码也算全端了么？好吧，算是吧。 你继续，我滚。 |
| 32 SimplyY OP @jarlyyn 安利别人，我是说有学习价值，博客里面的文章，博客的代码，这些难道没有学习价值么？，跟博客本身 seo 有什么关系，我对 seo 不看重，这是两码事 |
| 33 SimplyY OP @jarlyyn 哦，你是这意思，看来你误会我求 star 的意思了，服务端 render 我有说我不去学？以后不写？ |
| 37 xcodebuild 2016-02-23 19:23:45 +08:00 @jarlyyn 说一句求 star 和“安利”还是有区别的，“安利”是不停尝试说服你去 star ，你觉得不足以打动你的项目不 star 即可。 至于求 star 的，这个节点到处都是，大多项目我都没有意愿去 star （真正让我觉得 cool 的我还会推荐给其他人），我需要去剩下的其他项目下都说一句“没有意义”咯？ |
| 38 jarlyyn 2016-02-23 19:24:54 +08:00 |
| 39 SimplyY OP @jarlyyn 不足不是没有意义，我想起了真阿当喷 vue 作者，我退出中文社区行了吧，大牛？ |
| 40 SimplyY OP 我这种渣渣，又怎么有能力混迹于，中文社区 |
| 41 SimplyY OP 我一时气话，总之比较 sad ，中文社区还是需要大家的力量， V2EX 一直是我认为很不错的地方。 |
| 42 xcodebuild 2016-02-23 19:44:51 +08:00 @jarlyyn 同样一句话有很多种方法说。” SEO 需要去做“当然是“项目的不足，可以优化的地方”，“毫无任何意义”却不是。 好了，我本来也无意和你争辩的，现在楼已经被歪出十万八千里了- -。其实在这个节点的不少帖子都能在下面见到人嘲讽（来自您这样高手的也有，来自其实明明什么都不懂的小白的也有）， 我不太明白这种措辞是出于什么原因，因为生活中大多数人还是知道在批判之前先表达自己的善意的。 相比之下 ruby-china 的回复要善意的多，不知道他们是怎么引导这种氛围的。 |
| 43 jarlyyn 2016-02-23 19:46:27 +08:00 @SimplyY 我还是你那句话，你继续，我滚。我倒是发现自己越来越不适应 V2EX 了。 另外给你个建议，调整下心态，在论坛上这样对我无所谓。如果你去面试的时候，把这个项目给面试官看的话，面试官问你这两句，你准备怎么办？ 当然，我并不会是你的面试官，但脾气也不是那么容易控制的一个东西。 |
 | 44 wentao 2016-02-23 19:48:57 +08:00 via Android 支持大家 好好学习 |
| 45 jarlyyn 2016-02-23 19:49:57 +08:00 @codefalling 这点就嘲讽了? 工作中面对上级怎么办？ 我上 V2EX 是希望这里质量高。可不希望看到这么多"善意"的回复。 顺便提一句，尊严这玩意，从来不是天生的，是靠自己努力证明的。 你可以继续觉得我不善意，但这句话并不是说给现在的你的。 最后，你们继续，该滚出 V2EX 是我这样的人。 |
 | 46 hustlzp 2016-02-23 19:56:00 +08:00 好东西！ |
 | 47 kingme 2016-02-23 19:57:13 +08:00 1 可以点击 ID ，进去之后 block 。 程序员都有这个毛病，自己最，别人都是渣渣。只是有的人会表现出来，二有的人不会。所以把表现出来的人 block 就清净了。 |
 | 49 saga 2016-02-23 20:26:12 +08:00 对 jxx 此人已 B |
 | 50 sox 2016-02-23 20:32:10 +08:00 > 如果不解决 SEO 的问题，那么个人觉得，这个 ajax 的 blog 毫无任何意义。 @jarlyyn 如果不解决 XXX 的问题，那么个人觉得，这个 xxx 的 xxx 毫无任何意义。 Show some respect to OSS. |
| 51 jarlyyn 2016-02-23 20:38:59 +08:00 via Android @sox 不觉得这东西没意义？那你就直接说这东西的意义就可以了。 另外，谢 b 我的人，最好回个帖子，让我也 b 一下，能节约我宝贵的时间不要看没有价值只会跳着叫 block 的真心不错，难道你们还能发出值得我看的东西吗？ |
 | 53 VmuTargh 2016-02-23 20:41:36 +08:00 |
| 54 sox 2016-02-23 20:45:42 +08:00 |
| 55 sox 2016-02-23 20:47:13 +08:00 |
| 56 jarlyyn 2016-02-23 20:48:12 +08:00 via Android |
| 58 SimplyY OP @VmuTargh 非常感谢，， ssl 还没空，劫持倒是以前被联通坑过，直接把我的 js 文件改成他的 js ，真恶心（开发 hybird app 的时候），列一个 TODO 去。 |
| 59 VmuTargh 2016-02-23 20:52:03 +08:00 @SimplyY 其实 SSL 这玩意一般在前端的 apache/nginx 这些 web server 折腾， nodejs 一般在生产环境当后端。 |
| 61 SimplyY OP @VmuTargh 其实我准备 https ，好多公司也都这么做了，不过都是 TODO ，，，先弄好当下，大三 3 月就要面试暑假实习， sad |
 | 62 Sequencer 2016-02-23 20:56:33 +08:00 还是觉得让被 B 的人享有拥有楼层号的权利,不然看了半天才知道那个 jarlyyn 早被 B 了... |
| 63 jarlyyn 2016-02-23 21:00:10 +08:00 via Android @sox 没意义就是没意义。 不是楼主让人评价缺点的么？ 直接说要去面试了，求 star ，我还懒的看。 别的不说，我之前把楼主的代码都看过了，源代码就有 demo 数据我也不说啥了。 你看过了吗？ 我不但指出来楼主的项目的问题，还提到了 react 可以在服务器渲染，还直接说出了楼主项目最大的问题，没意义。 整个楼里有几个人回复比我价值？ 看过代码，提出实际问题的人被要求回答这种政治正确不正确的问题。 这还是个程序员社区？ 所以我只能觉得我不适合这里，该滚的人是我了。 你们继续友善去吧，相信有更多的人会冲这友善来这里的。 |
 | 64 WenJimmy 2016-02-23 21:00:17 +08:00 我觉得回复被 B 的也要隐藏掉~ |
| 65 sox 2016-02-23 21:06:03 +08:00 |
| 66 jarlyyn 2016-02-23 21:09:38 +08:00 via Android |
 | 67 breeswish 2016-02-23 21:24:55 +08:00 我觉得楼上有人喷的很在理呀， SEO 做不了是很大的缺陷，而需要支持 SEO 则需要架构上重构一部分，工作量也许还不小。这确实是这个项目最大的不足的地方。就是没有友善的说话。 |
| 68 breeswish 2016-02-23 21:29:52 +08:00 我也有过项目被说毫无意义的经历，我知道这些评价是基于对评论者、对可能的大多数其他人来说的，项目有很多问题，项目并不能对其他人做出什么贡献，等等。虽然那个项目后来发现还是能帮助很多人的，也就是说最终还是有意义的，但是无论怎么样，它对自己都是有意义的，楼主加油 :-) |
 | 70 yibuyisheng 2016-02-24 08:51:45 +08:00 看到博客中一句话： 但是，大三开始我从后端转前端了。为了增强自己的前端能力（毕竟对于大三寒假，没几个月就要准备去面 BAT 实习生了，虚），于是寒假开始了重写博客， 重点把 es6,react,redux 学习、使用，并对组件开发、 spa 开发从初识到熟练，整个项目轻后端、重前端（后端代码全部也就 400 行的样子，前端合起来 2000 行左右）。 BAT 面试的时候基本不会细问流行框架相关的知识，比较看重的是基础（ html 、 css 、 js ， ES6 可以了解一下吧）知识掌握情况和运用已有基础知识解决实际问题的能力。 |
 | 71 mechanician 2016-02-24 09:44:01 +08:00 支持一下～看了 blog 觉得题主蛮厉害的啊，求认识～ |
| 72 SimplyY OP @yibuyisheng 嗯 基础我也认为很重要，寒假看完了两本 css 书， js 书这半年看了五六本。 react 相关生态学习，是阿里小主管的学习建议之一，还说挺重要。 最重要的，我觉得，写项目才会遇到大量实际问题，才能更快提高，这也是我大学自学一直项目驱动的原因，因为些项目，进步真的很快 |
| 73 SimplyY OP @mechanician github 我参与了一个组织，你可以在我 github 首页看到，右上方第一个，可以在那里面交流认识 |
 | 74 chenyg32 2016-02-24 09:50:44 +08:00 支持一下 |
| 75 mechanician 2016-02-24 09:53:20 +08:00 @SimplyY 右上方…… CoderUnion ？ |
| 76 SimplyY OP @mechanician 嗯 |
 | 77 isb 2016-02-24 10:06:49 +08:00 感觉阴影太浓重了 = =。 |
| 78 isb 2016-02-24 10:09:25 +08:00 box-shadow: 0 2px 22px #ccc;感觉效果好点 |
 | 79 LeoDev 2016-02-24 10:18:39 +08:00 赞一个 |
| 80 SimplyY OP @isb 我俩 color 值用的不一样，我直接用的 grey ，你的和 V2EX 的差不多，（但是萝卜白菜我都试了一下，我喜欢浓一点的。。。。 |
 | 81 jiongxiaobu 2016-02-24 11:23:36 +08:00 via Android 1 |
| 82 SimplyY OP @jiongxiaobu 恩，谢谢，我估计 3 月底开始新的开发，搞搞服务器渲染 |
 | 83 bramblex 2016-02-24 11:38:11 +08:00 @codefalling 活捉 OwO |
 | 84 moxiaonai 2016-02-24 13:10:39 +08:00 via iPhone 马克 |
 | 85 TheOutgoing 2016-02-24 13:38:16 +08:00 没有什么话是不能好好说的，没有 seo 就没有价值，这一句就把人辛辛苦苦的努力给无视了。完整写过一遍的人自然懂得艰辛 |
 | 86 blue0125 2016-02-24 13:42:47 +08:00 为何这么吊？ |
 | 87 yundaren 2016-02-24 13:43:32 +08:00 重复造轮子，现在不是有 wordpress 已经够完美的了吗 |
| 88 jarlyyn 2016-02-24 13:49:21 +08:00 |
| 89 SimplyY OP @yundaren 第一，我说了纯粹练手，第二 WordPress 我不喜欢，我觉得他不完美，，第三造轮子可以显著提升自己，又不是商业项目，为何不能造轮子 |
 | 90 damonzhaofei 2016-02-24 16:15:33 +08:00 @SimplyY zip 压缩也是自动的么？ |
| 91 SimplyY OP @damonzhaofei gzip 是服务端开启的， |
| 92 SimplyY OP @damonzhaofei min 是 webpack 做的（也就是所谓的自动），我发现很多人弄混了前端 min gzip 的意义，我这里写写。 min 不叫压缩，叫混淆或者精简，比方说把函数名 test 精简 为 a ，所有代码全部变成一行，这样代码体积就小了。一般由自动化工具完成。 压缩一般用 gzip ，是编码行为，我们熟悉的有霍夫曼编码（可以压缩体积），是后端完成的。服务器端响应 http 请求的时候，可以把 response 的内容用 gzip 压缩，然后设置 header 的 Content-Encoding:gzip ，浏览器看到这个 header 后，就会去用 gzip 的方式解压。 个人拙解。 |
| 93 xcodebuild 2016-02-24 21:08:48 +08:00 via Android @bramblex 好久不见，你又造了新轮子_(:з」∠)_。你的贴子下语气不善的回复更多（还有人不懂装懂地挑刺），，以至于我都不知道回复啥好就没说了_。 |
| 94 xcodebuild 2016-02-24 21:21:53 +08:00 @jarlyyn Talk is cheap. |
| 95 reverland 2016-02-24 21:25:34 +08:00 |
| 96 jarlyyn 2016-02-24 21:32:14 +08:00 @codefalling 对不起，公司盈利点，不能给你代码。 自己随便搭着玩的倒有，没什么脸放出来求 star 的。 https://github.com/jarlyyn/JNodeWeb/ 至于意义么也很简单，解决了两个简单直接的问题。 1.按 widget/view 调用数据库数据,方便制作 layout 中共用的需要调用数据库的组建，如最新回复之类。 2.让 express 的 router 更可视化一点。 如 app.post('/api/setpassword',Run( web.IF(Form.isValidated('setpassword'))( 'setpassword' ), Http.notFoundIf( Form.isPending('setpassword'), Form.isError('setpassword','uid') ), Form.doJsonErrors('setpassword') )); 写个框架，好要自己实现 orm,测试大概都不用写了？ blog?大概记得 yii 的官网教程就是教人手撸一个 Blog 吧？ 不懂装懂？ 是有些人半瓶水儿叮当吧。 搞得 V2EX 和什么一样。 大概以为这里是课堂交流作业的地方？ |
| 98 SimplyY OP |
| 99 xcodebuild 2016-02-24 21:49:11 +08:00 |
| 100 jarlyyn 2016-02-24 21:53:10 +08:00 @codefalling 很不幸啊，我某个有 N 多人用的项目也是 0star 。 不是你说 talk is cheap 么，不就是 show me the code 么? 另外，这些 node_moduels 居然不提交？ 你知道哪些 Nodejs 项目是要把 node_moduels 加入.gitignore,哪些不加么？ 好好做过几个项目？ 别人都没说什么你急什么？把这里当成什么地方了? |
Select Language