Vue JS 3 Composition API на Практике 

Владилен, я начинал учиться с твоих видео, спустя уже 10 месяцев я сижу в офисе на стажировке, и дальше учу js по твоим роликам, огромное тебе спасибо.

Как всегда шикарное видео Владилен! Большое спасибо! Объяснили все четко и ясно без лишнего.

Ждём полный курс по vue3 ! спасибо Владилен!

Владилен, спасибо за подробный рассказ о новых фишках, доступно, понятно и да, магия ))

Владимир, спасибо большое! Вы умеете просто доносить непростую информацию :) Очень люблю ваши видео!)

отличное объяснение, спасибо большое ) пример с тем как переписать самое то, что помогает во всем разобраться

Красавчик, все так достойно объясняешь. Без воды.

Хочется выразить благодарность автору за урок. Очень внятное и разумное обяснение. Что на мой взгялд очень хорошо, что есть примеры кода которые приближены к реальной разработке. Где можно понять в чем преимущество нового подхода.

Спасибо за видео, Владилен! Все понятно и полезно)

Спасибо большое! Пока что это самое лучшее и доступное для понимание видео, что я смог найти по данной теме. Еще интересно было бы понять как лучше работать с новым API и Vuex. Процветания каналу и дальнейшего развития!

Отлично. Ждём новый обновлённый курс по Vue 3.

Реактивный лайк за видео! Очень полезное видео, всё по полочкам, хорошая подача материала. Жду не дождусь релиза тройки

Только другое твоё видео посмотрел, а тут ещё одно, спасибо)

Как вам новый Vue? Мне такая история очень заходит еще с реакта)

Спасибо, Владилен - очень познавательно!

Потрясающий материал. Владилен наш спаситель

Спасибо, Владилен, очень круто

Спасибо за видео, будем готовиться к рефакторингу :)

Хорош! С твоей подачей дак вообще все становится крайне ясно!!! Чем-то напомнило мне фукнциональный реакт )) Но подход интересный, более структурировано получается строить код, и ТС можно уже использовать без сумасбродных сообщений линтера в IDE :-D

Очень хороший урок. Огромное спасибо.

Это просто Вышак!!!! Коротко о видео - привет передайте реактчикам)))). Я пошел читал доку. Спасибо

Довольно интересный подход , вообщем было полезно послушать спасибо!

Доброго времени суток, Владилен. Огромное спасибо за такой полезный контент. Будет ли от вас курс по тестированию с Jest и Enzyme?

Будут ли уроки по тестированию (React, Jest)?

Снова лучшая подача материала (это я еще даже смотреть не начал)

в целом прикольно, это добавит больше гибкости для комбинировании логики для наших компонентов

зашел поставил лайк, потом посмотрю. уважаю этого человека профессионал высокого уровня !

ИМХО выводы: 1. Старый стиль написания кода более прозрачный и понятный 2. Больших/жирных компонентов в идеале не должно быть 3. Полезно использовать вместо mixins Так что в сухом остатке - штука полезная если нужно переиспользовать код (обычно это не такой частый кейс). А так в целом придерживался бы "старой стилистики".

Классный гайд) Благодарю

Всё круто, спасибо!

Благодарочка 👍🏿🙏🏿🔥

Командой ждём vue3 + typescript 🧨

В декабре перешёл с реакта на вью и благодаря твоим видосам никаких проблем при переходе не возникло, всё показал, разжевал, за это респект тебе и уважуха 🤟🏿 Кстати, вью мне больше нравится 😀

Господи! Какой же ты ахрененный! Всегда максимально актуальная информация!

Дякую чувак, класно пояснив. Лайк!

Как будто во вью завезли реактовские хуки. И это очень даже хорошо. На самом деле это оооочень крутой способ описывать компонент. Теперь если раньше во вью описывался лапшичный код, то сейчас это более структурировано и масштабировано. Я с реакта перехожу на вью и увидел useState и useEffect только в иной форме, другой подход

level up, thanks mate, keep it up

Как всегда на высоте, очень качественно, спасибо)

Спасибо за инфу!

Владилен, доброго времени суток,скажите пожалуйста, будет ли у вас полный курс по vue.js на подобии курса по react и angular?

Благодарю за видео! Вопрос, а почему вы не используете $emit для передачи события родительскому компоненту?

Привет, немного не по теме, интересно узнать, планируются ли видео по теме интеграции SPA с CMS системами?

спасибки за обзор. все понятно.. сам бы все равно больше времени потратил чтобы разобраться

Потрясающий препод

21:17 призрак Реакта приследует Владилена

Сразу видно, что очень сильно вдохновлялись Реактом, похоже этот вектор будет сохраняться долго

