React vs Angular! Битва при Ватерфлоу!
2024 ж. 21 Мам.
31 949 Рет қаралды
Настал день, когда пора принять решение! Кто же лучший? Ангуляр? Реакт? Или все же Ангуляр? В чем их сильные и слабые стороны?
Давайте решать здесь и сейчас!
0:00 Пролог
01:12 Какие бывают Дома?
02:56 ООП против Функциональщины
05:37 Почему Реакт так популярен?
06:51 Типизация
09:32 Прекрасные состояния
12:19 Первый социальный эксперимент в IT. Кто больше любит тесты?
14:36 Реактивщина
15:35 Кто лучше изменяется?
16:52 Со мной придут мои друзья node_modules
17:27 Где легче найти работу?
18:09 Где заработать денюжек?
18:42 Финальный босс
19:04 Резюме
__________________________
Один из моих самых любимых каналов о Фронтенде в telegram:
t.me/frontendnoteschannel
__________________________
#reactjs #angular #JavaScript #TypeScript #react
Тренажеры HTML Academy (HTML, CSS, JS, React) + Академия + Книга рецептов фронтендера + комьюнити за 99 рублей: boosty.to/how-to-learn-it Какие тренажеры бывают: htmlacademy.ru/courses#fe-start Подписывайтесь: t.me/howToLearnIT __________________________ 0:00 Пролог 01:12 Какие бывают Дома? 02:56 ООП против Функциональщины 05:37 Почему Реакт так популярен? 06:51 Типизация 09:32 Прекрасные состояния 12:19 Первый социальный эксперимент в IT. Кто больше любит тесты? 14:36 Реактивщина 15:35 Кто лучше изменяется? 16:52 Со мной придут мои друзья node_modules 17:27 Где легче найти работу? 18:09 Где заработать денюжек? 18:42 Финальный босс 19:04 Резюме __________________________
офигенные и стильные видео-вставки👌🏼
Конкретно ты с подбором футажей заморочился! Мое почтение! Еще понравилось, что ты наглядно показываешь разницу кода, а не просто говоришь о ней. Это важно.
Vue: я шутка для тебя?
Ладно, ладно) Сбацаем vue vs react
@@it2138 10/10 ))
Вью это шутка)
@@snatvb Не спойлери))
@@it2138 Скинь ссылку на свой линкедин)
отличный канал. спасибо.
Замечательно ❤ о Ознакомился с двумя технологиями
Классный контент, продолжай
Брат , Братан, Братишка!!! Побольше видео пожалуйста) Очень интересно! Благодарочка за труды твои!)
Хорошая работа!
Недавно делал ролик почему мне нравится Angular. Полностью согласен с автором 👍
Красавчик, ни тех ни других не обидел)
так и не понял что эти новые штуки дают что немогут дать старый php и jquery?
чтобы быть объективным надо поработать со всем... и я сейчас не за todo листы )) есть в планах поработать с А, но начну пожалуй с R+TS...
начало ржачное)
Можно ли конвертировать функциональный код в ООП код?
Все по факту, но про Ngxs не упомянул, вопрос с большой кодовой базой Ngrx отпал бы. Отличное видео
Болел за бэкбон с самого начала видео
на счет сервисов они глобально видни для всех модулей) тому если получить нужна что та нету проблем rxjs все заминает ngrx круто что там можна виловлювати собития эта один плюс ну и данние все в одном месте но эта по факту и сервес можна так же использувать
Даешь сравнение React и Vue js !! ))
Ангуляр приложения выглядят более структурированными и легко масштабируемыми, особенно если использовать надстройки типа Nrwl. Кстати, в реакте есть lazy loading модулей? Что-то не нашел.
Есть
Реакте нет модулей в принципе.
В реакте нельзя писать код в чистом ООП стиле?
видео интересное, но не разве в топовых банках используют Angular? точно знаю про Сбер и Тиньк - там Angular есть, но в основном в виде легаси или внутренних отдельных продуктов... В ВТБ и Альфа - тоже точно есть реакт, но там не знаю на 100 процентов, просто присылали вакансии на реакт... В Angular основной момент, что тяжелее найти разработчика, на мой взгляд
Angular намного лучше и понятнее! ООП Рулит!!!
пару комментариев относительно ролика: 1. ООП против Функционального программирования (ФП). быть может автор ролика и является ООП-пропагандистом, но React особенно на крайних версиях более приближен к ФП. от классовых компонентов отказываются не по хотелкам ФП, а по весьма конкретным причинам (оф. документация, там есть). также классы слабо транспайлятся с помощью babel. на данном этапе очень трудно обсфурцировать класс, а функцию легко. для примера возьмите любой класс и прогоните в babeljs io repl. Здесь автору необходимо знать об общем различии подходов ООП и ФП, о топиках по типу композиция vs наследование. ООП используется там, где что-то является чем-то (Student is a Human, Rabbit is an Animal). похож ли на это React компонент? вроде да, т.к. class Button extends React.Component, но скорее нет к примеру, React Component обязан быть чистой функцией. также нельзя из компонента менять props, напрямую менять к примеру Redux Store. только через просылку событий наверх. т.е. данные входящие в функцию остаются иммутабельными. не это ли гласит ФП? чистые функции, минимизирование side effect-ов, концепция переиспользования компонентов в любом месте приложения. это же ФП гораздо больше, чем ООП. в ролике автор указывает, что ООП интуитивно понятен для обычных людей. но для чего тогда такие "простые" вещи как ООП спрашивают на собеседованиях? какие-то там полиморфизмы. какой % разработчиков на изи расскажет на собеседовании о типах полиморфизма и как он реализован в JS? так может это не совсем такая интуитивно понятная штука? еще и this на каждом первом собеседовании у джунов спрашивают, не спроста ли это?
Забавно, что в предыдущем видосе меня называли ярым пропагандистом ФП =) Хотя что тогда, что сейчас я говорил, что и ФП, и ООП --- мощь и сила. Просто обе эти парадигмы решают свою задачу (+ круто их совмещать) и именно об этом хотел рассказать. ООП хорош своими правилами, паттернами, контрактами и стабильностью, поэтому он классно подходит там, где есть огромная система на 10 параллельных команд. ФП хорош своим минимализмом и переиспользованием, что дает скорость. И это здорово подходит для малых и средних проектов. Начет вот этих всех вопросах на собеседованиях ты говоришь про ЗНАНИЯ, а в видео я говорил про ПРОЕКТИРОВАНИЕ. И да лично я убежден, что начинающие ребята лучше проектируют в ООП, а не в ФП. Собственно причины в видосе вроде бы я рассказал. Ну и про знания тоже спорно, что легче. Ты приводишь пример полиморфизма, но не думаю, что вопрос о нем сложнее, чем вопрос о функциях высшего порядка порядка, например. Не говоря уж о том, что в ФП есть куча продвинутых тем типо монад, о которых даже многие опытные ребята не знают.
А самое прикольное то, что можно писать ООП в функциональном стиле. 2 крутые штуки в одном. Вот это сила!
Да успокойся ты) Нету чистого ФП языка и ООП языка. Все друг друга юзают, и по факту это уже идет как мультипародигма а не конкретное что-то. Главное понять что без императивщины одного и другого не будет)
11:50 NGRX работает с Dev tools так же, как и Redux.
По моему я не говорил, что ngrx не работает с dev tools. Я говорил, что на проектах без него не хватает dev tools
@@it2138да, извини, я неправильно понял
В Реакте вообще нет никакой проблемы с типизацией. А Редакс давно уже используют не через HoC, а через хуки, поэтому проблем с пропсами нет в принципе. Да и Редакс Девтулс отлично дружит с тайпскиптом. Да и вообще Редакс не особо нужен, поскольку в Реакте есть хуки для стейта (даже редьюсеры) и контекста. Только если у нас приложение построено на микрофронтендах, то может потребоваться какое-то независимое хранилище, чтобы переносить между ними общее состояние. И по поводу тестов. На последних 3-х проектах, где я работал, везде писали unit-тесты. Проекты на Реакте.
Контекст подойдет только для оооочень маленьких приложений.
@@izzei-1614 почему? контекстов может быть много и их точно так же можно комбинировать. Это же обычный хук. Да и поключать можно на разных уровнях, что позволяет не следить за валидностью данных в компоненте. Отмонтировали и все. А в редаксе и других глобальных сторах надо за этим следить и вовремя чистить.
@@KleinMaximus производительность
@@KleinMaximus да и в большем приложении тебе нужно что-то больше, чем тупо редьюсер
@@izzei-1614 а в чем проблема с производительностью контекста? вот уже который человек об этом говорит, но не может даже примера привести, где нормально проброшенный контекст будет проседать по отношению к тому же Редаксу.
После просмотра видео любой web-разработчик: Лицо хмурится, взгляд куда-то вдаль, кулаки нервно сжимаются до хруста в костяшках, а мозг нервно ищет преимущества своего любимого языка.
Ну ладно, ладно убедил :) Буду более лояльней относиться к реакту :) Хотя я с ним работал и был в шоке (возможно был не опытен и не понимал многого)
Реакт топ
После ангуляр реакт кажется кочергой
@@104kinoman 😹
Пожалуйста, отложи все дела и выкати сравнение с Vue!)
Выглядит так, что реакту накинули больше одного бала чисто для того, чтобы в комментах не получить негодования реактовщиков) А то, что и в реакте и в ангуляре можно использовать нормальные стейтменеджеры (который не ограничивается только ngrx) - это как бы в копилку не идёт) И то что сервисы с сабжектами - это в некотором роде "альтернатива" useReduce (имею ввиду, что и там и там есть встроенное решение, которое кое-как позволяет работать с состоянием) - это тоже опустили) Реакт популярн, безусловно. Но количество резюме на реакт надо было тоже же чекнуть. И смотреть соотношение свободных мест к количество претендующих. Ситуация здесь не в пользу реакта
Фанаты стабильности любят красный цвет, судя по всему.
А победил svelte UPD постоянно ты где-то да накосячишь) Angular строится на MVC паттерне. MVVM следует Vue. А вот то что лучший код - комбинация ООП и ФП, вот тут всеми конечностями согласен. И мало кто реально это понимает, к сожалению.
6:00 Ведь сделать побыстрее - это то, что нужно и признак качества (нет).
Хм.. сильно не погружался в Реакт, но у меня сомнения.. А автор точно знает что такое "функциональное программирование"?
а что vue?
Автор, создай Дискорд канал что-ли
Видео интересное, спасибо. Только похоже очень хотели свести в ничью. я 2 года работал с ангулар, и 4 с реактом. 1) реактивность, вы можете использовать в реакте все теже инструменты. тот же rxJs или redux-saga. тут 1-1 а не +2 к ангулару. 2) зп по ангулару и реакту не отличается. +-5% на уровне погрешности. Компании нанимают на позицию фронта а не реакта или ангуляра и ориентируются на зп фронта по рынку. Т.е. еще 1-1 а не +2 к ангуляру. 3) А вот вакансий на реакт действительно в 2-3 раза больше. вобщем будет +5 в сторону реакта, и разрыв со временем все больше.
Сейчас выгоднее изучать angular, т.к конкуренции у реакта в 3-4 раза больше. Условно, если человек хочет устроиться на работу, то лучше сразу на мидла. В ангуларе нетрудно на джуна попасть
Второй месяц ищу работу, очень часто пишут этот Ангуляр непонятный(
Нашел?
@@kataphalk давно)
@@Krasnoe1 На Анггуляр ?
@@user-wr3dz2op1t нет) уже нашел давно
А будет реакт против вью?
Чему быть того не миновать =)
Там будет уничтожение по всем фронтам от реакта
НОМЕР ДВА: в ролике есть раздел typescript. причем в плюс ангуляру. но почему? в React-приложении разве плохая поддержка typescript? мешают ли указанные баги взаимодействия React + TypeScript написанию приложения? нет. становится ли больше React + TypeScript проектов? о да. а что там Angular? джун обязан изучить TypeScript только чтоб прикоснуться к Angular и написать ToDo. Я выступаю за объективность при оценивании. изучение JSX при вхождении в React это дополнительное время на onboarding джуна. как и TypeScript в Angular. да и вот еще пример: к примеру, есть фриланс-проекты, тысячи их. заказ - сделать не столь увесистый проект за кратчайшие сроки. backlog понятен, есть вопрос экономии. мы клиента ставим в известность, что не доработанное архитектурное планирование ведет к худшей масштабируемости проекта в будущем. клиент кивает, говорит затягиваем пояса и в бой. не пишем документацию, минимальное покрытие тестами. теперь главное - выбор Framework-а. будет ли человек изучать TypeScript чтоб начать писать компоненты? нет. может он вообще JQuery максимум возьмет, но из фреймворков он вероятно не выберет по-шустрику изучить Angular. скорее тут будет вначале Vue, затем React, а Angular будет тут выбран только в случае если это уже Angular-разработчик.
Пришёл по ссылке на канале. Видео хорошее, это сравнение действительно важных технологий, важных именно для работы. Но вот это вот "победила дружба", совершенно отвратительное завершение. Нужно было подвести какой-то итог хотя бы, ибо просто "Выбирайте что нравится" это ну совершенно необъективно. По моему скромному мнению Реакт хорош для начинающих, тех кто хочет быстро устроиться на работу и "войти в айти", для чего он действительно хорош. И работать таким образом стоит в малых фирмах, максимум средних, что-бы разобраться в работе и составить какое-то мнение, поднатореть в базе и в навыках, важных именно для создания рабочего продукта. А уже потом, будучи более опытным, можно перекатиться в большие, давно существующие проекты которые работают на Ангуляре, что-бы их поддерживать и модернизировать. В общем, самоучкам-вкатывальщикам Реакт, студентоте или людям с базой в ООП - Ангуляр.
Redux - это фуу такое. Я вот познакомился с mobX и мне очень нравится и больше ничего не нужно..пока что
Никогда не понимал, как люди, которые якобы хорошо разбираются в ооп, могут серьезно, да еще и с восторгом, говорить о redux и вообще об appstate или appstore. Это же помойка для данных. Ситуацию радикально спасает mobx, которая вместе с TS упрощает работу с объектами предметной области.
такое ощущение, что бэкэндер нечайно стал фронтендером только потому, что на js начать было быстрее
Что значит "Реакт для функциональщиков"? Создаёшь класс, добавляешь в него нужные методы, имплементируешь в проект, вот тебе и ООП.
и тебе заворачивают на ревью этот ковнокод :) и говорят перепиши нормально на функциональном компоненте с хуками
@@VitaLikisgoodman А чего так? Через классы прикольнее ведь. В каждом классе делаем метод "render" возвращающий разметку, а за логику отвечают другие методы в классе. Для меня наоборот, с функциями не удобно работать.
Я выбираю Vue!
Как ангулярщик могу сказать, что ты не прав в примере, где ты сравниваешь 2 прилодения написаннных джунами. То, что ты не понял, еще не щначит, что было сделано плохо. Впрочем, я бы этого не понял тем паче. И еще, автотесты - это ОЧЕНЬ дорого. Давай с трех раз найди грамотного автотестера за вменяемые деньги.
Офигенный ролик. Я как react разработчик могу отметить, что в material ui 5 зависимостей стало меньше) UPD: да и информации по react в целом больше. Тут тебе и тендеры и фейсбуки на нем учат делать, по anglular такого контента не видел
А как же ngxs? Ngrx не нужен в ангуляре. А ngxs просто бомба.
ангуляру вообще ничего не нужно. нет ни одной задачи с которой не справился бы родной BehaviorSubject
Не знаю как тут люди ищут долго работу 🤷🏽♂️ я мидл на реакте и работу за 250к могу найти в течении двух недель примерно. Мой друган с опытом в два раза меньше моего нашел сейчас работу за два дня с зп в 200к
А какой у тебя опыт?
@@user-or1hy4xz8u опыт написания комментариев)
@@user-or1hy4xz8u 4.5 года назад я первые html теги написал )
джунам долго искать работу, я нашел за 8-9 месяцев, от опыта зависит уровень спроса помимо стека
все же от скила зависит и умения проходит интервью или ты думаешь абсолютно каждый программист все знает и все умеет?
Вообще уже можно начинать учить Svelte
уже 4 года как можно, только не кому не нужно)
Странно как вы не устали делать одно и тоже просто с разными компонентными библиотеками/фреймворками. Если уже значит один фреймворк/библиотеку для компонентной разработки смысл изучать ещё одну? Лучше изучить анимации, 3D программирование в браузере или блокчейн + фронт, как по мне лучше изучать то, что абсолютно не знаешь и не понимаешь, чего возиться в чужих каких-то функциях, а итог один и тот же
Я работал в трёх банках и везде был реакт
я собеседовался в 3 банка, везде был ангулар(тинькофф, убрир и втб)
посмотри в сторону ngxs, и накинь ангуляру пару баллов
ну вот про функциональное программирование не объективно, ооп это конечно круто, но так выходит, что на ооп как раз таки ниче не понятно, потому что джуну нужно идеально знать язык - работу с классами как минимум, в которой дофига для джуна непонятного конкретно в js, в реакте же все просто - ты знаешь функции - можешь делать все правильно, не знаю какого придурка автор привел в пример и как он не смог разобраться с кодом, видимо сам не шарит глубинно, сейчас же джун может фулл приложение сам накидать и с тс и с тестами и со сборщиком и с оптимизацией и тд.
На счёт того что можно устроиться на работу за день вы погорячились. На одну вакансию около 500 откликов. У меня знакомый 9мес искал работу.
Ставку поставь в 3 раза выше, отрвут с руками
@@nillconnbsp2908 это шутка, в которой 100% правды)
@@kirillmorozov9619 , на 1 вакансию 500 откликов???? Жесть....
Это у джунов так
@@nurdanelemanov9620 это сказки, что станешь мидлом и будет куча предложений. Все даже у мидлов не так радужно.
Реакт, особенно замешанный на TS, получается довольный абстрактный и ооп-шный. У нас тут на реактовом проекте все типы обязательно красиво разложены по папочкам.
У ангуляра куча проблем. Начиная с уродского changeDetection + zone.js, когда у тебя "2 стула", markForCheck который затрагивает все поддерево сверху или detectChanges который работает синхронно, ужасной реализацией реактивных форм, где компоненту реализующему ControlValueAccessor не узнать валидный он или нет (только по классу .ng-invalid збс). Или местная реализация DI, которая не поддерживает "круговые зависимости", а такие кейсы есть (модальное окно a открывает модалку b которая открывает a). Не говоря уже о потенциальных утечках памяти в ngFor (issue висит в github'e angular'a, гуглите) или rxjs'а (старые реализации ShareReplay и т.д.).
Бред какой то, при зоопарке стейтменеджеров у реакт, накидывать ему 3 балла потому что у ангуляр не сформирован единый вектор?
Ну так никто не мешает писать ООП приложения в функциональном стиле. Точнее, вообще ничего не поменялось для реакта в плане ООП, когда перешли на функциональный стиль. Просто интерфейсы изменились.
go react vs vue!
а типа в ООП нельзя написать неподдерживаемый говнокод, ага, конечно же
Я ж такого не говорил) А лишь высказал субъективное предположение, что новички хуже пишут в ФП, чем в ООП. И вы спокойно можете с этим не соглашаться)
Нафига ты снял это видео?
Хуки в реакте - одна из самых корявых вещей что я видел. Инпуты-аутпуты в ангуляре намного логичнее, понятнее и интуитивнее.
Инпуты и аутпуты это аналоги пропсов, не хуков.
@@user-eo1vs6mh5m я просто перечисляю, 1 и 2 предложение не связаны.
Видос ни о чём , ты жестоко потратил моё время. Отписка и теневой бан. Будь здоров (это главное).
React уродливый. Отвратный синтаксис и отсутствие каких-либо стандартов оформления кода приводят к такой каши...
А html/css не уродливы? Все их надмножества сохраняют эту уродливость генетически.
Шо то шуйня, шо это хуйня. P.S. I love backend.
Как раз на этой неделе впервые столкнулся с Реакт проектом и офигел на сколько там все не-ООПшно. Подумал говнокодеры проста фронт захватили. А оказывается это киллер-фича. Занятно. Спасибо за видос!
Тестирование не нужно, ну может за исключением минимума функционального. Крутые забугорные дев студии ваще не заморачиваются тестами, они посчитали и пришли к выводу, что проще выделять лям зелени/мес (край) на ликвидацию последствий падения продукта в проде, чем проводить 100 раундов тестирования. Один хрен топ перфоманс для тестов - обнаружение **некоторых** багов, но ни один (ни миллион) тест(ов), даже если тыщу раз проведён, и вся тыща попыток была зелёная, не смогут доказать отсутствия багов, а значит в теории всегда имеет смысл прогнать ещё кружок тестов. Алсо, техдир ваш по ходу на предшествующей работа хурмой торговал около подземного перехода, потому что только этим можно объяснить предположение о том, что полезность 3х тестеров ваще в одной вселенной с одним разрабом находятся. Очень хочется увидеть полные ужаса глаза несчастного экзека, наблюдающего трёх тестеров в попытках написать хотя бы одну полезную для продукта функцию. При этом кодер зачастую имеет достаточно неплохое представление о том, как, зачем, почему, куда и сколько раз писать тесты. Кароч все говно, а я - египетский священный программист.
Автор за пропоганду ООП, typescript, и Angular Минус тебе в карму. Из видео видно как автор топит за Angular. За какую то фичу Angular получает сразу 3 бала За какую то фичу React получает 1 бала и тд тп В общем видео предвзятое
Целью выпуска было рассказать ангуляр и реакт разработчикам, что кроме их любимого фреймворка есть и другие способы создания приложений. И поэтому в видео одинаковое количество плюсов и минусов у обоих лагерей. И в сравнении ооп vs фп тоже одинаковое соотношение плюсов и минусов с выводом о том, что каждая парадигма хорошо решает свои задачи. Думаю, что вас просто сильно задели минусы реакта, поэтому вы не заметили, что он тоже получал 3 балла)
@@it2138 ну смотри. Относительно интерпрайса. Я с вами не согласен. На реакте тоже можно делать большие и сложные проекты. Вопрос в том, как все организовать. Относительно ts. Это еще то .... Это просто защита от идиотов и джунов. Если нормальный прогер, то можно писать качественный код и без типизации.
@@-EgoSerg- ООП Рулит! Ангуляр лучший фрейм
@@flashback8504 статистика очень упертая штука. С ней очень тяжело спорить. Ваш ангуляр полное дно. Количество установок этому доказательство
@@-EgoSerg- Реакт полная хрень, в ангуляре все по полочкам в том же реакте полная дичь, не знаю как по мне дичь