分类
学习

从 uiprint.co 聊一聊“练习作品”

我一直有做 Side project 的心,经常想实践一些 idea,不过多数止步于画原型。

虽然我常年购买 Adobe Creative 和 Sketch,也经常使用 Photoshop、XD、Sketch 切页面,不过并不擅长真刀实枪的“创作”。一旦涉及到画原型,进度就会很慢,经常让我的 indie hacker 之路止步于此。于是我就想,要不还是画在纸上。

然后我就找到这个网站:uiprint.co。上面有很多做好的 PDF,直接下载打印,就可以得到很好的设计底图,然后连连画画(上面有网格点),就能画出很棒的设计原型。这样做最大的好处是,设计思路不会中断,可以专注于产品逻辑。

为了方便大家理解,我截了一张图

接着聊聊“练习作品”。

我经常逛技术论坛和问答区,常常看到有同学提问:“自学前端,能仿着教程写出 demo,接下来该怎么做?”,或者“应届生,该写什么项目经历?”

面对这种问题,我都会建议他:

  1. 不要仿做 demo,要做有人用的东西
  2. 认真地进行推广、迭代
  3. 解决遇到的各种问题

模仿写 demo,意味着作品没有得到真正的检验。没有职业经验的新人,他眼里的“也做得出来”、“挺好”,在商业产品里多半连及格都算不上。满足于做这样的作品,没有办法获得真正的提升,写到简历里,也没什么价值。

接下来的问题是:做什么?

首先,不要贪大求全。你当然可以做电商网站,或者自己从头写个博客、论坛,看起来很高端,但实际上既耗时耗力,也没有什么价值,因为没有人真的会用。

其次,要把眼界放宽。互联网已经是一种基础设施,大部分行业都能被互联网赋能提升。与其照抄千篇一律的 todo-list,电商网站首页,好好想想自己周围的人需要什么,做一个他们会用的东西更有价值。

uiprint.co 就是一个很好的例子:

  1. 它本身很简单,就是网页+可以下载的 PDF,纯静态,开发成本维护成本都很低。即使是前端新人,也不太会遭遇无法攻克的技术难题。
  2. 有价值,是 Product Hunt 日榜第一,所有需要做产品设计的人都可以获得帮助。不断有人用,作者就有不断更新的动力,也有不断升级的需求,比如视觉效果调整、访问量统计、添加内容的后台等等。
  3. 就更不用说这个网站本身可能带来的价值

其实我们身边类似这样的机会并不少。比如 2010 年的时候,智能手机刚刚兴起,就有一个人告诉我,他想做一个应用,告诉你在北京上海这样的大城市怎么做地铁,哪站有厕所,哪站车门开在那边、等等。

这样的项目坚持下来,虽然未必有经济收益,但一定能获得很多有价值的项目经验,对入行、对找工作,都会有很大帮助。


总结一下:

  1. 想自学、想提升自己、想找工作,做项目一定要做有人用的东西,不要模仿做 demo
  2. 选择题目不需要特别大,也不需要纯互联网,有人用 是首要原则
  3. 接下来就是坚持,坚持开发、坚持维护、坚持推广

希望对大家有帮助。

分类
学习 技术

看看前端技术的发展动态,我们似乎应该重新规划学习方向

这个标题是仿照好奇心日报起的。

近期在帮朋友招聘,目标是找到一个可以独立工作,能够应对大多数问题的前端。初筛简历的时候我比较偏爱之前经历大多是 JS 开发的候选人,比如专门写插件的,或者写过游戏的,对接的同学就问我:前端是不是做过游戏有加分?其实也不完全如此,只是由于环境的变化,JavaScript 开发在前端的整体工作中占据着越来越为大的比重。以前那种先考察切页面能力的做法已经完全不适用了。也导致,我们在前端学习上,需要重新调整侧重点。

创造 HTML 的目的,是为了阅读文献,从 HTML 标签当中我们就能看到很多来自于印刷时代的痕迹,比如:

  1. 各种语义化的标签 <p> <h1> <h2> <blockquote>
  2. 以竖排版为主的格式
  3. 丰富的字体选项

浏览器也是朝着这个目标去实现的。于是,早期浏览器在界面布局上做的并不好。伴随着互联网发展,越来越多的用户涌入,他们要求互联网以网页为载体,提供更多满足他们需要的产品。此时最早一代 HTML 和 CSS 就不那么适用了。在我开始做前端的那个年代,经常会碰到各种各样奇奇怪怪的问题,写出来的代码,很难达到自己的预期。于是,做前端,最重要的积累,就是各种浏 Hack,什么清浮动啊、IE6 啊,差不多就是这些。

这些东西往往并无逻辑可言,所以,老前端比新前端的优势,就在于记住了多少这方面的经验,解决过多少这方面的问题。我们招聘的时候,也倾向于选择有丰富页面制作经验的,毕竟,编程问题很多时候归属于后端。

然而时过境迁,我们现在再去看前端技术,它的现状和趋势已经都变了。首先,越来越多的浏览器,都在遵守 W3C 规范,我们现在已经不需要再拿那么多时间去做 Hack。浏览器之间的差异,已经从实现的差异(比如 addEventListenerattachEvent),变成了功能化的差异(比如是否支持 Grid 布局)。所以在这个时候,知道多少浏览器 Hack ,也不再是优势。

