Что за HTMX и как использовать с Nestjs?
Сегодня посмотрим на недавно вышедший HTMX на практике. Для чего он можете подойти и действительно ли это замена React? Будем использовать вместе с Nestjs.
🔗 Ссылки:
Сайт HTMX: htmx.org/
🎉 Курсы по React, React Router и Redux: purpleschool.ru/course/react-...
🎓 Мои курсы по разработке: purpleschool.ru
💬 Telegram канал с полезными советами:
t.me/purple_code_channel
Разделы видео:
0:00 - Введение
0:13 - Об HTMX
2:07 - Идея HTMX
3:58 - Настройка проекта
8:31 - Добавление шаблонов
12:19 - Использование HTMX
17:08 - Удаление элементов
19:55 - Пример полного приложения
21:07 - Плюсы и минусы
24:07 - Заключение
Пікірлер: 66
🔗 Ссылки: Сайт HTMX: htmx.org/ 🎉 Курсы по React, React Router и Redux: purpleschool.ru/course/react-redux 🎓 Мои курсы по разработке: purpleschool.ru 💬 Telegram канал с полезными советами: t.me/purple_code_channel
@user-te7es3gf2r
7 ай бұрын
😊pp
HTMX полезен _исключительно_ для бек-энд разработчиков старой закалки, чтобы писать javascript по-минимуму: вся логика остаётся на сервере, шаблоны и так используются. Обработать форму, сделать до-загрузку, постраничный вывод, подсказки для поиска - вот область применения HTMX - везде, где не нужен мгновенный отклик на ввод пользователя (90% обычных сайтов). Сравнение Htmx c Реактом - как сражение между грузовиком и спорт-каром. На треке победит быстрая машина, а в Cargo-дисциплинах всё будет наоборот - всё зависит от места сражения. На канале про Реакт он и победит :-) За видео на канале - огромное спасибо. Всё по делу, минимум воды. Только звук улучшить осталось.
@PurpleSchool
7 ай бұрын
Спасибо!
Отлично! Спасибо за обзор! 👍
@PurpleSchool
8 ай бұрын
Пожалуйста!
Добрый день, большое спасибо за выпуск. Подскажите пожалуйста, как называется тема редактора в VSCode.
@PurpleSchool
7 ай бұрын
Bearded Theme Vivid Purple
@demidovmaxim1008
7 ай бұрын
@@PurpleSchool Спасибо !
прекрасный фреймворк - я сразу вспомнил asp classic ))
@PurpleSchool
8 ай бұрын
Да... а я php)
HTM🩼 )
@PurpleSchool
8 ай бұрын
🤣
Привет, я прохожу сейчас курс по верстке, потихоньку изучаю чтобы в дальнейшем перейти во фронтенд. Дайте совет новичку. Правильно ли я выбрал направление?( решил что с верстки начать будет легче всего) Не перегружен ли рынок фронтедерами? может кто то подскажет какое-то направление в IT где меньше конкуренции? Спасибо
@PurpleSchool
6 ай бұрын
По конкуренции сказать сложно, так как везде есть и порог вхождения. Точно, что нужно делать это хорошо. Я много собеседую джунов, которых нельзя брать на работу. Если хорошо освоите профессию, конкуренция не так страшна. А полная карта профессии тут: purpleschool.ru/profession/frontend
@user-pz9vo2oz2v
6 ай бұрын
классные цены у вас. Когда закончу свой слитый курс с юдеми, обязательно присмотрюсь к вашим. Цена прям символическая) А почему в курсе про бекенд нету ничего про питон? Я думал на питоне завязана большая часть бекенда@@PurpleSchool
Шутка про "проснулся - обнаружил новый js фреймворк" была?
@PurpleSchool
8 ай бұрын
Да, да)
Я люблю использовать htmx, но сталкнулся с проблемой - при загрузке части страницы с помощью htmx, где содержится swiper, он перестает работать, но если загрузить всю страницу, то все работает нормально. может кто-нибудь подскажет, как решить проблему?
@qwekerz
2 ай бұрын
нужно триггерить перерисовку свайпера. в теге в куске html, или завязаться на евент
Я так понимаю это подобие Django Template ? Только на NestJS?
@PurpleSchool
7 ай бұрын
Он работает с любым backend. Тут nest как пример.
Почему «недавно вышедший»? Он в 2020 году был представлен. По сути эта та же концепция, что используется в TurboStreams у Rails и в LiveWire у Laravel. Только его чаще питонисты используют, хотя он платформонезависимый.
@PurpleSchool
8 ай бұрын
Да, но на практике стал встречать только недавно
@kolyan4d
8 ай бұрын
Потому что в в начале июля этого года вышел, а rails и laravel тут вообще не причем :)
Геймпад, роутер, икона. Жынтильменский набор праграмыста
Ох уж эти нижние ПОДчеркивания😂
Зумеры придумали fullstack-монолиты?
@PurpleSchool
8 ай бұрын
Изобретаем php)
@romanmashin423
7 ай бұрын
Ахахах, точно точно
Смотрю с телефона, сделал звук на максимум, но все равно плохо слышно.
@PurpleSchool
7 ай бұрын
Попробуй сделать больше громкость
Зачем писать php на js?
Вообще уже есть примеры использования за пределами пет-проектов kzread.info/dash/bejne/ZXuDxMtyY9fQiqw.html И в сочетании с другими инструментами, которые "еще слишком молоды для продакшена" тоже довольно интересно получается kzread.info/dash/bejne/gI6ksq-lg6TLqpM.html
@PurpleSchool
7 ай бұрын
👍
Тащить целый nest для того что бы отдавать статику как то жирно мне кажется. Bun из коробки умеет отдавать статику по шаблонам. Разве нет?
@PurpleSchool
3 ай бұрын
Так тут вопрос преимущества фреймворка
fronted на превью
@PurpleSchool
8 ай бұрын
Опечатался иллюстратор)
хитрый вы, если бы с конца показали плюсы минусы то я б и не потерял 20 мин жизни на просмотр
fronted на превьюшке написано
@PurpleSchool
8 ай бұрын
Опечатался иллюстратор)
Вы умеете объяснять простые вещи так, что ничего не понятно. От двух минутного видео обзора возможностей было бы больше пользы чем от этого летсплея.
@PurpleSchool
7 ай бұрын
От обзора возможностей вы бы не поняли как оно работает. Так как это не простой фреймворк. Он требует активного участия бека. Даже прочитав официальную документацию вы не сможете взять и начать писать.
Половина видоса потрачена на то как автор играется с серваком, кому хотелось посмотреть про htmx, перематывайте в конец видоса.
@PurpleSchool
5 ай бұрын
Просто без сервака htmx бесполезен и понять как он работает сложнее
@dasstillsmile8458
5 ай бұрын
@@PurpleSchool можно было завести какой то фласк по быстрому или на гошке в стандартной либе сервер заводится за несколько строк, а тут пол видоса сервер ставим для того что бы увидеть миркофреймворк под хтмл...
ubitsa reakt yevo davno ubili vue , svelte
за обзор спасибо, но этот htmx это 🤢
@PurpleSchool
7 ай бұрын
Пожалуйста) Для этого и делаю обзоры, чтобы вы могли понять технологию и для себя решить полезно или нет)
Выглядит абсолютно бесполезным
@PurpleSchool
7 ай бұрын
Только для редких случаев, когда ты backend и не хочешь учить фронт)
@user-qe4hh6qq9u
7 ай бұрын
@@PurpleSchoolвсе равно же придется использовать теги, и изучать атрибуты самого фреймворка
Кажется что для реального проекта использовать глупейшая затея. Главный минус, "вы сделали успешный проект, все работает, а после решили делать моб приложение, а у вас бэк в ответе отдает html"😂😂
@PurpleSchool
7 ай бұрын
Полностью согласен
@namegorm
5 ай бұрын
не понял. И что, что бэк отдает HTML? Этот бек прекрасно ходит в другой бек, который уже отдает json. Вот туда и будет ходить мобилка.
@user-qe4hh6qq9u
5 ай бұрын
@@namegorm вы правы, но получается что такой бэк будет делать тоже(а может и больше) что и бизнес логика внутри например реакт приложения, только получается окружение разное. Попробовать ок, для чего то боевого вряд-ли кто то будет брать
@bomzhiha-s-kurskogo-vokzala
4 ай бұрын
А разве не по этому же пути сейчас идут Next.js Server Components? Всё возвращается в 2000-ые)
я не знаю что такое Nestjs
@PurpleSchool
3 ай бұрын
kzread.info/dash/bejne/nGZhqdOalbbblaQ.htmlsi=4vnQJguX7SrXy4Vk
Про минусы конечно жесть автор…. В чем минус шаблонизатора?), когда пишешь на vue там тоже шаблонизатор)))) че за бред Не подсвечивается IDE?) Бесспорно минусы есть, но относить туда шаблонизатор и подсветку …. Думаю автор просто любит js и кроме него ниче не знает)
@PurpleSchool
3 ай бұрын
Во vue действительно есть шаблонизатор, но есть и bind переменых, работа с состоянием и ещё куча возможностей. А тут мы по сути вынуждены использовать шаблонизатор, который отправляет нас на уровень php на котором я писал ещё 14 лет назад. И если вы заметили, то первым минусом стояла невозможность писать больше приложения, так как все логика приложения будет у вас размазана вместе с кусками шаблонов. Это будет невозможно поддерживать. Ваше предположение по языку не верно, я люблю и go и C#, но и на них бы не стал писать таким образом.