# ThreeJS to create 3D configurators in Realtime

**URL:** <https://discourse.threejs.org/t/threejs-to-create-3d-configurators-in-realtime/19980>\
**Category:** Questions\
**Tags:** 3d-applications\
**Created:** [October 21, 2020, 8:42am UTC](https://discourse.threejs.org/t/threejs-to-create-3d-configurators-in-realtime/19980 "2020-10-21T08:42:48Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![MaxK](https://avatars.discourse-cdn.com/v4/letter/m/858c86/32.png) [@MaxK](https://discourse.threejs.org/u/MaxK)\
**Post date:** [October 21, 2020, 8:42am UTC](https://discourse.threejs.org/t/threejs-to-create-3d-configurators-in-realtime/19980/1 "2020-10-21T08:42:48Z")

</div>

Hello,

I am a graphic artist and realise 3D models in real time on WebGL basis. Now I would like to program a configurator on my own like on the following [website](https://viscircle.de/3d-configurators/?lang=en). What is the best way to start?

Thanks.

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [October 21, 2020, 2:12pm UTC](https://discourse.threejs.org/t/threejs-to-create-3d-configurators-in-realtime/19980/2 "2020-10-21T14:12:54Z")

</div>

1. It is hard.
2. It is complex.
3. It takes a lot of time, even for experienced developers.

If you don’t know programming at all - first learn Javascript (well, without using 3D.) If you know Javascript - learn state management (well, using React, frameworks or anything else.) If you know Javascript and state management - learn package bundlers (webpack / rollup.) If you know Javascript, state management, and bundlers - `npm install three` and it’s time for you to [discover three.js](https://discoverthreejs.com/).

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [October 21, 2020, 2:23pm UTC](https://discourse.threejs.org/t/threejs-to-create-3d-configurators-in-realtime/19980/3 "2020-10-21T14:23:40Z")

</div>

Developing a product configurator requires a certain amount of user interface logic. However, depending on your requirements it’s not necessary to work with UI libraries like React or Vue. You can implement basic stuff with plain JS and thus avoid over-engineering with all its evil consequences. If you are new to `three.js`, I suggest to implement the configuration workflow without a 3D engine first and use placeholders for the visualization instead (e.g. images). When the workflow feels good, you can implement a 3D view in the next step.

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [October 21, 2020, 2:30pm UTC](https://discourse.threejs.org/t/threejs-to-create-3d-configurators-in-realtime/19980/4 "2020-10-21T14:30:13Z")

</div>

> [@Mugen87](#):
>
> depending on your requirements it’s not necessary to work with UI libraries like React or Vue

True, I meant it only as a state-management, React doesn’t necessarily enforce JSX or any specific UI stuff.