另一方面,越来越多的工具涌现出来,我们大部分时间都在使用脚手架、预处理工具、模板引擎,已经很少直接手写最终的 HTML、CSS 代码了。再加上 MVVM 框架对整体工作流的影响,如今,使用命令行,已经是前端必修课。所以,扎实的编程基础,丰富的,在各种环境下进行调试的经验,都是高级前端工程师真正的竞争力所在。

总结一下,现在切页面变得相对容易,大多数览器的表现都会和预期一致。所以哪怕相关经验差一些,现学也很快。但是开发经验,如果没有积累,想在短时间内快速提升到能够独立应对大多数需求的水准,就比较困难。所以前端应该尽早关注 JavaScript,尽量多的尝试各类基于命令行的工具,甚至主动跨出舒适区,自己动手实现一些工具。这些会对将来的工作,对将来应聘,带来很多好处。


参考资料:

  1. wiki HTML
分类
学习 技术

面试经:GitHub

GitHub 越来越有名,很多同学都把它作为一个关键字加入自己的简历当中。不过我在面试中,问到如何使用 GitHub,对方通常会答复:上去看源码呀!这个答案完全无法让我满意,具体的原因,一方面可以参考我之前的一篇文章《谈学习:读源码》,源码不是小说,直接看源码收获太小。另一方面,看源码是一个太直接的逻辑推断——上面有源码所以我去看源码——我不认为这是一个细心耕耘慢慢养成的习惯。

接下来我想简单谈一下,我认为应该如何使用 GitHub。

Issues 和 PR

一个 GitHub 仓库可不仅仅是一份源代码那么简单。GitHub 是开发者社交平台,所以每个项目在代码之外,都会有两个非常重要的模块:

  1. Issues 问题,包括 Bug,和其它使用者希望有的功能
  2. Pull Requests(PR) 其他的开发者在这个项目上做出了一些改进,或者修复了一些 Bug,希望能够合并到 master 当中,就会发起 PR

完美的代码是不存在的,越是用的人多的库,存在的问题,或者说被发现的问题可能就越多。阅读其他人提的问题,很多时候可以获得不小的收获,比如,大家开发时都遇到了什么问题?有没有与我类似的情况?他们是怎么解决的?大家最想要的新功能是什么?有哪些值得关注?我能做什么?等等。

以及,可能是更重要的,我们应该怎么样通过 Issues 与仓库的原作者进行交流。

毕竟我们每个人的时间都是有限的,对于大部分开源的类库来说,了解怎么用、有哪些问题、怎么避免踩坑,通常会比你知道它某个函数是怎么写的更有价值。

看文档

好的开源类库通常还会有一个做得非常到位的地方,便是它们的文档,做得通常详尽有价值。通过阅读文档,可以很快的了解这个仓库是干嘛用的,应该怎么用,能解决哪些问题,以及接下来,它的发展方向是怎样的。

据我观察,文档通常分布在三个地方:

  1. README.md,也就是打开仓库页面,默认渲染在文件列表下面的那块
  2. 官方网站,通常在导航下方,仓库简介那里
  3. wiki,通过导航链接可以到达

观察提交频率

并不是所有的仓库,都有开发者在进行积极地开发和维护。如果搜索到几年前的文章,被导引到一些比较古老的仓库,可能出于某种原因,已经没人对它进行维护了,这个时候,该放弃就要放弃。

人生苦短,时间有限,总会有更具价值的仓库供我们学习。

GitHub 热门趋势

GitHub 还有一个热门趋势页面,从中你可以了解到全世界的开发者都在关注哪些仓库,你可以把自己感兴趣的那些加星标记一下,将来不定时的翻一翻看一看它的 Issue、PR 和文档,通常都会有不小的收获。

GitHub Pages

GitHub 还提供给我们一个非常好的静态网站空间,完全免费,全世界都有 CDN,不用白不用。便是传说中的 GitHub Pages。

我们可以用它写博客,做笔记,重点是内容完全可以进行版本管理。

具体做法请自行 Google。

不要放弃提交自己的仓库,也应积极向别的开发者提出 Issue 和发起 PR

我觉得这件事和写博客一样,如果你只是在纸上记笔记给自己看,那多半会不求甚解;但是你想到写成博客总会有人看到,那多半还是会把要写的内容搞清楚,写全面,逻辑清晰可自洽。所以写博客是比记笔记更好的学习方法。以此类推,把自己的仓库推到 GitHub,也理应也是比在本地练习更好的学习方式。

这里绝不鼓励大家乱来,相反,我希望大家对自己的行为负责,重视 Issue 和 PR,毕竟都是提给其他开发者的,或多或少都会对别人造成影响。所以在提之前,十分有必要阅读仓库主人的提交须知,按照对方的代码规范书写代码,写好相关测试,然后再提交。做到言之有物,切不可乱来画猫。


总结

这篇文章不是传授大家应聘技巧的,而是希望分享自己的一些经验,让大家能够通过 GitHub 这个世界上最大的代码托管平台,正确的学习开发技巧。

如果您有相关的经验技巧,欢迎交流。