https://github.com/weaponsforge/threexperiments

Testing threejs best practices
https://github.com/weaponsforge/threexperiments

javascript-modules threejs webgl

Last synced: 2 days ago
JSON representation

Testing threejs best practices

• Host: GitHub
• URL: https://github.com/weaponsforge/threexperiments
• Owner: weaponsforge
• Created: 2022-01-31T04:59:34.000Z (about 4 years ago)
• Default Branch: master
• Last Pushed: 2022-01-31T05:46:09.000Z (about 4 years ago)
• Last Synced: 2025-03-26T09:37:14.449Z (about 1 year ago)
• Topics: javascript-modules, threejs, webgl
• Language: JavaScript
• Homepage:
• Size: 563 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
## threexperiments

Hands-on experiments, concepts and best practices dev notes on ThreeJS [r134](https://github.com/mrdoob/three.js/releases/tag/r134) from the [DISCOVER three.js](https://discoverthreejs.com/) site.

![dev](assets/main.png)

### Requirements

1. NodeJS 12.16.3

2. ThreeJS [r134](https://github.com/mrdoob/three.js/releases/tag/r134)

## Installation

1. Clone this repository.  

`git clone https://github.com/weaponsforge/threexperiments.git`

2. Install dependencies.  

`npm install`

## Usage

1. Run the app.  

`npm run dev`

2. Checkout the following branches for reference:

   - **dev** - basic ThreeJS setup  

`git checkout dev`  

![dev](assets/dev.png)

   - **group-organize** - manage multiple meshes using the Group object  

`git checkout group`  

![group](assets/group.png)

   - **toy-train** - use ThreeJS primitives to create a Mesh  

`git checkout toy-train`  

![toy-train](assets/train.png)

   - **load-models** - load pre-built `gltf` 3D models  

`git checkout load-models`  

   - **animation** - animate and add events on the loaded `gltf` 3D models  

`git checkout animation`  

![animation](assets/animation.png)

3. Read the [wiki](https://github.com/weaponsforge/threexperiments/wiki) for more notes and information on ThreeJS.

## References

[[1]](https://discoverthreejs.com/) - discoverthreejs  

[[2]](https://threejs.org/manual/#en/fundamentals) - ThreeJS Fundamentals 

@weaponsforge  

20220131