- 博客(555)
- 资源 (20)
- 收藏
- 关注
原创 [React 进阶系列] useSyncExternalStore hook
这个新的 hook 可以监听到 React 外部 store——通常情况下可以是 local storage/session storage 这种——的变化,随后在 React 组件内部去更新对应的状态官方文档其实解释的比较清楚了,使用监听的 store 必须要实现以下两个功能:subscribe其作用是一个 subscriber,主要提供的功能在,当变化被监听到时,就会调用当前的 subscriber。
2024-07-15 19:48:14
1080
原创 yup 基础使用以及 jest 测试
写在前面的一些碎碎念……与具体功能无关,想要跳过的话可以直接跳到下下个 section 进入实现。这次尝试用了 vite 而不是 webpack 的 cra,发现开发过程中真的是快很多,也许下下个 initiative 确实会从 webpack 的 cra 转变到 vite。
2024-07-15 08:20:17
1187
原创 [spring] Spring MVC - security(下)
前面的实现都是用默认的 spring boot 实现,即用户的表为users,而权限的表单为。但是在实际的应用场景中,更多的业务情况是需要使用更特定的表名。spring 同样也有对这个需求的支持,其实现方式则需要写少量的 sql 语句这里需要更新的也是,之前是直接返回@Bean。
2024-07-08 09:45:44
937
1
原创 [spring] Spring MVC - security(上)
这里有 3 个步骤要去做:重新写 spring 的安全配置,使用自己的 HTML 模板取代 spring boot 内置的 HTML 模板// 省略 inMemoryUserDetails 的实现@Beanconfigurerform主要是用来处理 HTTP 请求,对其进行安全处理则是具体对 HTTP 请求进行安全处理的配置代表所有的 HTTP 请求都必须要进行安全处理,即登录验证简单的说,访客是没有权限访问当前应用formLogin是表单登录验证这里主要进行 3 个处理。
2024-07-07 10:40:33
1053
原创 [spring] Spring MVC - CRUD 操作
除了 Rest API 部分改成了 Controller 之外,其他没什么变化,还是使用这个实现方式,因此关于 CRUD 的部分——即 hibernate 实现的部分,这里不会过多涉及也因此,这部分的代码实现应该还是挺快的,毕竟主要还是 HTML 模板+controller 实现。
2024-06-24 05:40:42
1108
原创 [spring] Spring MVC & Thymeleaf(下)
Spring 提供的验证肯定没有办法满足所有的需求,这个情况下就需要开发手动实现自定义验证具体的实现步骤如下:创建一个自定义验证规则这里会使用@interface去创建一个注解的 interface,并且实现注解Constraint;Retention;
2024-06-23 09:44:09
1231
原创 [spring] Spring MVC & Thymeleaf(上)
本章内容主要过一下简单的 Spring MVC 的案例简单来说,spring mvc 就是比较传统的网页开发流程,目前 boot 是可以比较轻松的配置 thymeleaf——毕竟 spring boot 内置对 thymeleaf 的支持thymeleaf 是一个模板引擎,目前看起来是简单很多——我还依稀记得当年使用 JSP 写 spring mvc 的日子,那写的是真的很痛苦……
2024-06-10 09:37:38
758
原创 [docker] docker 安全知识 - 镜像,port & registry
这是第一篇,安全部分还有一篇笔记就记完了说实话,看完了要学的这些东西,感觉大多数安全问题都可以通过验证登录的合法性去解决。
2024-05-28 05:35:07
1328
原创 [docker] docker 安全知识 - docker 系统性简介
今年的 security training 选的 topic 就是 docker 了,为了过这个 training 于是先把 docker 过了一遍(笑死之前干啃的时候确实觉得不太能看下去,不过走了一遍实践之后发现就比较好理解。
2024-04-27 11:42:12
1095
4
原创 [docker] 多容器项目 - PHP+MySQL+Nginx+utility containers
这个项目总共会配置 6 个容器,主要还是学习一下 docker 的使用和配置,目标是:本机不安装 PHP、Nginx安装部分全都交给 docker 容器实现可以运行一个 Laravel 网页项目修改本机代码可以即时更新网页大概流程是这样的:fill:#333;color:#333;color:#333;fill:none;utilitynpmComposer主机只负责保存必要的源码,PHP 容器会读取本机变动的源码,随后进行必要的更新。
2024-04-27 00:09:02
1311
原创 [docker] docker compose
是一个简化运行 docker 指令的工具,它可以部分代替和docker run指令,但是无法取代 docker 指令,更不会取代容器和镜像。它可以运行单个或多个容器,通过运行 YAML 配置好的文件建造镜像和运行容器不过有个缺点,它无法管理不同 hosts 上的容器——这个需要通过 类似于 docker swarm/kubernetes 这样的工具去进行管理。
2024-04-24 08:48:40
986
原创 [docker] 多容器项目
相当于把之前学的一些东西全都整合一下,做一个小型的项目:fill:#333;color:#333;color:#333;fill:none;DBBackendFrontend这里的数据库、前端、后端可以为任何框架,并不指定为特定框架。
2024-04-23 10:28:29
828
1
原创 [docker] 网络连接
使用 docker 容器会遇到下面 3 种情况:容器与万维网之间的交流默认情况下是允许的从容器到本机的交流假设有一些服务运行在本机,如数据库,而 docker 需要和本机进行交流去获取数据这个实现需要配置容器与容器之间的交流这个是比较常见的用法了,同样需要配置。
2024-04-22 10:13:06
684
原创 [docker] volume 补充 & 环境变量 & 参数
这里补充一下 volume 剩下的内容,以及添加参数(ARG) 和 环境变量ENV的内容。
2024-04-22 02:01:05
1000
原创 [docker] 数据的持久化 - Volume & bind mounts
和 1 个容器进行绑定不和任何一个容器进行绑定,可以复用基于 host 的文件系统,不和任何一个容器进行绑定持久化不完整,容器被删除则无法溯源容器的生命周期不影响持久化的数据,使用进行删除容器的生命周期不影响持久化的数据,需要将 host 上的文件进行删除无法被共享可以被共享可以被共享无法被复用可以被复用可以被复用。
2024-04-17 09:52:31
936
原创 [node 库推荐] rosie 测试用生成数据
这里用一个比较简单的User作为案例好了,比如说Userid: number;其中sequence类似于 id 生成users;users;那么就能够生成 10 个随机的用户信息。
2024-04-17 05:37:06
443
原创 [docker] 核心知识 - 概念和运行
images/镜像:template(模板)/blueprints(蓝图),包含所需工具、代码和源码的运行时containers/容器:软件的运行单元本质上来说,这个方法就是提供一系列指令让 docker 去运行去创建一个新的镜像,随后运行该镜像最简单的方式是创建一个 Dockerfile,将对应的指令写入到 Dockerfile 中,随后运行该 Dockerfile 去创建新的镜像。
2024-04-15 11:33:11
973
1
原创 [spring] rest api security
---------VALUES--------VALUES这里会创建两个新的表去建立关联:其中 role 等同于 auth,members 等同于 user⚠️:这里新修改的密码是fun123。
2024-04-14 13:25:50
620
原创 [spring] Spring Boot REST API - 项目实现
书接上文,一些和数据库相关联的注解在主要的 layer 如下:fill:#333;color:#333;color:#333;fill:none;
2024-04-12 14:14:54
1082
1
原创 [Angular 基础] - 表单:响应式表单
),}),});效果如下:,其原因是因为在调用了,因此需要绑定对应的 scope,否则 Angular 会因为this的指向变更而找不到。⚠️:这是 JavaScript 的问题,与框架无关这个实现和自定义验证类似,不过返回的对象是null,),}),});}, 1500);});效果如下:可以看到,当输入为时,又过了大概 1.5s 之后,输入框才跳为红色——这是之前加的出现 error 的 CSS。
2024-03-11 10:36:31
629
原创 [Angular 基础] - 表单:模板驱动表单
Angular 内置两种表单的支持,这篇写的就是第一种,即模板驱动表单 (Template-Driven Form)Template-Driven Form 的实现比较简单,Angular 自身会生成和提供对应的表单控制和管理状态,对于开发者来说,实现相对而言更加简单,因此更加适合简单的表单实现。
2024-03-10 12:38:17
1292
1
原创 [Angular 基础] - Observable
我以前对 Observable 的理解是,重新了解了一下,感觉这个说法不太对。更准确一些的说法应该是,只不过大多数情况下,这个events是一个 Promise 而已。比如说routes的变化不属于 Promise,但是它是一个 event,也就自然可以被放到 Observable 里面去进行监听。大多数 rxjs 相关的内容都在 rxjs 的 observable 里面说过了,这里主要记一些 angular 相关的知识,之后有需求的话继续拓展。
2024-03-09 05:26:21
1060
原创 [React 进阶系列] React Context 案例学习:使用 TS 及 HOC 封装 Context
根据项目经验是这样的,自从换了 TS 之后,就再也没有二次封装过了使用 TS 真的可以有效解决 typo 和 intellisense 的问题这里依旧使用一个简单的 todo 案例去完成。
2024-03-08 05:52:22
974
原创 第一个 Angular 项目 - 添加路由
前置项目是,之前的切换页面使用的是ngIf对渲染的组件进行判断,从而完成渲染。这一步的打算是添加路由,同时添加 edit recipe 的功能(同样通过路由实现)
2024-03-06 05:24:22
1178
原创 [Angular 基础] - routing 路由(下)
这也是一个相对而言比较粗暴的处理方式,大多数的应用都会渲染一个 not found 页面,而不是直接显示一个空白屏幕。时,后置的 query parameters 全都丢了,这也是 Angular 的默认行为,想要改变这个行为,需要在 click handler 中进行处理,下面是对于。⚠️:Agular 的路径 match 是通过前缀实现的,在 not found page 这个案例的情况是 wildcard,不会造成任何的问题。下面声明一个新的路径,去采用重新渲染子组件的方式去进行重定向。
2024-03-05 19:59:10
1251
1
原创 [Angular 基础] - routing 路由(上)
终于到 routing 了……这部分的内容比我想象的要复杂很多,果然 Angular 的学习曲线不是开玩笑的 ¯\_(ツ)_/¯。
2024-03-03 11:11:38
1120
原创 第一个 Angular 项目 - 添加服务
这里主要用到的内容就是提到的前置项目在这里查看想要实现的功能是简化和recipe之间的跨组件交流层级结构相对来说还是有一点点复杂的,所以如果在app层构建一个对应的变量和事件再一层层往下传,无疑是一件非常麻烦的事情(尤其 V 层和 VM 层都要进行事件传输的对应变化),而使用 service 就能相对而言比较简单的解决这个问题。
2024-02-23 13:40:01
1167
1
原创 [Angular 基础] - service 服务
之前的笔记就列举三个好了……没想到 Angular 东西这么多(ー ー;)……全加感觉越来越凑字数了Angular 的 service 如果后端出身的应该很熟悉,它是 Angular 自行管理,并使用 Dependency Injection 去实现的一个类。因此它比较合适使用的场景是,多个嵌套组件需要互相沟通,并需要传递值。这个情况下,a如果需要和d与e进行沟通的话,那么bc@Inputadebc@Outputdea这就是一个不可避免的沟通环节。使用 service 就可以比较有效的解决这个问题。
2024-02-22 00:35:34
1423
原创 [Angular 基础] - 自定义指令,深入学习 directive
这篇笔记的前置笔记为,对 Angular 的 directives 不是很了解的可以先过一下这篇笔记。
2024-02-20 14:10:51
1731
原创 第一个 Angular 项目 - 动态页面
以上为静态页面,即不涉及到跨组件交流的内容以下涉及到组件内的沟通,从这开始数据就“活”了这篇笔记结合新学的绑定知识,盘活数据。
2024-02-19 01:49:05
1161
原创 [Angular 基础] - 生命周期函数
以上为静态页面,即不涉及到跨组件交流的内容以下涉及到组件内的沟通,从这开始数据就“活”了看了一下,从 v2 开始的生命周期好像就没变过,这是从 archive 的 v2 官网上拉下来的一张图:数量和顺序都是一样的,蓝色部分则是与 投射(projection) 有关这篇笔记相对而言比较枯燥是真的……也没办法……
2024-02-18 08:46:44
1241
1
原创 [Angular 基础] - 视图封装 & 局部引用 & 父子组件中内容传递
以上为静态页面,即不涉及到跨组件交流的内容以下涉及到组件内的沟通,从这开始数据就“活”了下面的例子依旧会沿用这里创建的项目。
2024-02-18 06:07:19
1256
原创 [Angular 基础] - 自定义事件 & 自定义属性
首先是从渲染和开始,所以需要将cockpit内的东西注释掉,以防报错如果不会报错的话则可以忽略,我后面又做了点修改……有的时候会想要设置 alias,而非使用传递过来的变量名——比如说可能父元素会创建一个事件然后传递event到子元素中,子元素则可以根据需求去重命名这是一个mouseEventinputEventformEvent// () 内的才是父组件里使用的变量名这个时候,对于当前组件来说,可访问的变量为,因此 V 层也需要进行对应的修改:</stylecolorred</</</</
2024-02-08 00:19:12
1737
原创 第一个 Angular 项目 - 静态页面
这是在学完了上面这三个内容后能够完成的项目,目前因为还没有学到数据在不同组件之前的传输,因此只会有一个 UI 的渲染,而不会涉及到事件的实现。
2024-02-07 00:38:51
1568
原创 [Angular 基础] - 指令(directives)
就像中文翻译一样,directives 就是指令,它就是一系列 DOM 中存在的指令。
2024-02-05 21:19:58
1536
JavaScript实现区块链功能
2023-05-09
JS array数组部分功能实现
2022-05-22
jQuery炫酷应用实例集锦 JQ3.0 重写版
2022-05-08
typescript-handbook.pdf
2021-04-09
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人