Курс по Angular
Этот онлайн-курс посвящён профессиональной разработке веб-приложений с помощью Angular.
Цели курса
- Быстро и качественно начать создавать приложения с использованием современного Angular.
- Отлаживать уже существующие приложения и проводить их улучшение.
- Научиться использовать ряд вспомогательных библиотек, часто дополняющих Angular.
Как организовано обучение?
Курс идёт 6 недель.
До начала обучения: вводные материалы
Мы будем использовать систему Git/GitHub для обмена исходным кодом, так делает большинство проектов. Для тех, кому это в новинку - дадим крэш-курс и поможем разобраться.
Онлайн-занятия с преподавателем 2 раза в неделю
Занятие проходит в формате вебинара. Запись занятия доступна через 15 минут после окончания. Вы также сохраняете доступ к записям после окончания курса.
Домашние задания, обратная связь по ним
Ваши решения присылаете преподавателю, он проверяет качество кода, использование правильных приёмов проектирования, даёт обратную связь.
Чат
Между занятиями доступен групповой чат для общения и вопросов преподавателю.
Курсовой проект
Делаем курсовой проект: интернет-магазин. Большую часть кода для проекта пишете вы.
Результат
Вы хорошо знаете Angular, свободно разрабатываете и отлаживаете приложения.
Вы умеете проектировать и создавать сложные интерфейсы.
Сертификат
По окончанию курсов вы получаете сертификат в электронном виде на русском и английском языках.
Хотя сертификатам в нашей профессии обычно не придают значения. Главное - знания и умения, которые вы получите, если будете полноценно участвовать в курсе.
Программа по занятиям
Программа может быть дополнительно адаптирована под темп обучения и вопросы группы.
Собрание
Первая встреча традиционно считается вводной. На ней мы знакомимся, проверяем подключение, обсуждаем организационные вопросы, способы взаимодействия с преподавателем и процесс обучения.
Окружение и дополнительные библиотеки
Знакомимся с angular-cli и экосистемой Angular. Создаем и настраиваем новый Angular-проект со стадии пустого репозитория. Разбираем настройки окружения и компиляцию Angular-приложения.
Устанавливаем вспомогательные библиотеки для качественной и быстрой разработки (форматировщики кода, линтеры, библиотека ui-компонентов).
Компоненты и работа с шаблонами
Разбираем базовую конфигурацию компонента: selector, tempalte/tempalteUrl, styles/styleUrls, encapsulation.
А также синтаксис шаблонов Angular (в контексте компонента): как работает интерполяция, связывание и прослушивание событий в шаблоне.
Взаимодействие компонентов
Разбираем механизм обмена данных родительского и дочернего компонента через свойства Input и Output, и механизм двустороннего привязывания (two way binding).
Рассмотрим способы обращения к сущностям, используемым в шаблоне:
- Шаблонные переменные
- Декоратор ViewChild со всеми тонкостями работы с ним, а также деккоратор ViewChildren
Контент компонента. Вставка шаблона
Разбираем механизмы взаимодействия с контентом, переданным компоненту:
- Статичное проецирование контента - тэг ng-content
- Декоратор ContentChild для получения сущностей из контента, а также деккоратор ContentChildren
Разберем такой элемент, как ng-template, взаимодействие с ним через сущность TemplateRef, сущность ViewContainerRef и как при помощи последней создавать View из шаблона.
Directives
Разберем работу атрибутивных директив, изучим декораторы HostListener и HostBinding, напишем директиву для "бесконечного" скролла.
Разберем работу структурных директив, научимся работать с контекстом шаблона, разберем "сахарный" синтаксис структурных директив. Напишем свои структурные директивы для карусели и пагинации.
Также рассмотрим базовые атрибутивные (ngClass) и структурные (ngIf и ngFor) директивы, и лучшие практики по работе с ними.
Change Detection. Pipe
Разберем механизм обнаружения изменений в Angular, узнаем, какую роль в данном механизме играет библиотека Zone.js. Изучим стандартные стратегии Change Detection: Default и OnPush, и разберем механизмы для написания кастомной стартегии обнаружения изменений.
Изучим пайпы, их область применения, различия между pure и impure пайпами. Разберем дефолтные пайпы в Angular: json, async, currency. А также напишем собственный пайп для фильтрации данных.
Dependency Injection. Service. Работа с запросами
Разберем механизм DI в Angular, узнаем, для чего он нужен и какие проблемы решает, познакомимся с Injector сущностью, разберем способы подключения зависимостей, возможность их получения через механизм DI, а также иерархию поиска зависимостей. Узнаем зачем нужен декоратор Injectable и какие возможности он предоставляет, рассмотрим лучшие практики по созданию собственных токенов в приложении.
Разберем отправку запросов при помощи механизмов Angular, и какую роль в запросах играет Interceptor
Реализуем сервисы для хранения и получения данных с сервера, а также передадим эти данные в компонент для отображения.
Навигация
Разберем, что такое SPA, и как Angular работает с url. Рассмотрим и составим конфигурацию навигации. Изучим lazy loading, как он может помочь в оптимизации приложения и что делает preloadingStrategy. Реализуем навигацию внутри приложения, рассмотрим абсолютную и относительную навигацию в приложении. Изучим params в url, а также queryParams.
Изучим "защитников" навигации (Guards), разберем их типы, отличия и тонкости.
Формы
Изучим ControlValueAccessor, и зачем он нужен в Angular. Напишем свой кастомный инпут.
Разберем механизмы template-driven forms и reactive forms, как они устроены, нюансы работы с ними и как они связаны с ControlValueAccessor.
Изучим синхронную и асинхронную валидацию форм в контексте template-driven forms и reactive forms. Рассмотрим возможности для кастомизации состояния инпута.
Реализуем форму, состоящую из нескольких инпутов и разберем специфику работы с ней при применении template-driven forms и reactive forms.
Redux-архитектура. NgRx
Познакомимся с паттерном Redux и его реактивной реализацией - NgRx, изучим основные концепции.
Интегрируем NgRx в свой проект, научимся формировать состояние приложения и обновлять его, а также разберем агрегацию данных при помощи селекторов
Рассмотрим обработку асинхронных событий и сторонних эффектов (side effects).
Тестирование
Разберем пирамиду тестирования, рассмотрим TDD/BDD-разработку. Познакомимся с фреймворком для тестирования и тест-ранером, подключаемым в Angular по дефлоту. Изучим утилиту для настройки тестового окружения для Angular - TestBed
Разберем тестирование сервисов, как общие практики, так и специфику тестирования HttpClient. Также разберем тестирование компонентов/директив/пайпов, в том числе специфику тестирования с использованием шаблона.
Курсовой проект
Интернет магазин.
- Одностраничное приложение с динамической подгрузкой страниц.
- Redux-архитектура.
- Фильтрация товаров по нескольким критериям с сохранением состояния.
- Слайдер, tooltip, и ряд других графических компонентов на Angular.
Преподаватель
Front-end | Angular разработчик в Tinkoff, занимаюсь разработкой чата для обслуживания и CMS для контроля качества. В Angular-разработке уже более 5 лет.
Также обучаю разработке в финтехе и провожу собеседования по Angular.
Что говорят о курсе участники?
Мы занимаемся обучением с 2007 года. За это время у нас обучились тысячи разработчиков из разных стран и компаний.
Все отзывы являются честными. Мы не модерируем их.
Курс регулярно обновляется. Все отзывы относятся к последней версии курса.
Гарантия
- Если объяснения будут вам непонятны
- Если курсы не дадут вам новых знаний и умений
- Если вы не сможете подключиться к системе онлайн-обучения
…то вы сможете получить деньги назад.
Для этого достаточно не позже окончания первой недели курса написать, что именно вас не устраивает, и тогда ваше участие будет прекращено, а вы получите деньги обратно.
Для компаний
У нас большой опыт работы с самыми разными компаниями: как маленькими, так и IT-гигантами.
- При записи нужно выбрать способ оплаты "счёт на компанию", и документы будут автоматически сгенерированы: договор, акт и счёт, есть лицензия.
- Для зарубежных компаний выдаём инвойс на английском языке.
Физическим лицам даём справку об оплате, если нужна компании для компенсации расходов и документы для налогового вычета: детали для РФ.
Запись на курс
Если остались вопросы – посмотрите в часто задаваемых, напишите на почту help@javascript.ru (ответ обычно в течение дня), а если срочно — задайте по телефону +7-903-5419441.
Комментарии вернулись :)
<code>
, для нескольких строк кода — тег<pre>
, если больше 10 строк — ссылку на песочницу (plnkr, JSBin, codepen…)