Как писать сайты на JSX (без React) и собирать их через Vite: Minista в деле
Александр Ламков — Friendly Frontend
✏️ Разбираемся, что такое Minista — фреймворк-обёртка над Vite, позволяющая писать сайты с использованием JSX без подключения React. Пошагово создаём проект, настраиваем конфигурацию и запускаем dev-сервер. Изучаем структуру проекта, разбираемся с global.jsx – обёрткой для всех страниц. Подробно разбираем синтаксис JSX: от простых элементов и пропсов до вложенности, списков, children и фрагментов. Учимся подключать изображения и SVG-иконки, использовать встроенные компоненты Image, Icon, Head. Настраиваем алиасы и конфиги. Подключаем стили, добавляем JS-логику и собираем проект в dist. Финально — делаем предпросмотр через npm run preview. 🔴 Timeline: ▶ 00:00 | Введение ▶ 00:55 | Что такое Minista ▶ 01:42 | Для кого подойдёт Minista ▶ 02:14 | Установка и запуск проекта ▶ 04:50 | Базовая структура проекта Minista ▶ 07:49 | Рекомендуемая структура для проекта Minista ▶ 10:35 | Синтаксис JSX — формат функций для компонентов ▶ 19:05 | Синтаксис JSX — фрагменты (пустые обёртки) ▶ 20:28 | Синтаксис JSX — вложение компонентов друг в друга ▶ 21:34 | Синтаксис JSX — отличие JSX-компонента от JSX-элемента ▶ 22:47 | Синтаксис JSX — атрибуты ▶ 24:37 | Синтаксис JSX — пропсы (параметры) для компонентов ▶ 32:30 | Синтаксис JSX — рендер списков в разметке, проп key ▶ 36:30 | Структура компонента для комфортной работы с Minista ▶ 40:14 | Маршрутизация по страницам (роутинг) ▶ 43:28 | Компонент Head ▶ 46:13 | Файл global.jsx — общая обёртка для каждой из страниц ▶ 53:35 | Компонент Image...