Threejs及TypeScript教程
学习 Threejs、TypeScript 和 NodeJS 在网络上创建交互式 3D 内容
课程英文名:Three.js and TypeScrip
此视频教程共6.0小时,中英双语字幕,画质清晰无水印,源码附件全
下载地址
百度网盘地址:https://pan.baidu.com/s/11fq7xpyK2GWhU4P3M1FryQ?pwd=5f0c
课程内容
你将会学到的
-
通过许多演示和示例代码学习 Threejs 的基础知识
-
使用 VSCode、Git 和 NodeJS 设置开发环境
-
安装 TypeScript
-
使用 NPM 和 package json 创建 Threejs 项目
-
了解 Webpack、NodeJS、Express 以及为浏览器客户端提供 ES6 模块。
-
创建(或可选地安装)Threejs TypeScript 样板以在整个课程中使用
-
了解 Threejs 场景、相机和渲染器
-
了解动画循环
-
了解 Stats 和 Dat GUI 面板
-
了解 Object3D 基类,以及 Rotation、Position、Scale、Visibility 和 Matrix 属性
-
了解几何形状,例如 Box、Sphere、Icosahedron、Plane、TorusKnot 等
-
了解 Basic、Normal、Lambert、Phong、Standard、Physical、Matcap 和其他材料
-
了解 SpecularMap、RoughnessMap 和 MetalnessMap 的突出显示选项
-
了解凹凸贴图和置换贴图
-
了解如何使用材质选项修改纹理和置换贴图 UV。
-
了解使用环境光、定向光、半球光、点光源和聚光灯的照明。
-
Mipmap、自定义 Mipmap 和各向异性过滤
-
了解使用 Perspective 和 Orthographic 阴影相机的阴影。
-
了解 Orbit、Trackball 和 Pointerlock 鼠标和触摸交互控件
-
了解模型加载器,例如 OBJ、MTL、GLTF、DRACO 等
-
导入第三方 FBX 和 glTF/glB 动画
-
创建自定义动画并从 Blender 导出为 glTF/glB
-
使用 Raycaster 以及如何使用它在场景中拾取 3D 对象,
-
Cannonjs 物理
-
Cannonjs 调试渲染器
-
了解用于碰撞检测的凸多面体与复合形状
-
配置、部署和启动我们的 Threejs 项目到生产服务器
-
安装 Nginx 代理,指向一个域名并安装 SSL
-
将模块说明符与 Webpack 与相对导入引用一起使用
-
还有更多非常有用的 Threejs 示例
课程内容
1 个章节 - 78 个讲座 - 总时长 9 小时 22 分钟
介绍78 个讲座 - 9 小时 23 分钟
要求
-
一台可以安装 VSCode、Git 和 NodeJS 的计算机
-
渴望在 Threejs 和 TypeScript 中编写 3D Web 应用程序
说明
欢迎来到我的 Three.js 和 Typescript 课程。
在本课程中,我们将学习有关 Three.js 的所有知识,用 TypeScript 编写它,并使用 Webpack 和 NodeJS 编写 HTML 客户端和服务器组件。
该课程分为5个主要部分,
-
设置开发环境并安装 TypeScript
-
创建 Three.js 样板项目。这部分是可选的,你可以在第 3 部分中安装一个预先构建的样板,但是从头开始手动构建它将使你对从头开始创建一个新的 Three.js 项目所涉及的方面有一个很好的理解。
-
安装 Threejs Course Boilerplate,以防你在第 2 部分中没有手动创建它。
-
了解 Three.js 的所有方面,从核心到在更高级的示例中使用它并涉及其他第三方库。
-
部署到生产。我们将研究你在 Internet 上公开托管 Threejs 项目的几种不同选择。
随附文档中提供了所有代码,以便你可以轻松复制和粘贴,以防你不想暂停视频并从屏幕复制。文档链接位于每个视频旁边的资源中。
TypeScript 在我们的代码中引入了类型安全,使其更加健壮,并为 IDE 提供了额外的工具,例如智能,我们可以使用这些工具来帮助我们更准确、更快地找到和理解可用的 Threejs 属性和方法以及代码。
感谢你参加我的课程,我们会在那里见到你。
肖恩
此课程面向哪些人:
-
有兴趣学习 Threejs 的人
-
有兴趣学习 TypeScript 的人
-
有兴趣在网络上创建交互式 3D 应用程序、游戏或可视化的用户
-
想要充分了解 Threejs、TypeScript 和 NodeJS 以使其有用的人