Изучаем JavaScript

 Начало работы - создаём next js проект npx create-next-app my-project Устанавливаем Tailwind npm install -D tailwindcss postcss autoprefixer  npx tailwindcss init -p Добавляем пути к файлам в tailwind.config.js module.exports = {   content: [     './pages/**/*.{js,ts,jsx,tsx}',     './components/**/*.{js,ts,jsx,tsx}',   ],   theme: {     extend: {},   },   plugins: [], }; Добавляем директивы @tailwind в файл ./styles/globals.css @tailwind base; @tailwind components; @tailwind utilities; Примеры классов flex - флекс элемент justify-end, items-center - то же, что и justify-content: flex-end и align-items: center p-2 - паддинг 2 rem или 32рх my-5 - марджин по оси у 5 rem или 80рх mt-8 - марджин топ 8 rem или 128рх mb-5 - марджин боттом 5 rem или 80рх max-w-4xl - максимальная ширина 896px https://tailwindcss.com/docs/max-width bg-blue-500 - синий цвет фона text-white - белый цвет текста text-center - текст по центру text-xl - размер шрифта 1,25 rem text-2xl - размер шрифта

Для простых приложений, таких как todo, используем один state, и передачу данных от него к каждому компоненту, который должен получить данные от state или может изменить их.  При этом данные проходят через все компоненты, даже если им самим эти данные не нужны, но нужны их потомкам. Эта проблема называется Property Drill Для более сложных приложений со слабо связанными компонентами возможно нахождение state в каждом компоненте. Но здесь серьёзная проблема, когда разработчик не учитывает наличие какой-то взаимосвязи компонентов, при этом приложение начинает работать неправильно, с ошибками. Эта проблема называется Fragmented State Для больших приложений со сложными взаимосвязями между компонентами используем redux При этом state выносится отдельно и есть функция reducer при помощи которой компоненты могут влиять на изменение state. События, которые влияют на состояние state называются Action Store контролирует влияние reducer и изменение state  Для работы с redux устанавливаем две библи

Документация на русском  https://customizer.github.io/three.js-doc.ru/three.js-ru.htm Three.js Tutorials  https://sbcode.net/threejs/meshbasicmaterial/ Часть 1. Создание сцены Демо:  https://irinainina.github.io/threejs/day2/threejs8/ Часть 2. Установка Способ 1. Можно установить при помощи npm. Это предпочтительный способ, но тогда нужно будет использовать вебпак для сборки Для установки при помощи npm в папке проекта и выполните команду:  npm install --save three Импорт прописываем в начале js-файла import * as THREE from 'three'; Использование: const scene = new THREE.Scene(); Элементы управления (контролы), загрузчики и эффекты постобработки - импортируются отдельно из вложенной папки examples/jsm import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'; Использование const controls = new OrbitControls(); Способ 2. Можно добавить библиотеку по ссылке с CDN При переходе по ссылке https://unpkg.com/three откроется последняя версия файла three.