Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/kekkorider/threejs-starter
https://github.com/kekkorider/threejs-starter
glsl threejs webgl webgl2
Last synced: 5 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/kekkorider/threejs-starter
- Owner: kekkorider
- License: mit
- Created: 2020-11-15T16:21:12.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2024-08-21T14:48:10.000Z (5 months ago)
- Last Synced: 2025-01-18T08:12:05.272Z (12 days ago)
- Topics: glsl, threejs, webgl, webgl2
- Language: JavaScript
- Homepage: https://threejs-starter-demo.netlify.app
- Size: 354 KB
- Stars: 197
- Watchers: 5
- Forks: 18
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# ThreeJS starter
This is a general template for ThreeJS applications. It uses [ViteJS](https://vitejs.dev/) to create the bundle and [Tweakpane](https://github.com/cocopon/tweakpane) for live updates.
# Before we start
This has been developed with NodeJS `16.11.0`; it should work with other versions too, but in case something doesn't work I recommend to switch to version `16.11.0` with [nvm](https://github.com/nvm-sh/nvm).
## Setup
```shell
$ yarn install
```
## Develop
Run
```shell
$ yarn dev
```
then open a new browser window and navigate to `http://localhost:1234`
## Debug panel (Tweakpane + Stats.js)
The template uses dynamic imports to include the code to run the debug and performance panels. To display them, simply append `debug` to the URL's hash, i.e. `http://localhost:1234#debug`, or set the `debug` option to `true` in the app config object in `/src/index.js`.
## Physics (cannon-es)
Since `v1.5.0`, the template features a basic physics setup with [cannon-es](https://github.com/pmndrs/cannon-es) that can be enabled simply by appending `physics` to the URL's hash, i.e. `http://localhost:1234#physics`, or setting the `physics` option to `true` in the app config object in `/src/index.js`.
## Build
```shell
$ yarn build
```