leopku (Song Liu)

又开一坑， Revel —— 使用 javascript 一门语言实现前后端分离的山寨 flarum 轻论坛

leopku — Sun, 02 Jul 2017 20:07:42 +0800

Revel 论坛

https://revel.antbox.io/

https://github.com/leopku/revel

开了一个坑，基于 vue 全家桶 + parse-server 山寨轻论坛 flarum。

前端使用 Vue 全家桶，vue、vuex、vue-router，UI 部分使用 element-ui

API 部分用了基于 nodejs、开箱即用的 parse-server（parse.com 被 facebook 收购后的开源版本）。

目前已实现的功能：

注册、登入、登出
首页布局山寨及各种响应式处理
从 api 加载分类、文章、作者等信息
加载更多

暂未实现的功能：

发帖、回帖
分类列表页、分类帖子列表页、帖子详情页
邀请回答
...

欢迎学习的 Vue 全家桶的小伙伴围观

有加入的欢迎小伙伴们更好了，一起添加功能、完善缺陷、改进代码，最终实现一个美观、易用、移动端友好的论坛/知识问答社区。

这一段 slim 代码有办法优化吗？

leopku — Fri, 21 Oct 2016 16:59:34 +0800

.tile.is-ancestor
  .tile.is-3.is-vertical
    .tile.is-parent.is-vertical
      - @projects.each_with_index do |project, index|
        - if index % 4 == 0
          .title.is-child.box
            p.title = index

  .tile.is-3.is-vertical
    .tile.is-parent.is-vertical
      - @projects.each_with_index do |project, index|
        - if index % 4 == 1
          .title.is-child.box
            p.title = index

  .tile.is-3.is-vertical
    .tile.is-parent.is-vertical
      - @projects.each_with_index do |project, index|
        - if index % 4 == 2
          .title.is-child.box
            p.title = index

  .tile.is-3.is-vertical
    .tile.is-parent.is-vertical
      - @projects.each_with_index do |project, index|
        - if index % 4 == 3
          .title.is-child.box
            p.title = index

[北京] Dmall (多点) UED 招聘前端工程 / 架构师、Ruby 开发工程师 / 架构师

leopku — Tue, 04 Aug 2015 17:20:46 +0800

关于多点

公司介绍

多点 Dmall（全称：多点新鲜 (北京) 电子商务有限公司）成立于 2015 年 4 月，是生活电商领域的新锐公司，以 O2O 模式实现 1 小时送达的全品类生活电商平台，立志成为中国最大的全品类的生活电商平台。

Dmall+ 大型商超的模式是基于互联网 + 实业的新型的 O2O 商业模式，建立以重服务、轻仓储的分布式电商，让传统的商超迅速无缝的切入到新型的零售商业 4.0 模式，既帮助线下超市在这场互联网浪潮中的逆袭，而且让传统的商超将“+互联网”模式轻松转变为“互联网+”的模式，商超不仅仅轻松带来销量的增加，而且在此次转型中“0 风险，0 投入”。

消费者在“互联网+”的传统商超的变革中，轻松体验最快捷的购物体验，让妈妈们的生活不再是老妈子的生活，多一点文娱时间；让白领们下班后生活从繁忙琐碎中解放出来；更让忙碌的都市生活变得更加轻松惬意。

公司理念

公司愿景

成为中国人首选的生活电商平台。

人才理念

如果你需要主导你的生活，延展你的能力，让你和大家的生活更有意义，那你就是我们需要的人才

公司快速的发展，无限的机会将牵引你的发展，创新和有激情的你对未来的探索同时带来公司业务的快速发展

我们追求结果导向，在此基础上我们希望你能分享公司的成功，同时我们承诺构建开放、平等、协作的氛围

我们追求思想扁平化/决策扁平化/运作扁平化的组织运作原则，充分激发你的潜力，实现你的价值。

职位描述

前端工程/架构师 (20~40k)

工作职责

使用 HTML/CSS/JavaScript 进行前端的开发、单元测试、架构
根据需要进行自动测试、行为测试、自动部署
维护与优化网页及移动前端性能，优化前端开发模式和规范
参与用户行为分析及前端应用的用户体验优化

任职资格

