Консультация

Консультируем с 8:30 до 19:00 Выходной: суббота и воскресенье


Сообщение об ошибке
Сообщение об ошибке

Разработка SPA приложений с Angular by Instinctools

Профессиональный курс (обязателен для трудоустройства)

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

Описание курса

Формы обучения

Вечерняя

по мере комплектации группы
Понедельник, пятница с 18.30 до 21.20
785 BYN
84 уч. часа
Рассрочка три выплаты 288 BYN / месяц
№ группы: G-FD3-02-19

Для кого этот курс

  • Для тех, кто умеет создавать веб-страницы на «нативном» JavaScript и хочет научиться делать это на более высоком уровне;

  • Для тех, кто хочет получить «свежие» теоретические знания и практический опыт в разработке на современных версиях фреймворков.

Необходимая подготовка

  • Владение базовыми навыками вёрстки;

  • Понимание объектно-ориентированного программирования в стиле ES6;

  • Умение писать регулярные выражения;

  • Умение работать с JSON и AJAX.


Без входного тестирования будут приниматься слушатели, успешно закончившие обучение на курсе FD2 «Разработка веб-приложений на JavaScript».

Почему нужна базовая подготовка

Без базового понимания вёрстки и объектно-ориентированного программирования заметная часть курса пройдёт мимо слушателей. Однако большинство необходимых для успешного усвоения материала знаний, умений и навыков учащиеся будут получать по мере обучения.

Для чего этот курс

Почему именно этот курс:

  • Владение одним из самых популярных фреймворков значительно повышает востребованность веб-разработчика на рынке;

  • Полученные знания углубят и расширят понимание процесса разработки;

  • Использование фреймворка повысит скорость разработки, упростит отладку, тестирование и повторное использование кода;

  • Владение Angular позволит снизить количество ошибок в коде и неверных архитектурных решений.

Вы узнаете

  • Стандарты языка ES6 и ES7 и некоторые шаблоны проектирования;

  • Основные возможности фреймворка Angular;

  • TypeScript - современный язык программирования с классическим подходом к ООП;

  • RxJs

Вы будете уметь

  • Работать с технологией git и сервисом github (он будет использоваться для получения учебных материалов и обмена выполненными работами);

  • Устанавливать и настраивать среду разработки JetBrains Webstorm;

  • Устанавливать пакетный менеджер npm от Node.js и конфигурировать зависимости проектов;

  • Разрабатывать разнообразные интерактивные компоненты, сервисы и директивы на  Angular;

  • Тестировать разработанные программные модули;

  • Применять объектно-ориентированный подход для разработки компонентов;

  • Настраивать маршрутизацию.

