Elettracompany.com

Компьютерный справочник
0 просмотров
Рейтинг статьи
1 звезда2 звезды3 звезды4 звезды5 звезд
Загрузка...

Vue уроки на русском

Курс по Vue.js

Курс по профессиональной разработке веб-приложений с помощью Vue.js.

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

Вы можете запросить уведомление.

О курсе

Vue отлично подходит для итерационной разработки или постепенного рефакторинга существующих приложений. С чем вы самостоятельно убедитесь, создавая небольшое приложение на курсе — начнём с самой простой HTML-страницы и закончим небольшим SPA-приложением с серверным рендерингом и тестами.

Внимание! Этот курс сейчас на переработке.

Программа будет сильно обновлена, улучшена, добавлен проект и больше практики в разработке современных Vue-приложений.

Программа ниже устарела и относится к предыдущей версии курса. Новая программа появится здесь при открытии набора.

Как организовано обучение?

На курсе у нас будет семь насыщенных занятий, на которых мы будем изучать Vue, постепенно создавая на нем приложение.

После каждого занятия будет небольшое домашнее задание. Если при его выполнении возникнут проблемы – доступен чат группы, где также присутствует преподаватель.

Сначала мы познакомимся с Vue, узнаем как он работает. Начнем его использовать, посмотрим как удобно подключить его к существующему проекту, какие при этом возникают нюансы. Разберём все основы и подступимся к компонентам и компонентному подходу в реализации приложения.

Затем мы изучим официальную библиотеку роутинга — какие возможности она предоставляет, обсудим каким образом можно реализовать проверку авторизации пользователя. Добавим сборку Vue приложения с помощью Webpack и увидим какие ещё приятные возможности привносит эта связка и использование однофайловых компонентов. Разберёмся как можно использовать другие шаблонизаторы, препроцессоры, и каким образом использовать локальные стили или CSS-модули.

Следующим шагом мы научимся использовать сторонние плагины в приложении, без головной боли и возможных сайд-эффектов. Вы увидите, что часто нет необходимости искать «vue-версии» плагинов, когда можете самостоятельно реализовать компонент-обёртку, а затем переиспользовать в других местах вашего приложения. Обсудим возможные способы валидации данных.

В конце мы познакомимся с официальной библиотекой для реализации единого хранилища состояний Vuex: когда он нужен, какие принципы заложены и как с ними отличается подход к работе приложения. Разберём возможности по реализации Server-side rendering + Vue. Изучим какие есть инструменты и каким образом тестировать компоненты. Задеплоим наше приложение на онлайн-сервис.

Основные темы программы

Блок 1

Vue, основы и использование в существующих приложениях

Знакомимся с Vue, разбираемся как его подключать и начинать использовать в существующих приложениях.

Разбираемся каким образом работает реактивность данных, что за возможности есть у Vue для отслеживания изменений в них. Изучаем как работать с условиями, циклами, стилями, событиями и формами.

Изучаем работу с компонентами: как их создавать, как использовать, как передавать в них данные и отслеживать возникающие события. Рассматриваем динамическое переключение компонентов.

  • Vue, принцип работы реактивности.
  • Варианты подключения и сборок, Vue-devtools.
  • Синтаксис шаблонов, работа с атрибутами.
  • Экземпляр Vue, свойства, методы и хуки жизненного цикла.
  • Вычисляемые свойства компонента, отслеживание данных.
  • Работа с условиями, циклами.
  • Работа с классами и стилями.
  • Обработка событий.
  • Работа с формами.
  • Компоненты: как создавать, как использовать, как передавать в них данные и отслеживать возникающие события.
  • Динамическое переключение компонентов.

Блок 2

Vue-router, однофайловые компоненты и реализация SPA с шагом сборки Webpack

Изучаем Vue-router — библиотеку для роутинга Vue: как работать с маршрутами, хуки и где они пригодятся.

Начинаем использовать Vue CLI и сборку с помощью Webpack и однофайловых компонентов: как использовать шаблонизаторы, препроцессоры, локальные стили.

