脚手架们

在公司搭建了内部npm仓库后,工作中需要频繁初始化项目,这时就需要各种脚手架。(我是React技术栈,所以下列围绕工作展开)新建工程多了之后,就会发现目前我的工作中需要大概三类:项目级,用来新建的一个前端项目工程,随手初始化写Demo,或者看到社区有意思的东西,需要立马尝试一下。组件级,当一个组件可以独立化出来之后,我需要一个组件脚手架来承担它。模块级,模块和组件的区别在于模块没有CSS,是单纯的JS功能单元。在经历过多个项目之后,我主要采用以下模版:1. 项目级: 在使用过TypeScript之后,我已经完全不想写原生JS了。对于React项目来说,我通常需要两个版本:原始的create-react-app 和我基于create-react-app 2.1+改造来的TypeScript 版本:GitHub

  • stackfizz
    stackfizz
1 min read

TypeScript Axios 封装

代码见最下面:)背景在重构项目的时候,看到小伙伴基于Axios 封装的HttpClient 不合理,params 和 data 混淆,使用起来太费劲。于是我基于项目需求封装了一个 HttpClient。解决什么问题:多个接口使用通用参数,在调用时重复传递,完全多余返回值统一处理, 错误处理和上报超时 loading 返回值 TypeScript 类型定义和提示1.多个接口使用通用参数,冗余模版代码 一套接口,通常需要一些通用的参数,比如 token,id,直接存储在一个独立的 client 实例里面能减少很多调用层模版代码。Axios 使用

  • stackfizz
    stackfizz
7 min read

一份可执行的英语学习路线

Youtube 视频需要自行想办法~缘起想无压力看懂英语技术文档。学习目标:看medium文章,看MDN原文,英文写作,在Medium发表文章,个人博客上发表英语文章。归根一个字: 用计划节奏设计的原因1.音标是根本,发音是自信的基础。平时看文章遇到生词,一查词典,不能准确读出发音,记忆效果降低。学习资源阿滴英文(滴妹超好看啊)背单词最好的网站 Vocabulary.com - Learn Words - English Dictionary【纽约时报的Learning Network版块】The Learning Network

  • stackfizz
    stackfizz
2 min read

Focus on what matters most -- Brunch

Brunch 是一个极速且近乎0配置的构建工具。它让你以最快的速度开始写代码,而不用考虑如何写配置文件(想想Webpack无论写个什么都要大堆的配置,大雾)。它的功能十分精简,只有三个功能:create  快速开始一个项目develop 开发中热编译你的项目deploy  构建一个分发版本安装:yarn global add brunch # or you use npm npm i -g brunch CreateBrunch 新建一个项目只需要执行brunch new [project-name] [template-name],其中project-name是你的项目文件夹名,template-name是brunch现有的模板名,可从这里查找:地址我比较看中的是这几个模板:

  • stackfizz
    stackfizz
2 min read

在Mac下的前端开发必备工具

Mac 下前端开发体验实在太赞,因此我以后都转到 Mac 下开发了。Mac系统UI精致美观,动效优雅迷人恰到好处,加上一块好点儿的屏幕,写代码也成了一件让人赏心悦目的事情。同时没有右下角弹窗的打扰,没有流氓软件,让我专心于 code 不再分心。Mac 实在是开发人员的首选。在使用过程中,发现了一些非常好用的软件,能大大提高效率,于是就分享在这里啦~好用的工具也许不能让你的 code 能力上升,但至少它不会阻挠你。好工具让你花更少的时间,更少的操作,完成更多的事情,工具就是生产力!1.AlfredAlfred 是一个非常非常强大的效率工具!(墙裂推荐指数:5星)

  • stackfizz
    stackfizz
3 min read

好文推荐

这里罗列了去年12月到现在的我认为值得一读的博文。一直以来都记录在Bear里面,现放在博客上,与君共享。将持续更新:)2018年7月TypeScript: Create a condition-based subset types – DailyJS – MediumIntroduction to JavaScript Source Maps - HTML5 Rocks从协程到状态机—regenerator源码解析(一)Mobx React — Best Practices – DailyJS – Medium更多关于渐进式图片加载的实现 - 众成翻译TechDoc/go_tutorial_8_

  • stackfizz
    stackfizz
4 min read

Git 多账户设置

近来多次在GitHub个人页看自己的 contributions 和 activity 数据,发现光秃秃一堆的 create repo, 百思不得其解:这一年来我明明有很多的提交,怎么数据这么少?今天突然想到我会不会是工作账户和GitHub账户混淆了?导致GitHub认为工作账户的提交都不是我的个人commit。打开我最近的一次 commit,果然是这样...只好查阅资料解决了。解决办法很简单,这里记录一下:1.生成 github 和 work 两个 rsassh-keygen -t rsa -C "xxx@gmail.com&

  • stackfizz
    stackfizz
2 min read
Personal

关于我

江湖艺名王子林,前端工程师一枚。 生于江南,学于成都,工作于北京。 读过很多的鸡汤,中毒太深后痊愈,于是开始反鸡汤,常常说扎心的话。 理想是征服星辰大海,踏遍远方彩虹。 喜欢边牧,喜欢英短,喜欢吃,胡吃海吃。 喜欢音乐,民谣、流行、古典、纯音乐都是我的菜。 喜欢摄影,常常惊叹于影像的力量,喜欢用照片记录生活。 热爱编程,喜欢思维的乐趣。热爱小说,王小波、奥威尔、卡尔维亚、王朔,我都有读过。 最近对软件工程学有很高的兴趣。

  • stackfizz
    stackfizz
1 min read