Программа курса

  1. Введение в курс
    Знакомство
    Содержание курса - общий обзор
    Организация работы в рамках курса. Настройка рабочего окружения (Workflow, Git)
  2. TypeScript
    Введение. Общее представление о TypeScript
    Настройка окружения для работы c TypeScript
  3. TypeScript
    ES6/7. Обзор необходимых элементов языка.
    Типы (Types).
    Пользовательские типы (Custom types).
  4. TypeScript
    Классы (Classes)
    Обобщения (Generics)
    Модули (Modules)
  5. TypeScript
    Разработка реальных приложений с использованием TypeScript
    Декораторы (Decorators)
  6. Angular. Введение
    Введение в Angular. Что такое Angular ?
    Обзор версионирования
    Настройка окружения и создание первого приложение на Angular с использованием Angular CLI
    Примеры редактирования и работы с простым каркасом приложения
  7. Angular. Основы
    Как загружается и стартует приложение на Angular
    Введение в компоненты
    Создание нового компонента
    Понимание роли AppMudule и Component Declaration
    Создание компонента с использованием Angular CLI. Вложенные компоненты.
    Работа с шаблоном компонента
    Работа со стилями компонента
    Понимание селектора компонента
    Что такое связывание данных
    Основные виды связывания данных: "String Interpolation"
    Основные виды связывания данных: "Property Binding"
  8. Angular. Основы
    Основные виды связывания данных: "Event Binding"
    Передача и использование данных с помощью "Event binding"
    Основные виды связывания данных: "Two-Way-Databinding"
    Объединение всех разобранных видов связывания данных.
    Общее представление о директивах
    Использование ngIf
    Использование ngIf (использование else)
    Использование ngStyle
    Использование ngClass
    Использование ngFor
    Разработка тестового приложения на основе пройденного материала
  9. Angular. Дебаг приложения
    Работа с сообщениями об ошибках в Angualr
    Дебаг кода в браузере
    Использование Augury при работе с Angular приложением
  10. Angular. Компоненты и связывание данных
    Разбиение приложения на компоненты
    Пользовательские свойства и связывание данных.
    Пользовательские события и связывание данных
    Понимание "View Encapsulation"
    Использование "Local References" в шаблонах
    Получение доступа к шаблону и DOM с помощью @ViewChild
    Передача структурированного содержимого в компоненты через "ng-content"
    Получение доступа к ng-content (@ContenttChild)
  11. Angular. Жизненный цикл компонента. Директивы
    Жизненный цикл компонента (Lifecycle Hooks)
    Повторение: ngFor и ngIf
    Повторение: ngClass и ngStyle
    Создание пользовательской "Attribute Directive". Использование "Renderer" при постоении директивы.
    Использование "HostListener" и "HostBinding" при работе с событиями и свойствами.
    Связывание данных и директивы
    Создание пользовательской "Structural Directive". Понимание ngSwitch.
    Разработка тестового приложения на основе пройденного материала (Связывание данных и дериктивы)
  12. Angular. Использование сервисов. Внедрение зависимостей
    Общее представление о сервисах
    Примеры реализации нескольких тестовых сервисов
    Внедрение зависимостей - общее представление. Реализация "Dependency Injection" в Angular
    Внедрение созданных сервисов в компонент
    Внедрение созданных сервисов в сервис
    Использование сервисов для организации коммуникации между компонентами
    Разработка тестового приложения на основе пройденного материала (Сервисы)
  13. Angular. Роутинг
    Общее представление о маршрутизации. Зачем необходим "Router".
    Настройка и загрузка маршрутов.
    Навигация с "Router Links"
    Понимание маршрутов навигации
    Стилизация ссылок
    Передача параметров маршрутам
    Извлечение параметров маршрута
    Передача параметров запроса
    Разбор некоторых распространенных ошибок при работе с роутингом
    Настройка дочерних (вложенных) маршрутов
    Использование параметров запроса
    Настройка обработки параметров запроса
    Переадресация
    Использование "Guards" в маршрутизации
  14. Angular. Роутинг
    Управление навигацией с помощью canDeactivate
    Передача статических данных
    Понимание "Location Strategies"
    Разработка тестового приложения на основе пройденного материала (Роутинг)
  15. Реактивное программирование (RxJS)
    Общее представление про RxJS
    Observable
  16. Реактивное программирование (RxJS)
    Observer
    Subscription
    Subject
    Operators
    Scheduler
  17. Angular. Observables
    Анализ реализации и использования Observable в Angular
    Пример реализации и использования Observable
    Unsubscribe
    Использование Subjects при работе с данными в Angular
    Использование Observable операторов при работе с данными в Angular
    Разработка тестового приложения на основе пройденного материала (Роутинг)
  18. Angular. Формы
    Angular и формы - введение
    Сравнение Template-Driven (TD) и Reactive подходов
    Примеры форм
    TD: Создание формы и "Controls"
    TD: Работа с формой. Отправка данных.
  19. Angular. Формы
    TD: Понимание "Form State"
    TD: Формы и @ViewChild
    TD: Валидация вводимых пользователем данных
    TD: Использование "Form State"
    TD: Вывод ошибок при валидации
    TD: Установка дефолтных значений с ngModel
    TD: Использование ngModel с двухсторонним связыванием
    TD: Группировка элементов формы
    TD: Обработка "radio" элементов
    TD: Установка и обновление значений полей формы
    TD: Работа с данными формы. Сброс значений формы.
    Reactive: Обзор динамических форм
    Reactive: Создание формы в компоненте
    Reactive: Синхронизация шаблона и формы
    Reactive: Отправка данных
    Reactive: Добавление валидации
    Reactive: Работа с полями формы. Работа с "Arrays of Form Controls"
    Reactive: Создание пользовательского валидатора
  20. Angular. Формы
    Reactive: Использование кодов ошибок
    Reactive: Создание пользовательского асинхронного валидатора
    Reactive: Установка и обновление значений формы
    Разработка тестового приложения на основе пройденного материала (Формы)
  21. Angular. Pipes
    Использование "Pipes"
    Параметризированные "Pipes"
    Множественные "Pipes"
    Создание пользовательских "Pipes"
    Параметризированные пользовательские "Pipes"
    Пример реализации пользовательских "Pipes"
    Понимание асинхронных "Pipes"
  22. Angular. Анимация
    Работа с анимацией в angular
  23. Angular. Http
    Как Http запросы работают в SPAs
    Пример приложения. Установка бэкэнда.
    Отправка запросов. (Пример POST запроса)
    Работа с заголовками
    Отправка запросов. (Пример GET запроса)
    Отправка запросов. (Пример PUT запроса)
    Трансформация ответов сервера с помощью Observable операторов
    Обработка ошибок при Http запросах
    Использование "async Pipe" c Http запросами
    Наследование от Http. Примеры реализации.
    Разработка тестового приложения на основе пройденного материала (Http)
  24. Angular. Аутентификация и защита URL при маршрутизации
    Как работает аутентификация пользователя в SPA
    Общая информация о JWT
    Создание компонента аутентификации и необходимых URL
    Пример реализации логина
    Пример реализации регистрации
    Работа с токеном
    Проверка и использование аутентификационной информации
    Пример реализации выхода пользователся из системы
    Защита URL и редирект
  25. Angular. Модули. Оптимизация приложения
    Использования модулей
    Разбиение приложения на модули.
    Примеры реализации модулей.
  26. Angular. Модули. Оптимизация приложения
    Примеры реализации модулей. Роутинг для модулей.
    Понимание "Shared Modules". Примеры реализации.
    Загрузка компонентов через селектор или через роутинг
    Понимание "Lazy Loading" для модулей
    Пример реализации "Lazy Loading"
    Роутинг и "Lazy Loading"
    Совместная работа модулей и сервисов (Child Injector )
    Понимание базового модуля приложения. Примеры базового модуля приложения.
    Использование "Ahead-of-Time Compilation"
    Использование AoT с CLI
  27. Angular. Тестирование
    Unit-тесты и TDD
    Специфика тестирования компонентов и внедряемых сущностей
    Покрытие кода тестами
  28. Angular. Тестирование. Итоги курса
    Защита выпускного проекта
    Заключение. Итоги курса.

Преподаватели курса

Александр Сташкевич

Программирование, особенно Frontend, - это огромный, сложный, быстро изменяющийся и развивающийся мир. Настоящий Frontend разработчик готов впитывать новые технологии, постоянно развиваться, работать с новыми библиотеками, инструментами … Как сверстать сайт? Какой инструментарий для этого необходим? Как организовать проект? Что выбрать - ReactJS или Angular? Ответы на эти и многие другие вопросы вы найдете в курсах по Frontend разработке.

Кратко о себе :

Full stack WEB developer в instinctools. Занимаюсь Frontend разработкой более 5 лет. В работе неоднократно приходилось обучать junior-разработчиков. Разрабатывал проекты работающие в режиме реального времени, работающие с IoT устройствами и многое другое …

aliaksandr.stashkevich@instinctools.ru

Оставьте заявку на курс сейчас

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

Более 2760 выпускников успешно работают в IT-компаниях в Беларуси и за рубежом

Акции и новости