webformyself.com

Скачайте БЕСПЛАТНЫЙ мини-курс и изучите базовые возможности JavaScript-фреймворка Angular 4 за ближайшие 3 дня

Angular 4Быстрый старт

Куда вам отправить курс?


Какие знания вы получите

  • Изучите базовый функционал фреймворка Angular 4 и изучите его стандартные элементы: компоненты, сервисы, директивы, пайпы и роутинг
  • Узнаете, как создавать компоненты, выводить их и делать связку различных компонентов
  • Узнаете, как использовать пайпы, которые позволяют динамически фильтровать различные данные
  • Узнаете, как использовать директивы, которые «слушают» различные события и меняют при этом поведение разметки
  • Узнаете, как создавать динамические страницы. В итоговом приложении создается главная страница и страница настроек, которая работает с общими сервисами
  • По итогам всего курса создается полноценное динамическое веб-приложение фотогалереи с динамическим выводом карточек пользователей, со страницей настроек отображения карточек, динамической фильтрацией по различным параметрам

Краткое описание видеоуроков


Видео урок

Урок 1. Настройка Angular

  • Время ролика: 21:58
  • Cложность: легкая

В этом уроке вы познакомитесь с Angular 4. Вы узнаете, чем отличаются Angular 1, Angular 2, Angular 3 и Angular 4, и узнаете, что именно вам стоит изучать.

Устанавливается Angular 4 самым эффективным способом (с помощью инструмента Angular CLI), а также разбирается, как работает Angular 4.


Видео урок

Урок 2. Создание компонента в Angular 4

  • Время ролика: 16:23
  • Cложность: легкая

В данном уроке вы узнаете, как создаются компоненты в Angular 4, и как они взаимодействуют друг с другом.

 


Видео урок

Урок 3. Вывод списка элементов в Angular 4

  • Время ролика: 10:46
  • Cложность: легкая

В этом уроке вы узнаете, как с помощью специального синтаксиса Angular 4 можно выводить динамические элементы в шаблоне.

Реализуется вывод элементов в шаблоне в зависимости от длины массива данных, заданных в typescript.

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


Видео урок

Урок 4. Сервер и сервисы в Angular 4

  • Время ролика: 23:16
  • Cложность: легкая

Вы узнаете про две сущности Angular 4 – сервисы и классы для работы с Ajax-запросами.

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

Далее вы увидите, как правильно расшифровать ответ сервера, и распарсить данные в любой удобный формат с помощью библиотеки RxJS, которая составляет часть ядра Angular 4.

После этого выводятся в шаблон все данные, и вы также увидите какие есть тонкости этого процесса.


Видео урок

Урок 5. Директивы Angular 4

  • Время ролика: 15:25
  • Cложность: легкая

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

Далее используется встроенная директива для динамического изменения стиля элемента.

После этого вы увидите, как создаются и регистрируются свои собственные директивы. Здесь «слушается» событие наведения мыши на элемент и добавляется класс для красивого отображения элемента (но делается это самым эффективным способом от Angular 4, который кардинально отличается от обычной JavaScript-реализации).


Видео урок

Урок 6. Пайпы в Angular 4: создание фильтра

  • Время ролика: 11:24
  • Cложность: легкая

В этом уроке вы познакомитесь с понятием пайпов в Angular 4. Для начала вы увидите синтаксис по применению стандартных пайпов, например, для изменения регистра текста.

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

Для этого еще разбирается понятие “2 way data binding” с использованием Angular Model.


Видео урок

Урок 7. Роутинг в Angular 4: создание страниц

  • Время ролика: 15:33
  • Cложность: легкая

В этом заключительном уроке вы узнаете, как с помощью Angular 4 можно создавать разные страницы.

Содается 2 роута – для главной страницы и для страницы настроек. Далее создается 2 компонента, но уже не самостоятельно, а с помощью инструмента Angular CLI, для того чтобы ускорить процесс.

После этого создается навигационная панель для моментального переключения страниц.

В конце урока вы увидите, как связать страницу настроек и главную страницу.

Куда вам отправить курс?


Автор курса

Владилен Минин

Владилен Минин

  • Высокооплачиваемый профи Front-End разработки. Подготовил более 100 Front-End разработчиков вживую.
  • Занимает должность Senior Front-End Developer крупной международной компании
  • Является Team Lead во многих внутренних проектах компании
  • Участвует в обучении студентов Front-End разработке
  • Программированием занимается уже более 6 лет, 4 из которых были посвящены Front-End разработке
  • Ежемесячный доход стабильно находится у отметки в 200 тысяч рублей
  • Автор видеокурса «Препроцессоры Sass и Less. Автоматизация и упрощение Front-end разработки» и нескольких других популярных видеокурсов на тему Front-end разработки
  • Автор видеокурса «Angular 4 c Нуля до Профи. Полное руководство для современной веб-разработки»

Куда вам отправить курс?

*Данное рекламное предложение не является публичной офертой.

* Курс преднозначен для самостоятельного изучения.

Отказ от ответственности | Политика конфиденциальности | Согласие с рассылкой