Three.js 和前端技术结合使用 - 文章教程

Three.js 和前端技术结合使用

发布于 2021-08-26 字数 2112 浏览 983 评论 0

学习 Three.js 的群体有些是前端工程师,对前端知识很了解,有些是非前端出身,对前端了解很少。初学 three.js 对前端的要求并不高,只要对 HTML、CSS、JavaScript 知识简单学习即可。如果开发项目的话,作为 WebGL/Threejs 工程师对前端掌握程度肯定要和普通前端工程师一样,除非你的工作都是围绕底层图形学内容进行,这样的话对前端要求比较低。Web3D 项目都是运行在前端Web页面浏览器环境,WebGL 工程师需要和普通前端工程师一样写一些和 3D 场景交互前端UI组件,比如按钮、进度条、拖动条等等。

下面的阐述默认你对前端内容不是很了解。

如果你初次接触 WebGL 和 Threejs,对前端并不了解,建议你按照下面关键词顺序去百度了解。

关键词:HTML、CSS、JavaScript、jquery、vuejs、nodejs

原生 HTML/CSS/JavaScript

如果你没有前端基础,初次接触 WebGL/Threejs,如果有编程基础的话,建议你首先花费几天时间简单了解 HTML、CSS 和 JavaScript 基础知识。稍微有一些前端基础,就可以直接学习Threejs相关课程。

如果你想开发一个Web3D项目,肯定不能只是简单了解一下 HTML、CSS 和 JavaScript,需要深入学习 HTML、CSS 和 JavaScript,还需要学习 jquery、Nodejs、Vuejs 等相关知识。

jQuery 库

jQuery 是一个非常流行的操作 DOM 的库,相比较直接使用原生 JavaScript 要方便些,可以去了解下。

对于一个非常简单的 threejs 项目,你可以使用原生 HTML/CSS/JavaScript 去写UI界面,如果为了更加方便可以使用jquery.js前端库。

前端框架 vuejs

随着前端项目越来越多复杂,交互性越来越强,使用前端框架进行开发势在必行,Vuejs是国内应用比较广泛的框架之一,类似的前端框架还有Angular和React。在Threejs项目中使用哪一个,你可能会思考,个人感觉你熟悉哪个或者说公司用的哪个就使用哪个前端框架。如果你都不了解的话,建议先学习vuejs,先对前端框架有一定的认识,使用vuejs等前端框架相比较使用jquery更适用于大型项目。

Nodejs

作为一个前端工程师或者说 WebGL/Threejs 工程师,肯定要对 nodejs 有一定的了解,比如通过 Nodejs 搭建一个本地服务器,通过 Nodejs 写一个项目的开发环境。

UI 组件

使用 Threejs 开发项目的时候,你可能需要写一些前端组件,比如按钮、进度条等。你可以不借助库或框架,直接使用原生 HTML/CSS/JavaScript 去写,也可以找一些开源UI组件库,比如基于 vuejs 框架的UI组件库element-ui。

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

目前还没有任何评论,快来抢沙发吧!

关于作者

清晨说ぺ晚安

我之所以活到现在的全部意义,是为了此刻能对你说,我爱你,我会在你身后永远守护你。

16 文章
2 评论
21682 人气
更多

推荐作者

魏剑帆

文章 0 评论 0

yanggwq

文章 0 评论 0

qq_c2gI5

文章 0 评论 0

qq_iQVWB

文章 0 评论 0