前端工程师 2-5 年 / 架构师 5-8 年
计算机相关专业，电商相关经验优先
熟悉 AngularJS/React/Bootstrap 等主流框架
熟悉 MVC/MVVM 等模式，推崇 GIT/*nix
能独立完成前后端的全栈工程师优先，有浏览器兼容性经验者优先

本职位也可通过拉勾查看更多信息 http://www.lagou.com/jobs/800956.html

Ruby/Rails 开发工程/架构师 (20~40k)

工作职责

负责面向 C 端用户的功能研发
负责 C 端功能管理后台的研发
负责 C 端功能的性能优化

任职资格

工程师 2-5 年 / 架构师 5-8 年
计算机相关专业、电商相关经验优先
熟悉 Rails/Sinatra/Padrino 等框架
熟练使用常见 gem

应聘技巧

简历为 PDF 格式者佳有 github 主页或个人主页佳有 Mac 使用经验者佳熟悉 Gulp/Grunt 者佳熟练使用 Git 者佳熟悉 MVVM 理论者佳有 React 项目经验者佳

投递邮箱

leopku(At)qq.com

投递简历请注明来自 RubyChina

又一个新的 JS 框架 Flight -- 出自 Twitter

leopku — Sun, 14 Jun 2015 09:53:26 +0800

https://flightjs.github.io/

JS 的框架又添一个新丁 —— Flight，前端框架继续混战

Flight 是一个事件驱动、基于组件的轻量级前端框架。

依赖 jQuery 与 AMD 规范的加载器 -- Webpack 或 RequireJS 等等

官方给了一个邮件客户端的例子：

Demo: https://flightjs.github.io/example-app/
Source: https://github.com/flightjs/example-app

还有一个 Flight 实现的 TodoMVC

[北京][北四环] 互爱科技旗下宏财网互联金融诚聘 WEB 全栈工程师、高级 iOS 开发工程师 [10K~30K]

leopku — Fri, 27 Feb 2015 12:16:28 +0800

宏财网（https://www.hongcai.com）是互爱科技旗下的互联网金融方向子公司，创办于 2014 年 9 月份，注册资本 1000 万，宏财网目前团队 40 多人。

我们的工作地点在北四环国家会议中心，处于 8 号线 15 号线交汇处，出地铁口即到。住望京或北边的小伙伴们非常方便，duang 一下就到了。

福利

每周鸟窝游泳、篮球、足球等文体活动（集团内部有各种文体协会）
每天台球、乒乓球、梭哈游戏、桌面足球
每天晚上都有粥
内部平价小卖部各种零食饮料（以前免费现在集团人太多为了避免浪费改为进价了）
节假日老板的大红包 duang duang duang 就扔出来了（春节期间董事长、CEO、副总裁的红包每天都发到微信最高限额）

现招聘

WEB 全栈工程师

工作职责与任职要求

Ruby On Rails 一年或以上开发经验
熟悉常见 Gem 的使用
熟悉常见前端工具与框架：Html5、css3、jQuery、sass/less，有 AngularJS 开发经验更佳
有微信公共号的开发经验尤佳

加分项

Geek 精神，不折腾会死星人
积极参与开源贡献者，在 Github 等平台有开源项目的
有第三方 Gem 开发经验或 PR 经验
熟悉 OSX 使用，能熟练在 OSX 下搭建开发环境

高级 iOS 开发工程师

工作职责

负责宏财网 iOS app 应用的架构设计、整体进度、难点攻关
负责把控 iOS app 代码质量，Review 初级工程师提交的代码

任职要求

两年以上 iOS 项目经验
熟悉 OSX 平台下的开发；熟悉 iOS 内存管理机制等底层开发，熟练使用 iPhone/iPad 及相关开发工具
深刻理解 OOD/OOP 思想，精通 C++/Object C/Cocoa 编程
较强的算法思想，较强的解决问题通力
在 Apple Store 有成功发布的 APP 作品

加分项

了解其它编程语言（Javascript）
积极参与开源贡献者，在 Github 等平台有开源项目的
有第三方组件 SDK 开发经验的加分

简历投递

有意者可以发简历到 leopku『约』企鹅.com

愿意过来聊天、参观的小伙伴们也欢迎来『约』

有用 prezto 的 zsher 没？

leopku — Thu, 29 Jan 2015 14:14:56 +0800

我用的默认的 sorin theme 为什么跟官方文档中默认显示的效果不一样呢 git 信息神马的都没有，看了代码，里面却是有相应功能的。求指点。

又来发 hexo 皮肤 Chubby Stacks 了

leopku — Mon, 10 Nov 2014 23:30:59 +0800

别人的购物节，我们也来点什么？上次制作的皮肤 https://ruby-china.org/topics/21996 很黄很暴力这次制作的 chubby stacks 是一个白色系皮肤，细节部分仍然还未做太多处理，希望能有更多喜欢。

github 地址： https://github.com/leopku/hexo-theme-chubby-stacks

国内用户可以访问 coding 地址： https://coding.net/u/leopku/p/hexo-theme-chubby-stacks

你所不知道的 console 对象的五个函数 (功能)

leopku — Mon, 10 Nov 2014 23:07:02 +0800

文档信息 原文：https://shellycloud.com/blog/2014/11/five-functions-of-the-console-object-you-didnt-know 作者：@_bkzl 日期：2014 年 11 月

翻译信息 译者：@leopku 链接：http://www.himysql.com/2014/11/06/five-functions-of-the-console-object-you-didnt-know/ 翻译版本：1 翻译日期：2014 年 11 月 10

console.log 常被用来作为日志之用，但是 Console 对象还有一堆类似有用函数鲜为人知。本文中我将选择五个很有意义、在每天的工作中都能实用，却不是很流行的函数。

所有的功能均在 Google Chrome 38 版本中测试有效

console.assert(expression, message)

如果第一个参数的值为假，该函数将在 web 控制台输出第二个参数；如果第一个参数的值为真，神马也不会输出。

> console.assert(document.querySelector('body'), "Missing 'body' element");

> console.assert(document.querySelector('.foo'), "Missing '.foo' element");
[Error] Assertion failed: Missing '.foo' element

console.table(object)

该函数将对象或数组以表格的方式显示更多关于 console.table() 搓(戳) 《javascript 高级调戏(试) 技之 console.table() 》「作者：Marius Schulz」「译文（计划中）」

console.profile(name)

console.profile(name) 在控制台中开始一个 CPU 分析器。参数可以扔进去一个报表的名称。每个分析器会保存在单独的 tab 中并以下拉列表分组。记住有始有终，不要屎(始) 乱终弃，要调用 console.profileEnd() 停止分析器。

console.group(message)

console.group(message) 分组所有后面的日志输出到下拉列表里，直到 console.groupEnd() 被调用。列表可以是嵌套滴。console.groupCollapsed(message) 类似，只不过默认列表是折叠状态。

console.time(name)

console.time(name) 将启动一个以参数命名的计数器，计算被 console.timeEnd(name) 命令终止时流逝的时间。

> console.time('Saving user');
> console.log('User saved');
> console.timeEnd('Saveing user');
Saving user: 2.750ms

想看所有的函数戳 Google Chrome 网站上的《Console API 指南》和《console 的用法》

自制的 hexo 皮肤 Vanilla Cream

leopku — Sat, 11 Oct 2014 23:47:10 +0800

一直想痛快淋漓地用 Markdown 写博，无耐在 Wordpress 折腾来折腾去仍然达不到淋漓尽致地赶脚。年初就在考察和选型中确定了 Hexo，但是 Hexo 的主题一直没选中自己满意的，趁着休假自己制作了一个主题，于是现在就有了 www.himysql.com 现在的样子。

下面摘自本皮肤的 README

Vanilla Cream

基于 Bootstrap UI Vanilla Cream 制作的 Hexo 皮肤。感谢作者 pixelkit.com 制作的漂亮皮肤。
基于 chenall 模块化 Hexo 皮肤。感谢作者 chenall 模块化方面的付出，节省了我不少时间。

功能特性

请参阅 chenall 的说明

安装

在 Hexo 博客根目录下：

git git://github.com/leopku/hexo-theme-vanilla-cream vanilla-cream

编辑 _config.yml，将 theme 修改为 vanilla-cream

具体效果

我的博客 www.himysql.com

自定义 Sublime Text 3 皮肤 Spacegray 和括号配对显示插件 BracketHighlighter 适配 base64-ocean.dark 色彩主题

leopku — Tue, 29 Jul 2014 17:00:13 +0800

原文地址： http://www.himysql.com/custome-spacegray-theme-and-brackethighter-plugin-to-adapte-base16-ocean-dark-color-theme-for-sublime-text-3.html

BracketHighlighter

先上一张效果图，请注意最左边

BracketHighlighter 可以将“括号”配对情况显示出来的插件。为什么要将括号两字加上引号呢？因为 BracketHighlither 能显示的配对情况不仅仅是正常的括号，HTML 标签、begin...end 等类型的配对也适用哦。

Spacegray 皮肤与 base16 ocean dark 色彩主题

Base16 ocean dark 色彩主题在前文《推荐一款小清新的色彩主题（附 atom 和 sublime text 安装使用方法)》已经做过推荐。

Spacegray 是一款比较精致的皮肤，为了适配 Base16 色彩而专门研制。所以，装好 Spacegray 之后，默认就会同时帮你装上 base16 的色彩主题。可 (tui) 以 (jian) 通过 Package Install 的方式安装。

BracketHighlighter 与 Spacegray & Base16 ocean 整合

BracketHightlighter 默认的形式真是普 (tai) 通 (cou)。好在，这款插件支持自定义配置。看着官方 repo 中示范图比默认的好看多了，撸起袖管将之与 spacegray & Base16 ocean 整合。

成果分成两部分：

BracketHighlighter 配置：

https://gist.github.com/leopku/89ff7eb32b8563e0b523

粘贴进 Preferences -> Package Settings -> Bracet Highlighter -> Bracket Settings - User

Spacegray 配置：http://yunpan.cn/QCWDM4fLskvHV86ba)（提取码：

将下载回来的文件覆盖： (Mac 下) 资源库 -> Application Support -> Sublime Text 3 -> Installed Packages 中同名文件。

发现一个 Sublime Text 的 Ruby 交互式调试插件 Ruby Debugger

leopku — Mon, 09 Jun 2014 23:09:30 +0800

支持 Sublime Text 2 和 3

Ruby 1.9.3 依赖 debugger：gem install debugger

Ruby 2.0.0 依赖 byebug：gem install byebug --version '>=2.5.0'

想念 IDE 那种下断点、调试、继续的感觉不

zsh 的 global alias tab 补全问题

leopku — Mon, 02 Jun 2014 23:30:09 +0800

请教 zsh 达人：global alias 能否实现 tab 补全？

.zshrc 中

alias -g 111222=/etc/asdf.conf

输入的时候

vim 111<tab> 不能补全成 111222

求高人指点

[北京][三元桥] 汽车达人招聘 Web 前端、Ruby

leopku — Mon, 12 May 2014 19:09:26 +0800

关于汽车达人

汽车达人是第一个汽车主题垂直社交网站，包含了全部上市车型的官方达人会，以及全国各省市的地区达人会。您可以获取最新汽车资讯、报价、改装、维修、保养、二手置换信息，还可以参与车友发起的自驾游、试驾、聚会、团购等活动。

汽车达人已经上线运营两年多，经过两年多的运营和调整，我们的目标更加坚定，我们的步伐更加稳健。目前我们的线下销售团队正在全国范围内如火如荼的地推。

工作环境相关

地址：北京三元桥附近（住东边或北边的兄弟都方便）。= 职位：WEB 前端、Ruby 职责：负责汽车达人网汽车信息相关功能开发与维护、车友社交相关功能开发与维护、负责《买车达人》、《卖车达人》APP API 接口的开发与维护。团队规模：目前我们的开发团队在 30 人左右，包括北京、沈阳两个团队。北京的团队以网站开发为主，沈阳的团队以 APP 为主。

理想中的“他”（“她”）

我们希望找到各领域（Web 前端，iOS，Android）靠谱的工程师，一些要求如下：

所在领域有至少 1 年或以上开发经验（包括但不限于 nodejs、ruby、php、python），欢迎跨多领域人才；
编程基础良好，追求优雅的代码；
热爱技术开发，有极客精神，参与过开源项目或常写技术博客加分哦！

工作年限，学历专业都不是硬性要求，我们更注重能力：

解决问题能力。自信，积极主动，做事有条理，目标导向。
学习能力。乐于学习，渴望每天都在进步。
团队协作能力。诚实，坦率，有责任心，信任、尊重、包容。

可以预见的收获

发挥你能力的舞台

汽车达人的技术系统正处于从数百万用户量到数千万量级演进过程中，这里充满了机会和挑战，如果你是技术大牛，或者渴望快速成长为技术大牛，这里有供你发挥的舞台。如果想未来成为产品经理，或者自己创业，这里也将为你打下坚实的基础。

良好的工作环境

我们提供 Mac 加双显的工作环境。不定期地举行 CS、DOTA、三国杀等对抗和休闲娱乐类游戏还有还有，黑丝美女程序员同事，你来或不来，她都在那里。

超出你预期的回报

年薪 15-25 万，上不封顶，取决于你的能力和业绩。目前公司处于快速发展阶段，融资即将完成，未来充满无限想象。我们将把你视为伙伴，希望通过一起努力，能够提供远超你预期的回报。

联系方式

如果您对我们的工作岗位感兴趣，请把您的简历或情况发邮件到 leo(at)topka.cn，最好能充分展示您的能力，谢谢！

该帖已删除

leopku — Fri, 04 Apr 2014 10:34:10 +0800

[分享][精美 PDF]《七天学会 NodeJS》2014.04.20 增加 epub 版本

leopku — Sat, 15 Mar 2014 12:34:52 +0800

原文：http://www.himysql.com/pdfs-for-gevent-tutorial-and-7-days-nodejs.html

2014.04.20 更新

增加封面
增加 epub 版

《Gevent 程序员指南》和《七天学会 NodeJS》是两本非常在线技术资料，但是在线版本不利于移动设备离线时观看。

这两本 PDF 针对字体做了优化，源代码也作了高亮，适合阅读。在制作过程中，对原文一些细节上的错误作了修正。希望这两本 PDF 成为你马桶、公交、地铁上打发时光的好伙伴。

七天学会 NodeJS

内容来自 http://nqdeng.github.io/7-days-nodejs/，版权归原作者所有。感谢原作者的写出这么好的教程。

下载

2014.04.20 PDF 版： http://pan.baidu.com/s/1kTr4xDH

2014.04.20 EPUB 版：http://pan.baidu.com/s/1kTG6U5h

[分享][精美 PDF]《Gevent 程序员指南》(2014.04.20 新增 epub 版)

leopku — Sat, 15 Mar 2014 12:33:09 +0800

原文：http://www.himysql.com/pdfs-for-gevent-tutorial-and-7-days-nodejs.html

2014.04.20 更新

新增封面
新增 epub 版

《Gevent 程序员指南》和《七天学会 NodeJS》是两本非常在线技术资料，但是在线版本不利于移动设备离线时观看。

Gevent 程序员指南

内容来自 http://xlambda.com/gevent-tutorial/，版权和中文版版权分别归原作者与译者所有。感谢原作者与译者的辛苦付出。

下载

2014.04.20 PDF 版：http://pan.baidu.com/s/1eQiRh4m

2014.04.20 EPUB 版：http://pan.baidu.com/s/1gdwwpnP

万能的 ruby-china，trackpad 电池装反了，一节卡在里面出不来了有什么办法能弄出来吗？

leopku — Tue, 11 Mar 2014 21:13:41 +0800

照理说，电池装反了也不至于出不来啊

推一个 Rails4 下语言化、轻量级、易用且自带 WEB 管理的权限管理 gem

leopku — Fri, 07 Mar 2014 00:43:28 +0800

https://github.com/the-teacher/the_role

所有权限按两级 hash 的方式定义，并以 json 字符的方式存在数据库中

官方文档号称：永别了 CanCan

[已起床的小伙伴们看过来] semantic-ui-wp-theme 情人节托管至 github

leopku — Sat, 15 Feb 2014 10:00:07 +0800

旧帖子顶不上来了，重开一个新帖，管理员莫怪。欢迎各种使用、建议、fork和pull request。

Semantic-ui-wp-theme

Semantic-ui-wp-theme 是一款基于前端框架 Semantic-UI 的 Wordpress 皮肤 (theme)。

本款皮肤具备如下特点：

响应式设计，适应智能手机、平板、电脑等多种设备。
多种美观的页面元素：标签、评论等等
页面清新，结构紧凑，整体简洁大方
优化的字体显示效果，尤其针对 Mac 用户
大量使用 html5 和 css3 技术，避免不必要的图片，让网站在拥有美观的界面同时，又不影响访问速度。
多国语言支持，目前支持中、英文两种语言

更新

2014 年 2 月 14 日情人节，代码托管至 github，地址： https://github.com/leopku/semantic-ui-wp-theme

依赖

WordPress 3.7.1 或以上版本

安装

下载 zip 包：https://github.com/leopku/semantic-ui-wp-theme/archive/master.zip 或 git clone git://github.com/leopku/semantic-ui-wp-theme
将压缩包上传到 wp-content/themes 目录下
在后台管理，选择 外观 > 主题，启用 semantic-ui-wp-theme 即可

截图

问题反馈

至官方网站 www.himysql.com 的 semantic-ui-wp-theme 页面留言

rbenv 中枪

leopku — Wed, 22 Jan 2014 13:11:12 +0800

被百度亮瞎了