Владилен, привет, идея для нового видео - создание npm пакета, с webpack, babel, импортами экспортами, всеми наворотами es6 и его дальнейшая публикация в npm.

Отличное видео, Владилен! Только пока не очень понятно, в каком случае нужно оборачивать в ref, а в каком в reactive и в чем разница

как всегда лучший

Владилен, спасибо за видео, очень интересно вышло! Подскажи пожалуйста, у тебя на Github отображается sidebar со структурой проекта. Это какой-то аддон к браузеру, или что? Погуглил - ничего не нашел

Сильно понравилась подача материала, тут же взялся отрефакторить один компонент в проекте. И практически сразу столкнулся с такой неприятной штукой - есть у меня функция клонирования объектов, в которой испозуется this.$set для сохранения реактивности. Функция в миксине. Практически только после вашего видео осознал, что меня смущало в миксинах. Решил сделать подход в стиле composition api... И полдня потанцевал на граблях с отсутствующим this, пока на гитхабе не нашел такой костыль - с версии 0.3.3 появился метод getCurrentInstance. На текущий момент в документации его не видать, но судя по названию - возвращает текущий корневой экземпляр Vue. Соответственно, все плагины, подключенные к проекту, можно использовать через полученный инстанс, например vm.$router. Использовать достаточно просто export function useSomeFunc(props){ let vm = getCurrentInstance() // здесь уже все доступно const someMethod = () => { vm.$set(props.someprop, 'newprop', 'newvalue') } } идея взята отсюда github.com/vuejs/composition-api/issues/206 (если ссылку не порежет). Для чего это надо? В props может быть передан объект, которому надо программно установить свойство, которого у него изначально не было и которое должно быть реактивным. По ссылке описан вариант использования для глобальных ивентов, до рефакторинга которых я еще не дошел, но я подумал - варум бы и нихт? И сработало. PS. Покопавшись в исходниках, нашел, что плагин уже предусмотрел метод set, достаточно просто его импортировать import {set} from '@vue/composition-api'. Так что мой изврат уже никому не нужен ))) PPS. Оказывается, еще как нужен, например для доступа к vm.$attrs, vm.$listeners и прочих нужных штук при рендеринге на низком уровне ))

11:04 Да, мы действительно можем передавать коллбеки для этого, однако данная практика считается антипаттерном, использовать события было бы более правильно

Спасибо!

Владилен, спасибо, привыкнуть можно к любому синтаксису, главное чтобы старый синтаксис работал с оптимизацией vue 3, наряду с новым, а то не получилось бы так что если хотите скорости пишите по новому.

#идеяДляВидео Интересно послушать про лицензии ПО. Например: что нужно сделать, чтобы выложить исходники ПО в интернет, но чтобы её не могли своровать, сказав, что ты её своровал? Также, что нужно учесть, чтобы брать код с разных ресурсов и вставлять к себе в проект?

Годнота)

Есть смысл учить Vue, если документация старой - 2-й версии? Синтаксис и некоторые подходы же поменяются Когда ожидается 3-я?

На гребне IT волны...) Спасибо, Владилен. Мне лично комфортна твоя подача.

Честно лучшее объяснение и техника что я видел. Но vue становится через чур сложным, раньше понятнее и удобнее было на мой взгляд. Но ладно уж, раз сделали так сделали.

Спасибо

Интересно было бы посмотреть на reason react.

Проясните одну вещь. В vue 3 можно писать всё тем же старым синтаксисом и ничего по сути не поменялось кроме того что можно использовать по желанию setup() и это композирование?

you are the best!

ёкарный бабай.... я ещё webpack недокурил..... Владилен, я не успеваю за тобой )))

Массив правильнее оборачивать в ref или всё же в reactive ? Массив это же объект

Что нам мешает точно так же разбить наш компонент на миксины по группам ответственности? Если есть желание менять имена, то можно вместо объекта возвращать функцию, которая будет возвращать объект с нужными нам именами. И проблема с трудностями определения откуда пришло то или иное поле в больших компонентах остаётся. Можно конечно определить (переопределить) имена явно, но тогда придётся каждый раз дублировать...

Ну хз. Штука занятная, но для совсем уже солидных проектов. Для чего-то менее масштабного, типа сайта на роутере с парой страниц или простенького блога, по большому счету, оно и не сильно надо. З.Ы. Спасибо за качественный контент!

Класно!

Почему в этом уроке все импорты имеют пути начинающиеся со знака @ (напр. "@/fileName"). Обычно относительные пути начинают с точки ("./fileName"). В этом есть какое-то преимущество или это просто одно и то же? UPD: ближе к концу ролика заметил разницу. Видимо если начинать путь со знака "@", то это путь относительно папки `node_modules`. Поправьте меня, если не прав.

Владилен, почему на 12:00 не заюзать эмит? Мне кажется передача колбеков по пропам во вью это антипаттерн

