🗒️ NestJs 集成Redis

在日常开发中,需要处理一些高并发的请求或者处理用户邮件认证等一些场景。那么就需要Redis了。 Redis 是一个开源的内存中数据结构存储系统,它可以用作数据库、缓存和消息中间件。

🗒️ 基于esbuild搭建组件开发框架

在日常的前端开发中,经常需要开发一些组件。通常我们是基于某个特定的框架来开发,例如vue,react等等。对于页面的样式组件来说,没有什么太多的计较。但是如果开发一个画布工具或者一个音乐播放器的组件,那么这个组件必然会有很多功能,而且对于vue2/vue3,react版本,你可能每个都要开发一遍。那么web-component的开发理念就非常适合目前的需求了。但是通常的web-cmponent的开发中,对于JS我们可以很好的管理,拆分功能。但是对于dom样式的编写就极其不方便了。

🗒️ JS模块的导出和引入

前端开发中经常遇到import,export这种导出和导入,同时也能遇到module.exports这种,那么他们到底是什么呢?

🗒️ TypeScript--装饰器

TypeScript中的装饰器是一种特殊的语法,可以用来修改类、方法、属性或参数的行为。装饰器是一种函数,它接收一个目标对象或一个属性描述符作为参数,并可以返回一个新的对象或属性描述符,或者不返回任何值。装饰器可以用来实现一些常见的编程模式,例如依赖注入、日志、缓存、验证等。

🗒️ Vue3 + Vite + Ts + Axios + Pinia + VueRouter 配置

本文记录一下Vue3的一个基本的开发框架的搭建。主要在公司开发业务,主体框架不用每次都搭建。时间长了就容易忘记了,当初的框架如何搭建的。文章记录的框架搭建的主要实现功能如题,然后研究一些快捷的操作。例如,ts定义的空间自动导入等等。

🗒️ Vue3和Vue2的一些写法区别

本篇记录vue3和vue2在实现相同的逻辑上的一些语法差异,持续更新。

🗒️ vue3源码学习11-h方法和createVnode方法实现

在实际开发中,经常用到h方法来实现页面,常见的组件中也有render,h这种写法。例如iview的table中

🗒️ vue3源码学习10-runtime-dom实现

前面主要是vue的源码仿写,最主要的是vue的响应式,以及依赖收集。是一个简易版本,和官方源码还是有很多细微差别的,例如数组代理之后改变数组长度,会触发更新之类的。数组还会被收集长度这种依赖关系,以及数组的一些splice,push,shift,unshift,pop这些方法重写,来完成修复一些数组在vue依赖更新中的BUG。

🗒️ vue3源码学习-9-ref的实现

在页面编写中,之前都是使用reactive来包裹对象,这样对象属性的值改变,其对应的effect包裹渲染动作就会被触发。并且通常有函数解构的操作,例如let people = reactive({name:"张三",age:24}); let {name,age} = people;。如果这么结构操作的话,name和age就会变成普通的变量,那么如果在effect中使用的话,就算改变了值也不会触发回调函数。那么为了解决例如此类的需求,vue3提供了ref、toRef、toRefs。

🗒️ vue3源码学习-8-watch

本文学习编写watch功能函数。首先,先去使用下官方的watch做一些简单的小功能测试。

🗒️ vue3源码学习-7-computed的实现

回顾上期的内容,编写了effect中的调度器,主要修改了effect.ts文件。在预览之前的代码的时候会发现一些优化的地方。 在vue代码的需求编辑中,会遇到这样一个例子。例如一个人的姓名分为姓和名,那么我希望在页面上打印出这个人的姓+名,而且在姓或者名改变的时候,页面渲染也会改变。那么就用到了vue的computed来进行操作。旧版的vue2中computed是基于watcher实现的。vue3则是基于effect来实现。另外vue3中的computed写法叫组合式API,而vue2是拿data中的属性来编写computed中的属性,这种叫选项式API(option)。具体的vue3写法如下