Библиотека компонентов Chakra UI. Быстрый старт!

Готовые библиотеки компонентов позволяют быстрее создавать рабочие приложения. Chakra UI предлагает базовый набор решений для React-приложений - сетку, блоки, формы, таблицы и многое другое. При этом библиотека предлагает гибкий подход к управлению темами. Можно взять готовую цветовую схему и при желании расширить ее, либо создать свою собственную.

00:00 Обзор возможностей Chakra UI
16:20 Базовый шаблон React Chakra
17:45 Кастомная шапка, светлая/темная темы
24:26 Контейнер и работа с текстом
27:27 Сетка со списком карточек
32:37 Адаптив через пропсы
35:23 Варианты и псевдосостояния
38:38 Кастомизация темы

Мои курсы по вебу с купонами:

📢 Поддержка канала:

[dispeltr]

Крутая библиотека компонентов и не менее крутое объяснение! Спасибо большое!

[rsywcet]

Спасибо большое за твою работу, Михаил! Очень помог!💖💖💖

[jmpplmb]

Спасибо за видео, как всегда все просто и понятно

[evgeniyn]

Отлично, раньше работал только с material-ui, интересно будет сравнить.

[owmhzbb]

Спасибо, мне - как бэкендещику, помогло в создании сайта портфолио)

[fellainthewagon]

пока изучаю JS, но уверен чуть позже такие видео будут очень полезными, спасибо!

[Crash]

Вау, после бутстрапа выглядит как глоток свежего воздуха!

[konstantinvoronin]

Chakra UI - классная библиотека. Выглядит очень дружественно. В material ui и ant design намного больше иконок и компонентов, но это их и плюс и минус одновременно. Приходится тащить в приложение много неиспользуемого, раздувается вес приложения.
Жаль только, что у этой библиотеки нет собственного datePicker.

[rkwowqh]

Классно! Видео по Ant Design в студию ))

[osadenko]

с стороны оптимизации скорости первого отклика и загрузки всего контента лучше использовать модульный подход с навешиванием классов или props библиотеки компонентов?

[jjpviom]

Можете снять видео по Ant Design, было бы очень круто)

[GorgeousPuree]

Спасибо за видео. А подскажи плез, когда ты прописываешь цвет, то вс код подсказывает тебе возможные значения, например 'grey.500'
У меня вебшторм, и такого не происходит, он подсказывает только названия самих пропов (maxWidth, padding и тд), но сами их значения, которые идут в кавычках - нет. Ты что-то ставил дополнительно поверх вс кода, чтобы был такой автокомплит?

[kitN]

бегло глянул начало, буду смотреть позже

[AndriusLauFullstack]

Material UI V5 ili Chakra UI ili Semantic UI :) Kotory vybrat dlja samovo prastovo ispolzivanyja.

[DavitAve]

По моему лучше tailwind нет для react только MUI и то бывает раздрожает