- 博客(53)
- 收藏
- 关注
RSS订阅原创 【threejs】一天一个小案例讲解：窗口自适应
今天的用例不止是关于three，还是前端开发者经常需考虑的自适应问题，或许它看着不轻不重，却表达了我们对用户体验的重视程度，同样笔者最近搞侧边导航也是深受各类自适应困扰。
2025-06-29 14:32:14
359
原创 【threejs】一天一个小案例讲解：控制面板（GUI）
摘要：介绍使用dat.GUI库创建Three.js场景控制面板的方法。主要内容包括：1)安装dat.GUI；2)使用步骤：初始化GUI、设置参数、添加控件、更新场景；3)常用API：数值滑块(gui.add)、颜色选择器(gui.addColor)、自动生成控件、按钮方法调用等；4)核心代码示例展示如何创建GUI面板并添加旋转速度和弹跳速度控制滑块。该工具可方便地调整Three.js场景参数，提升开发调试效率。
2025-06-22 22:29:18
330
原创 【threejs】每天一个小案例讲解：常见材质
• 使用要点：需编写vertexShader（顶点着色器）和fragmentShader（片元着色器），并通过uniforms传递参数。• 特点：基于物理渲染（PBR），支持金属度、粗糙度等物理属性，响应环境光和直射光，效果更真实。• 特点：自定义GLSL着色器代码，灵活性极高，可实现复杂视觉效果（如动态流体、发光效果）。• 适用场景：静态背景、2D界面元素、不需要光影效果的模型（如线框模型）。• 适用场景：大多数需要真实光影效果的模型（如金属、石材、塑料等）。
2025-06-12 22:32:55
746
原创 【threejs】每天一个小案例讲解：常见几何体
• 示例：new THREE.TorusGeometry(3, 1, 16, 32)（环半径3，管道半径1，分段数16和32）。• 示例：new THREE.CylinderGeometry(1, 1, 5, 32)（上下半径1，高5，圆周分段32）。• 示例：new THREE.ConeGeometry(2, 5, 32)（底面半径2，高5，圆周分段32）。• 示例：new THREE.SphereGeometry(5, 32, 32)（半径5，经纬分段各32）。
2025-06-10 23:41:28
965
原创 【threejs】每天一个小案例讲解：光照
可自行clone，无需安装依赖，直接liver-server运行/直接打开chapter01中的html文件。
2025-06-08 17:17:01
596
原创 【threejs】每天一个小案例讲解：创建基本的3D场景
可自行clone，无需安装依赖，直接liver-server运行/直接打开chapter01中的html文件。如果有帮助，请为我的github点个小星星哦~我会持续更新的！
2025-06-06 00:08:15
380
2
原创 【TypeScript】知识点梳理（四）
没事去翻翻官网文档，其实有很多用法是我们还不知道的，官方资料总是最权威的，也推荐大家无聊看看各个官网hhh，不一定是记忆，但在某种场景下我们或许能想到还有多一种解决方式#
2025-05-24 17:01:59
415
原创 你引入的lodash充分利用了吗？
开发中，发现自己只有cloneDeep的时候才想起来用这个库的便利，搜索了项目内代码，发现大家基本也是这样，其实我们错过了很多好东西#
2025-05-18 23:35:35
304
原创 聊聊解构的那些事
解构定义#我们都知道es6出了个新特性，支持解构，使用过的人可能都觉得挺简单的，但有一些小点，只有使用中留意了或者踩坑了才发现我们认识的还很浅#解构定义允许按照一定模式，从数组和对象中提取值，对变量进行赋值。
2024-10-30 00:55:09
382
原创 【AI辅助】AWS Toolkit+AmazonQ
偶然看到网上某up主用的这个AI工具，感觉还挺实用的，推荐大家~我们不可阻挡AI的攻势，但是成为利用它的人，也是反侵占的方式呢#
2024-10-27 10:31:41
599
原创 【React+TS+Antd+Vite】实现日常待办处理（含代码）
结合React、typescript、Vite这些目前的火热前端技术，浅写一个TodoList，有需要可以guthub直接拉下来看，有任何建议和需要可以提出来，我会不断优化#实现功能新增待办待办处理删除待办过滤恭喜完成。
2024-10-20 20:26:48
355
原创 【JavaScript】Array的去重的实现
共同点：引用数据类型不去重，其实也可以理解，引用数据类型表现一样，但指向地址不一，这时候其实它们就是两个东西。好像有点抽象，可以结合搜索原始数据类型与引用数据类型的区别。#手动实现一个数组去重方法，返回新数组，不改变原数组#
2024-10-19 11:05:33
188
原创 【git】本地玩坏了不必重新clone
没错，事情发生的起因就是我把本地玩坏了……然后傻乎乎地打算rm掉重新再clone，巨慢真的，然后我就又被涨知识了，git reset用起来~
2024-10-11 23:52:52
383
原创 【TypeScript】抽象类 interface type的异同
抽象类 interface type相似点很多，容易混淆使用#interface和type都可以定义对象结构，大多场景可互换。定义类的格式，既可以包含抽象方法，也可以包含具体方法。定义类型别名、联合类型(|)、交叉类型(&)更专注定义对象和类的结构，支持继承、合并。只能描述结构，不能有具体实现。抽象类（abstract）抽象类（abstract）
2024-10-08 22:46:27
291
原创 【TypeScript】知识点梳理（三）
void前面提到了代表空，但有个特殊情况，是空不是空，细谈是取舍，但我们不深究hhh#定义了空，返回非空值，理论上不正确，但编译成功。但是，即使拿到了值，void其中一个特点就是。调用者不应该依赖该返回值进行任何操作。，所以依旧是有限制的。
2024-10-06 21:03:58
291
原创 【TypeScript】不想成为any工程师的挣扎中……
试过补充undefined / 类型断言 / 引入RefObject，但都行不通，用any也不合理呀……虽然不提示了，但治标不治本~#前面写了一个react+ts的案例#但是编译器总是报出类型不匹配。
2024-09-10 00:38:28
197
原创 【React】Hooks混合应用
官方现在也是推荐使用函数式组件，非类式组件，那没有了this就不太好操作，这时候就需要使用到hooks#）,会故意使组件重新渲染两次，以便更容易发现潜在的副作用和其他问题。最常用的有useRef、useState、useEffect。Q： useEffect首次渲染为什么打印了两次？今天结合这三个写了一个案例。A： 开启了严格模式（
2024-09-10 00:28:06
252
原创 【webpack】配置加载器
使用原因：webpack本身只能处理js模块，但通过Loader也可以转换其他类型文件。总的来说，第一种以加载器为编写维度，第二种以处理文件类型思考。loader--处理模块文件的转换工具。适用于 webpack 1.x版本。适用于 webpack 2.x版本。匹配的文件指定对应的加载器数组。
2024-09-06 11:50:17
323
原创 【React+Antd】时代在变迁，它们在进化
1. 这段用的ts，document.getElementById('root')!是一个非空断言操作符，用于告诉编译器结果不会是null或undefined。2. StrictMode开启严格模式，帮助在开发过程中发现潜在的问题。React从我学习用的17也升了一个大版本到18辽。Bilan：框架都在改进借鉴，不持续学习怎行捏……的RTL版本还是4.24.16，未来可期~新入口函数，用于创建一个新的React根。以前考虑到文件大，还得按需引入。#果然一阵不碰就更新换代#使用趋向友好，但目前。
2024-08-28 00:07:45
336
原创 【svg】关于颜色的那些事
但是在让UI设计师切图后，肉眼看总是觉得同一颜色编码下，svg格式图片和style设置颜色的不一样，但是放大svg图片后看着又一致了，总的来说：色块密集了，肉眼看着颜色加深了，好比一群松散的人和紧挨的人群看上去的乌压压的程度……#开发中用到的图标除了组件库提供出来的icon，还有本地文件：png、img、svg#……可能和编码方面关联不大，但是。
2024-08-21 23:54:38
655
原创 【CSS】webpack插件mini-css-extract-plugin
这个标题有点东北铁锅大乱炖那味了……##其实就是要介绍项目中使用到的。
2024-08-21 00:31:51
389
原创 【Less/Sass】批量生成样式
平时我们总是循规蹈矩写死样式，习惯思维 A is A， B is B，最近也是学到了一种新方式，CSS里也是可以像执行function一样，批量生成样式，减少重复相似的样式定义#
2024-08-19 23:50:09
321
原创 【TypeScript】Triple-Slash Directive引用文件
工作中的一个乌龙，还是源于知识的薄弱……#规范上约定不提交注释代码，我就去提醒了……#原来一点毛病都没有，这是正确的写法，和注释没有半点瓜葛……
2024-08-15 23:21:26
160
原创 【CSS】align-items和justify-content傻傻分不清
最近也分享过垂直居中的几种方式，其实就提到了align-items和justify-content，其实在开发中我也常混淆哪个是纵轴的哪个是横轴的，但因为他俩总是成对出现，直接俩center完事。但是吧，偶尔也是想起来又查一查……以后，想起来align-items有items证明这个方向是可以有n个轴的，遂指向交叉轴；justify-content是对应一个content，故为主轴。》，也帮助我成功记忆住了。虽然主旨不是帮我们区分横纵，但是看完这个，再结合这图，一下也就清晰了。
2024-08-13 23:42:26
283
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人