спасибо

Владилен я тут взял все твои курсы на udemy после того как прошол часть по angular вопрос, ты будешь делать курс для udemy по Vue?просто столкнулся с проблемой в моем городе что просто знать неплохо React не достаточно для рынка сейчас подавай всем знание всех трех фреймворков

Спасибо. Когда nest.js? :)

По-моему, Composition API - это лучшее, что случалось со Vue. Иногда, сложно было с данными работать, при старом подходе. А сейчас, прям красота. Но пишут его... ну чёт прям сильно долго.

А как в composition api использовать render? Пока сделал так - в файле композиции описал функцию render, эскпортировал ее, в файле компонента импортировал и в функции компонента render сделал перенаправление, типа render(h){ return useComposition().render(h) } Насколько это верно и как во Vue3 будет решена эта проблема?

Владилен Минин, what about Ramda course?

Посмотримс, заценимс.

Просто бог

Сидишь такой, типо знаешь чуть вью. И такой дайка посмотрю видео. И тут открываешь для себя кучу нового. Такой вопрос. Можно ли сейчас использовать уже, данный композишн, или он уже встроен будет в новый проект? А за видио спасибо большое, много нового узнал :) .

С Composition API vuex будет использоваться ?

Все это конечно хорошо, но вот момент, что будет с vuex в vue 3? Пока даже представить это не просто) или решили отказаться от Единой шины данных в vue 3)))?

Спасибо за видео, полезно. Сам давно уже жду Composition API и vue3. Штука не новая, конечно, в реакте давно есть хуки. Но выглядит удобней подхода vue2. Единственное, что не совсем нравится - необходимость везде писать .value. По любому, первое время все будут это забывать. Понятно, почему так сделано, но хотелось бы, конечно, более изящного решения.

Спасибо за видео! Код в композишн эпиай показался менее читаемым. Все менее прозрачно. То как в AddRecipe.vue создали props, потом послали в setup, внутри setup послали в useForm, которая вообще в отдельном файле лежит. Ну, не знаю... this кому-то был не понятен, а .value типа это красиво? То ,что watch ставится не на recipe, а на props.recipe. Да и вообще синтаксис с двумя колбеками в watch... Ко всему можно привыкнуть, но эстетического удовольстивия все это не вызывает.

Топ!!!!!!

31:25 У новичков проблемы с this, а с пониманием всего остального кода Vue у них проблем нет?

А как потом прикручивать Vuex? Дублировать структуру этих Композиций? // за урок спасибо!

а в чём заключается API ? В options по крайней мере была структуризация по выполняемым действиям, а в composition вернулись к чистому яваскрипт внутри vue . Импорт и экспорт чтоли назвали composition api ?

чтобы очистить консоль от вывода можно нажать ctrl + l :)

Не знал про коллбек в пропсах, всегда делаю через события

Владилен, а как вы считаете, почему react популярнее и востребовательнее чем angular. Полив, я ответ не нашел.

Владилен, если захочешь, ответь пожалуйста на это: "делать CMS / панель управления сайта, на NodeJS это совсем бред?" Я хотел изучать NodeJS чтобы делать back-end админки, а php не хочу изучать. Хотя если ты не спеша, нас новичков научишь php. Может быть и захочется. )

Отличный материал, спасибо Владилен! Из вью сделали реакт, круто конечно, но зачем нам 2 реакта. В связи с чем вопрос, будет ли для реакта урок по mobX а то Redux это похоже теперь единственная проблема реакта, вью думаю можно бросать теперь, заказов по нему и так не особо много было, а теперь когда он в реакт превратился, смысла его выбирать вообще нету для заказчика, ну если только развести его.

mixin vue = trait php?

Const теперь переменная? Стильно модно молодежно?

Подскажите из личного опыта - кто то делал масштабный проект на фреймворках ? Я имею ввиду реально масштабный типа интерпрайс проект ? Зачем нам нужны коробочные варианты в целом ? Кроме как мелкие проекты само собой.

Владилен, привет. Спасибо за видео. Ответь, пожалуйста, на вопрос с высоты своего опыта. С какого фреймворка(библиотеки) лучше всего начинать после хорошего изучения фундамента JS. До какой спецификации учить JS, чтобы перейти к дальнейшему изучению. Перечисли, пожалуйста, список технологий в каком порядке учить учитывая что сейчас уже 2020 год? Стоит ли перед изучением фреймворков поучиться работать с Node.js? Нужен ли Gulp, Webpack?

Владилен, сделай плз видео из тематик redux-saga, immutable.js, lodash

Теперь весь код будет в setup()???

Владилен каким образом вы следите за новостями по вью, заходите на оф сайт и проверяете или читаете новости?

Зачем callback, если во vue есть emit