背景

之前写过一篇文章《从开发chrome插件到插件系统设计》，主要讲述了如何开发一个chrome插件和chrome插件设计，感兴趣的同学可以再去看看。

目前主流web应用都是基于Vue、React等现代框架去开发，Chrome插件本身而言其实也是一个web应用，看它的组成部分popup.html + contentscript + background.js ，只需要在开发的时候调整一下构建脚本基本上就可以利用Vue、React等现代框架去开发了。

接下来，我们就一步步开始实战。

2023年读书计划

今年给自己的制定的计划，主要读书目标有以下几类：

• 给自己的创业带来理论帮助
• 给自己的职业带来成长
• 给自己的更加开阔的视野
• 解答一些人生疑惑
• 提高自己的做事效率
• 提高自己的表达能力或演讲能力
• 搭建自己的股市交易系统 more >>

背景

Typescript已经被前端广泛使用，如果你的项目还没有使用，建议赶紧使用起来，真的会对你的项目有足够的提升：

• 让你的每个变量都有变量声明
• 让你的每个方法找到其源头
• 让你能提前使用一些超前的JavaScript语法，如：注解(装饰器)@controller 等语法糖

但是使用的过程也会带来一些痛苦，比如你要做一个js lib库，如果用Typescript 开发确实可以帮助其他者快速使用，但是如果你没有注意Typescript的声明文件规范，很容易出现以下使用情况：

1
2
3
4
5

// 会直接从src目录去寻找
import { IClient } from 'xxx-lib/src/client.d.ts'

// 而我们所期待的使用是
import { IClient} from 'xxx-lib'

所以我们需要学习一下，如何更好的生成我们的Typescript声明文件。

MonoRepo实战：pnpm+nx搭建MonoRepo项目

背景

之前有写过几篇关于monorepo的文章，具体如下：

• 从npm版本依赖到Monorepo大仓项目
• 从lerna到初步了解和使用Nx(一)
• 从pnpm工具了解整个npm包核心管理原理

再次复习一下MonoRepo的概念：

Monorepo是包含多个不同项目的单一存储库，且不同项目之间具有明确定义的关系。

之前大多数是理论知识，能让我们知道pnpm 和nx 是什么，但是具体要到项目实战就有点懵，不知道从而下手，下面我们就一步步开始搭建pnpm+nx的Monorepo仓库。

PS：这里将会从已有项目中去开始踩坑，这里用的是之前做一个node-gptcommit命令行工具+一个chrome插件，将两个项目放到一个Monorepo仓库去管理。

背景

最近ChatGPT的技术概念很火热，我开发了一个node-gptcommit开源项目，主要利用GPT用来自动生成git commit的信息。

但是通过命令行工具来生成preview感觉有点不太友好，因此在想有没有另外一种可能将其变得更加好用，然后想到一个场景：

• 在合mr的时候，以及代码review，很多git commit 文件，需要一一个看

在这个时刻，自动生成commit信息就显得很有用，因此我的方案就是将node-gptcommit做成chrome插件，然后帮助MR的开发者能够快速了解此次MR的所有内容。

当然仅仅是开发一个chrome插件大家上网随便搜一下就知道怎么开发，因此为了本文更加有干货，需要更加深入的知识，所以本文分为两部分：

• Chrome插件开发，如何快速开发一个插件
• Chrome插件架构设计，了解Chrome插件背后的架构设计，以及前端插件架构体系

背景

最近开发一个页面碰到一个需求，需要对部分数据需要实时更新状态，面对这样子的场景，我们通常有以下几个方案：

• 轮询，利用setTimeout定时轮询
• WebSocket，利用长链接保持与服务通讯
• SSE，服务端推送机制

js模块化

前端主流模块化规范，目前有以下几种：

• CommonJS， Node.js提出的规范
• ECMAScript Module，ESM，由ECMAScript组织提出的JavaScript标准规范
• 已淘汰的有：CMD、AMD等，再就综合体UMD（支持各种规范的集合体）

因此，主流有两种规范CommonJS和ESM两种规范，但是由于Node.js不支持ESM规范，导致很多时候我们的项目里面并存两种规范的代码，从而出现下面这种情况：

1
2
3
4
5

// 在node端执行构建的时候
const _ = require('loadsh')

// 在浏览器端实现的时候
import _ from 'loadsh';

这样子开发就很容易出现痛点，往往我们的解决方案就是通过各种构建工具去解决，如：webpack vite，尤其是我们在写项目中写node.js编译脚本，经常需要切换。

但是从Node.js V14+版本后，它开始支持ESM规范啦，你可以直接在Node.js中使用import export等语法了，终于等到这一天😭。

百万富翁快车道

讲述的作者从失业游民到百万富翁的经历的一些过程，可以帮人开阔一些思维模式，从人行道、慢车道、快车道的方式去讲述一个人如何转到一百万。

如果想要快速赚到一百万，这里没有教你实际的方案，但是告诉你一些思维模式，所以我这边简单通过思维导图去进行汇总。

2023年的面试寒冬

从去年到今年各个大厂都在不断裁员，导致今年IT互联网行情很差，很多朋友都缺乏面试机会或者面试不通过。

程序员一旦要开始面试，很多朋友都开始循环以下几个步骤：

• 刷算法题，如：LeetCode各种困难程度的题目
• 背诵各种八股文，如：浏览器请求一个URL的完整过程
• 复习各种冷门知识，如：Promise.race(谁先返回就获取谁的结果，后面直接不处理)或Promise.allSettled(结果为Iterator对象，实现next())

也许以往这种复习模式还算不错，因为目前大多数面试流程基本上都是会问上述问题，而面试官问这些问题的最终目的是什么：

• 算法题，主要考的是逻辑思维能力
• 八股文，主要考的是基础知识是否足够扎实，知识深度是否足够
• 冷门知识，主要考的是知识广度，你除了目前使用知识点外还能拥有其他知识面

后续一些项目经验讲述，主要目的在于测试你是否真的参与到项目中，但是这个往往都是容易被忽略的点，这个放到后面再讲。

当下最火的IT技术，ChatGPT智能机器人出来后，它不像普通搜索引擎一样，需要去大量的结果去找到自己的答案。而是直接将答案提供给到你，让你可以更加快速实现功能。

如果ChatGPT普及开来，那么面试是否还需要考算法题和八股文吗？

或者换个问题，当AI技术可以代替绝大部分基础开发工作的时候，面对这种技术变更，作为普通开发者，我们应该如何做技术成长规划呢？

背景

自从上一次写完可以从ChatGPT学到什么(一)，简单对ChatGPT有一定了解后，其背后的技术原理是基于OpenAI GPT-3协议去实现的智能对话的。

再加上我看到国外有很多相关基于GPT开发的开源应用，因此萌生了自己动手搞一个，加上之前自己翻译了一篇文章有了GPT-3，再也不用手写commit message，他是基于Rust语言写，想着直接对着他照搬一个到Node.js版本，通过这种小项目实践，我们可以学习到：

• OpenAI提供了哪些模型算法
• 不同模型算法分别可以应用到哪些场景
• 真正调用OpenAI需要注意哪些事项