# Angular template for Three.js

**URL:** https://discourse.threejs.org/t/angular-template-for-three-js/6581
**Category:** Showcase
**Tags:** examples, orbit-controls, angular
**Created:** [March 15, 2019, 8:53pm UTC](https://discourse.threejs.org/t/angular-template-for-three-js/6581 "2019-03-15T20:53:25Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![makimenko](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/makimenko/32/4900_2.png) [@makimenko](https://discourse.threejs.org/u/makimenko)
#### Post date: [March 15, 2019, 8:53pm UTC](https://discourse.threejs.org/t/angular-template-for-three-js/6581/1 "2019-03-15T20:53:26Z")

</div>

Sample template of Angular project with Three.js:

- Simplify new web project development with Angular and Three.js
- This template project can be quickly used as base instead of wasting hours of going through building instructions
- Standard Three.js library
- SceneComponent with basic usage of scene, camera, lights, axis helper, raytracer, renderer and collada model
- Enabled possibility to use non-moduled three.js code (eg OrbitControls and ColladaLoader). Some additional info: the things in threejs/examples/js/ haven’t been transformed to support modules yet, this makes them currently unusable from within environment such as Angular, more info: [threejs issue #9562](https://github.com/mrdoob/three.js/issues/9562). But nothing is not possible and sample includes one of working and simple workarounds.

[![](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/b/b4561269c6f4e22fd673d597ee61971cd99db944.gif)](https://github.com/makimenko/angular-template-for-threejs)

---

<div class="post-metadata">

### Author: ![makimenko](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/makimenko/32/4900_2.png) [@makimenko](https://discourse.threejs.org/u/makimenko)
#### Post date: [March 1, 2021, 1:02pm UTC](https://discourse.threejs.org/t/angular-template-for-three-js/6581/2 "2021-03-01T13:02:19Z")

</div>

Project extended with a new and fresh stuff (Storybook, Angular 11, new components and features):

[![](https://raw.githubusercontent.com/makimenko/files/master/angular-template-for-threejs/images/storybook.gif) ](https://github.com/makimenko/angular-template-for-threejs)

---

<div class="post-metadata">

### Author: ![marquizzo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/marquizzo/32/25192_2.png) [@marquizzo](https://discourse.threejs.org/u/marquizzo)
#### Post date: [March 2, 2021, 4:10am UTC](https://discourse.threejs.org/t/angular-template-for-three-js/6581/3 "2021-03-02T04:10:58Z")

</div>

It’s the Unix system from Jurassic Park!

[![](https://img.youtube.com/vi/dxIPcbmo1_U/maxresdefault.jpg "It's a unix system") ](https://www.youtube.com/watch?v=dxIPcbmo1_U)