某科学的前端工程化

本文根据演讲 PPT 口胡输出而成,如有雷同纯属巧合。

开篇,我们先来引入一个问题:什么是前端工程化。

对于我来说,前端工程化大致分为下面的几个内容:

  • 代码规范化:eslint
  • 流程规范化:git flow / Code Review
  • 测试规范化:写不写,怎么写
  • 组件与模块:项目与模块治理
  • 基础设施:CI / CD
  • ……

- 阅读剩余部分 -

关于我转职变成全栈这档事

本文根据演讲 PPT 口胡输出而成,如有雷同纯属巧合。

有很多前端工程师想要学习后端,甚至说是转而成为一个全栈工程师,在这次演讲前发放的问题调研中我也确实发现有好多同学想要学习后端,因此我们开始讲讲全栈这档事。

- 阅读剩余部分 -

在 HTTP 网站中开启 Notification API

Notification API 只能在 HTTPS 中使用:Using the Notifications API

This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

但是在开发某游戏网站脚本的时候,虽然它用的是 HTTP,但是仍然想用 Notificition 做一下提醒功能,当然,可以降级成过去 800 年的闪 Title 策略:

let shaking = false
setInterval(() => {
    if (shaking) document.title = `[Notification] ${word}!!`
    else document.title = word
    shaking = !shaking
}, 200)

但是实测效果还是不够显眼,最终在和群友的交流之后,发现了 <chrome://flags/> 。

Insecure origins treated as secure 中填写需要开启 Notification API 的域名,重启浏览器,就可以在 HTTP 中使用 Notification API 了。

如何从一个 Chrome 的 Bug 中找到解决方案

在前端开发,或者说 Web 开发中,我们会经常遇到,在某个浏览器遇到了问题,但是别的浏览器没有,过去,我们考虑的可能是 IE6 的兼容性,而在 Chrome 一骑绝尘的今天,Chrome 而其他浏览器没有的问题反而成为了更大的问题。

在此之前遇到过几个 Chrome Bug,我会以两个 Chrome Bug 为例说说实际是怎么解决的:

- 阅读剩余部分 -

给华硕 AC88U 路由器安排上 clash

下载版本

AC88U 需要的版本是 armv5 ,下载完成之后导入路由器,Country.mmdb 同理。

开机自启设置起来比较麻烦,我把下面的 iptables 放在了 firewall-start ,启动放在了 service-start里面。另外由于 daemonize 安装不了,所以直接 clash -d /jffs/clash > /dev/null 完事儿了。

- 阅读剩余部分 -

Typescript import 引用中的一个小坑

之前有一个奋斗了 N 小时才搞定的问题,在 Nestjs 的单元测试中反复测试会报类似于:

Starting Nest throws following error: Nest can't resolve dependencies of the EventResolver (EventService, ?). Please make sure that the argument at index [1] is available in the EventModule context.
Nest throws an error about a circular dependency that doesn't exist. Here is the error thrown:
Nest cannot create the module instance. Often, this is because of a circular dependency between modules. Use forwardRef() to avoid it. (Read more https://docs.nestjs.com/fundamentals/circular-dependency.) Scope [RootModule -> XXXModule]

- 阅读剩余部分 -

如何借助 5 道算法题入职 Leetcode

早早聊面试场逐字稿。

前言

开场先来标题党一下,和 Scott 聊天的时候正好说到我入职的经历,然后就有了这次分享,当时我随口报了一个,刷了 5 道题,不过后来我仔细的数了一下发现是 4 道题。

不过问题不大,这次半个小时的分享会从「招聘要求」、「怎么刷题」、「大小公司的区别」以及「*做业务和基础设施的区别」四个点进行分析。

- 阅读剩余部分 -

Apple In App Purchase(IAP) 实战

之前和 Flutter 开发的同学整了很久的 IAP,坑实在是太多了,所以需要一条条的来解释,如果有和我一样的倒霉鬼,希望通过这一篇集合的文章让大家在开发阶段更加顺利。

注:本文不会涉及 Native 的开发怎么写,因为我不会写 Native,也并不负责移动端的开发。

开发之前

在开发之前,App 的前情提要配置流程请见官方文档:App 内购买项目配置流程

在配置完成之后开发就可以开始了,但是在开发之前,你可能想要知道一些 IAP 的计费规则:

- 阅读剩余部分 -