Разбираемся как использовать сторонние плагины, как создавать собственные компоненты-обёртки для них.

  • Vue CLI, какие возможности предоставляет модульная архитектура новой версии.
  • Vue-router, работа с маршрутами, как передавать параметры, хуки маршрутизации.
  • Однофайловые компоненты и их возможности.
  • Асинхронная загрузка компонентов.
  • Использование слотов в компонентах.
  • Использование сторонних плагинов и создание компонентов-обёрток для них.
  • Как получить доступ к DOM-элементу.

Блок 3

Пути дальнейшего развития приложения

Изучаем каким образом можно реализовать единое хранилище состояния с помощью Vuex.

Читать еще:  Видео уроки по скетчапу

Рассмотрим какие есть способы реализации серверного рендеринга для Vue и другие продвинутые темы.

  • Vuex, когда необходим, как мутировать состояние и как его получать, работа с формами.
  • Способы реализации SSR в Vue.
  • Тестирование компонентов.
  • Деплой.
  • Практические рекомендации по написанию хорошего кода на Vue.

Результат обучения

  1. Вы будете знать как интегрировать Vue в уже существующие приложения и представлять чёткий путь как итерационно переписывать проект, постепенно избавляясь от старого кода.
  2. Вы сможете создавать собственные компоненты для переиспользования в разных частях вашего приложения.
  3. Вы будете понимать что не нужно всегда искать «vue-версии» плагинов и сможете самостоятельно реализовывать всё необходимое для использования сторонних плагинов в проекте.
  4. Вы сможете с удобством работать с формами и событиями и знать как валидировать данные.
  5. Вы будете знать каким образом реализовывать SPA-приложения на Vue.
  6. Вы будете представлять как реализовать централизованное хранилище для Vue
  7. Вы будете знать какие есть способы по реализации серверного рендеринга с Vue.
  8. Вы будете представлять каким образом тестировать компоненты и на что следует обращать внимание.

Предварительные требования

  • Знание JavaScript, включая ООП, классы.
  • Интернет 256kb/s или быстрее для видео.

Преподаватель

Занимаюсь frontend-разработкой с 2013 года. В 2016, после знакомства с Vue.js успешно использовал его для рефакторинга большого портала, итерационно, без остановки разработки или одновременной поддержки двух систем. Со временем выросло в отдельное самостоятельное SPA-приложение с рендерингом на стороне сервера. Занимался обучением коллег frontend-разработчиков и backend-разработчиков, кому был интересен этот фреймворк.

В конце 2016 присоединился и теперь один из администраторов группы переводов, чьими силами переведена и поддерживается в актуальном состоянии вся русская документация по Vue и смежным проектам (Vue-router, Vuex, Vue-cli, Vue-loader, Vue-test-utils, SSR Guide).

Community partner команды разработчиков Vue.js (по разработке экосистемы Vue).

Гарантия

  • Если объяснения будут вам непонятны
  • Если курсы не дадут вам новых знаний и умений
  • Если вы не сможете подключиться к системе онлайн-обучения

…то вы сможете получить деньги назад.

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

Для компаний

У нас большой опыт работы с самыми разными компаниями: как маленькими, так и IT-гигантами (Яндекс, Мейл.ру и другие).

  • При записи нужно выбрать способ оплаты «счёт на компанию», и документы будут автоматически сгенерированы: договор, акт и счёт.
  • Для зарубежных компаний выдаём инвойс на английском языке.
  • Физическим лицам даём справку об оплате, если нужна компании для компенсации расходов.
  • Сведения о нас (для бухгалтерии): скачать архив с документами.
  • У нас есть лицензия
  • Можно сделать налоговый вычет: детали для России

Подписаться на уведомления по курсу

Комментарии

  • Если вам кажется, что в статье что-то не так — вместо комментария напишите на GitHub.
  • Для одной строки кода используйте тег , для нескольких строк кода — тег

