#1 Установка canvas-sketch и создание простой сцены | Курс по ThreeJS без оплаты
Друзья, переходите по ссылке для того, чтобы получить код из видео:
https://three.inverser.pro/intro
^ также на данном сайтике будут публиковаться остальные кусочки мозаики, которая позволит создать полноценную планету (из первого видео).
Большое видео по оптимизации сайтов:
https://youtube.com/live/N3lmoftlm1k
GitHub окончательного результата для production:
https://github.com/inverser-pro/three...
LIFE VIEW:
https://codepen.io/inverser/pen/QWaLqPm
https://codepen.io/inverser/pen/RwQbdOm
ОЧЕНЬ МНОГО ССЫЛОК ПО THREEJS на различные ресурсы с примерами
https://three.inverser.pro/links
Первое видео (нулевое):
• #0 THREEJS от 0 до PRO уровня БЕЗ ОПЛАТЫ! ...
Ссылка на список воспроизведения по урокам Three JS с 0 до PRO:
• THREEJS полный курс без оплаты! Уровень PRO
#three #threejs #inverser_threejs #3d #js
00:00 Как стартануть, чтобы удобно и быстро писать код ThreeJS?
00:33 Сайтик, где я буду выкладывать всю инфу
01:14 Установка и проверка NodeJS
02:04 Установка canvas-sketch
04:17 Создание первого пустого проекта
05:32 Установка ThreeJS (добавление библиотеки)
05:47 Первая сцена на ThreeJS — стартовая
07:40 Подвожу итог, что делать дальше?
09:10 Пройдёмся по коду и посмотрим, что там?
09:58 const sketch
10:18 Понятие камеры в Three JS
10:40 threejs.org
12:18 Камера, смотри так! camera.lookAt(new THREE.Vector3())
13:23 3D — это всегда описание X,Y,Z позиции для одной точки
14:09 THREE.OrbitControls — управление 3D-объектами на сцене
14:41 Mesh в ThreeJS
15:52 ThreeJS BoxGeometry
16:09 В мире WebGL (~ThreeJS) нет понятия размера | UPD: 1 = 1 метру
18:31 THREE.MeshPhysicalMaterial — материал для Mesh
20:17 Три составляющие для того, чтобы увидеть что-то в браузере: камера, сцена, объект
21:54 Чистый WebGL — Oo @@@!
22:52 Добавление источника света на сцену ThreeJS (AmbientLight + PointLight)
26:06 Понятие увеличения объекта (ThreeJS multiplyScalar)
26:43 Возвращение значения функции — отрисовка кадров
27:09 Анимация в ThreeJS — её же возможностями
27:20 ThreeJS render + setPixelRatio
28:19 render.setSize в ThreeJS
28:22 camera.aspect в ThreeJS
29:31 Функция render в ThreeJS
33:17 А напоследок я скажу...