, если больше 10 строк — ссылку на песочницу (plnkr, JSBin, codepen…)

  • Если что-то непонятно в статье — пишите, что именно и с какого места.
  • Изучаем Vue.js в 2018 году

    Дата публикации: 2018-11-06

    От автора: Vue.js — одна из самых горячих тем в веб-разработке. Vue появился довольно недавно, но уже стал самой популярной JavaScript платформой на Github. Это также фреймворк, который, по заявлению большинства JavaScript-разработчиков, они хотят изучить в 2018 году. Итак, изучаем Vue js. Основной вопрос: как это сделать?

    Какие наилучшие ресурсы для этого? Какие источники вы должны прочитать, какие курсы пройти, и многое другое?

    Подход к обучению

    Прежде чем перейти к рассмотрению ресурсов, давайте кратко поговорим о том, как мы учимся. Если вы действительно хотите изучить Vue.js, я настоятельно рекомендую вам выбрать проект, к которому вы собираетесь его применить.

    Не просто экспериментируйте или следуйте руководствам — найдите что-то реальное, что вы хотите выполнить, и постарайтесь сделать это с помощью Vue.

    Читать еще:  Французская косичка видео урок

    Это заставит вас решать проблемы и исследовать вопросы за пределами узких границ того, что думают авторы руководств и преподаватели курсов.

    Как создать сайт самому?

    Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

    Это также поможет вам определить актуальность некоторых тем. Много продвинутых концепций Vue (таких как многокорневые компоненты) не имели для меня смысла, пока я не столкнулся в проекте с проблемой, для решения которой они были нужны.

    Начинаем

    Самое очевидное место для начала работы с Vue — это официальное руководство. На самом деле, если вы прогуглите «learn vue», то это одна из первых вещей, которые вы найдете.

    Однако, когда я начинаю изучать новую технологию, такую как Vue, я обычно начинаю с бесплатного или недорогого видеокурса с обзором. Это также подходит, как и официальное руководство, но для меня почему-то курсы легче понимать.

    Хорошие курсы для начинающих

    К счастью, для начинающих есть множество отличных курсов.

    Vue JS 2 — The Complete Guide (incl. Vue Router & Vuex). Это курс, с которого я начинал — это платный курс, но часто со скидками его стоимость составляет всего 10 долларов. Я очень его рекомендую.

    Learn Vue 2 Step By Step (Laracasts). Еще один отличный вводный курс. Я не думаю, что он так же хорошо, как указанный выше, но, с другой стороны, он бесплатный.

    Intro to Vue.JS (VueMastery). Это более короткий курс, чем два предыдущих, и я думаю, что видео не столь же хорошо, но VueMastery делает все, чтобы дать вам больше, чем просто видео. Вы также получаете текстовые руководства, можете загрузить любой из используемых ресурсов и использовать любой из примеров на основе CodePen. О, и это бесплатно!

    The Ultimate Vue JS 2 Developers Course. Возможно, «ultimate» — это небольшое преувеличение, но это отличный курс, чтобы «учиться на практике», в нем рассматриваются три проекта, чтобы изучить концепции Vue. Если у вас возникнут проблемы с созданием собственного проекта, это может вам помочь, поскольку вы можете следить за проектами преподавателя.

    Это мой проект, в котором я только что начал уделять внимание более реальным возможностям обучения. Возможности задавать вопросы и получать ответы от инструкторов не хватало большинству вариантов изучения Vue, поэтому я запустил его. Первый релиз — бесплатные вебинары по основным принципам работы Vue.js, в ближайшее время будут другие обновления.

    Как создать сайт самому?

    Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

    Продвинутые курсы

    Также доступны более продвинутые видеокурсы. Несколько хороших вариантов:

    Advanced Components (VueMastery). Углубленное изучение того, как работает Vue, в комплекте с несколькими уроками Эвана Ю, создателя Vue. Как только вы почувствуете себя более уверенно и захотите идти дальше, это то, куда я рекомендую вам отправиться.

    The VueJS Master Class (VueSchool.io). Курс, ориентированный на проект, в котором с нуля создается полное приложение и в процессе освещаются все практически аспекты Vue.js. Преподает Алекс Кириакидис, член основной команды Vue и автор книги «Величие Vue.js»

    Последующее обучение

    По мере того как вы выходите за рамки «как вообще это работает», вы хотите расширить спектр ресурсов, которые используете для обучения. Существует ряд ресурсов, на которых вы можете получить более продвинутые статьи, учебные пособия и инструменты.

    Vue News, подкаст и еженедельная рассылка, в которых освещены последние новости. Официальный источник новостей, получивший одобрение основной команды Vue.

    Vuejsdevelopers.com, блог и еженедельные рассылки, посвященные продвинутым темам.

    Vue Feed, веб-сайт, информационные рассылки и твиттер, с руководствами, плагинами и многим другим.

    CSS Tricks, возможно, начинали с CSS, но сейчас вы можете найти у них внушительное количество качественных статей по Vue.

    Читать еще:  Видео урок как играть на гитаре

    Views on Vue — это еженедельный подкаст в сети devchat.tv, ориентированный на Vue, с участием нескольких членов основной команды.

    Vue Land Discord — это чат, ориентированный на Vue, в котором вы можете задавать вопросы, устанавливать связи и учиться.

    Заключение

    Как вы можете видеть, доступно много ресурсов для изучения Vue.js. Вопрос только в том, какой стиль обучения подойдет для вас, и сколько времени и сил вы потратите на изучение?

    Если вы отлично учитесь самостоятельно, начните с официального руководства.

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

    Или, если вам нравится более интерактивное обучение и возможность задавать вопросы специалисту, ознакомьтесь с LearnVueJS.com.

    Редакция: Команда webformyself.

    Как создать сайт самому?

    Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

    КУРС ПО VUE.JS
    С НУЛЯ ДО ПРО

    Овладей трендовым фреймворком в курсе vue.js — с нуля до про. Полное руководство по современной веб-разработке!

    Что вас ждёт в процессе обучения?

    Курс нацелен на успешное прохождение интервью и дальнейшее трудоустройство

    Более 150 Видео. 0% воды и 100% практических примеров, которые действительно пригодятся в работе.

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

    Проверка домашних заданий, а так же общие рекомендации и консультации на всех этапах.

    7 современных приложений для вашего портфолио и GitHub

    Именной сертификат об окончании курса с общими рекомендациями и оценкой

    Чему Вы научитесь:

    Правильно разделять код и UI на компоненты

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

    Разрабатывать полноценные приложения на стеке vue.js

    Vue.js является лишь представлением данных. Мы также изучим как хранить данные, а также взаимодействововать с ними по технологии REST API. Как общаться с сервером — принимать и отдавать запросы.

    На API строится весь современный веб. Понимание того как работют такие технологии как REST API или GraphQL делают вас намного востребованнее и профессиональнее.

    Состоянию приложения с VUEX

    Actions, Mutations, State, Getters — все для правильного храненения данных и их дальнейшего взаимодействия.

    Роуты и авторизация

    Авторизация на клиенте, защита данных, проверка авторизации на сервере. Скрытие роутов для не зарегистрированных пользователей. Разграничение ролей.

    Выбирать правильные инструменты и технологии

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

    Оптимизировать Vue.js приложения

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

    Почему нужно учить vue?

    Vue – мировой лидер фреймворков! Этот фреймворк используется среди компний крупного и среднего бизнеса по всему миру. Самую большую популярность vue.js получил на китайском и европейском рынке. Его используют большинство китайских компаний: Alibaba (мировой лидер торговли в сети), Baidu (IT-гигант, лидер отрасли), Xiaomi, Sina Weibo и другие крупные компании.

    Vue.js входит в ядро Laravel, а так же PageKit. Система управления репозиториями GitLab так же перешла на Vue.js.

    По статистике Google Trends — Vue является самым популярным фреймворком в мире:

    В России и СНГ Vue становится все более и более популярным:

    Профи c GitHub так же выбирают Vue:

    Vue создан значительно позже аналогичных фреймворков от Google (Angular) и Facebook (React), поэтому логичным образом учел все преимущества и недостатки двух последних. Сегодня профи веб-разработки все чаще предпочитают простой, легкий, мощный и расширяемый Vue другим популярным фреймворкам.

    На текущий момент Vue почти в три раза популярнее Angular. И уже обогнал своего ближайшего конкурента – React от Facebook.

    После прохождения курса Вы сможете смело расчитывать на текущую зарплату,
    более того — ставить ее как минимальную.

    Ссылка на основную публикацию
    ВсеИнструменты 220 Вольт
    Adblock
    detector