ЗАСТОСУВАННЯ І WEB РОЗВИТОК
Програмування Angular 15
ДОВЖИНА 5 днів
ВЕРСІЯ 15
ЧОМУ ВИВЧАТИ ЦЕЙ КУРС
Цей інтенсивний і всеосяжний навчальний курс Angular 15 надає слухачам навички, які вони можуть негайно використовувати у своїй роботі. Ви дізнаєтеся про основи розробки Angular 15, такі як односторінкові браузерні додатки, адаптивний webсайти та гібридні мобільні додатки.
Цей курс є поєднанням теоретичного навчання та практичних лабораторних робіт, який включає вступ до Angular, а потім TypeScript, компоненти, прямі файли, служби, HTTPClient, тестування та налагодження.
Примітка: Ми також можемо провести навчання з інших версій Angular. Будь ласка, зв'яжіться з нами, щоб зробити запит або зареєструвати свій інтерес.
КУТОВИЙ ПРИ СВІТЛОВІЙ РОБОТИ
ЩО ВИ ДІЗНАЄТЕСЯ
Після успішного завершення цього курсу ви матимете знання щодо:
- Розробіть односторінкові додатки Angular за допомогою Typescript
- Налаштуйте повне середовище розробки Angular
- Створюйте компоненти, Direct ives, Services, Pipes, Forms і Custom Validators
- Виконуйте розширені завдання пошуку мережевих даних за допомогою Observables
- Споживати дані з REST web послуги за допомогою Angular HTTP Client
- Обробляти іони підключення push-data за допомогою WebПротокол сокета
- Працюйте з Angular Pipes для форматування даних
- Використовуйте розширені функції Angular Component Router
- Тестуйте та налагоджуйте додатки Angular за допомогою вбудованих інструментів
- Робота з Angular CLI
Мій інструктор був чудовий, оскільки зміг застосувати сценарії в реальних випадках, які стосувалися моєї конкретної ситуації.
З того моменту, як я прибув, мене прийняли, і можливість сидіти групою поза межами класу, щоб обговорити наші ситуації та наші цілі, була надзвичайно цінною.
Я багато чому навчився і вважав важливим, щоб мої цілі завдяки відвідуванню цього курсу були досягнуті.
Чудова робота, робоча команда Lumify.
АМАНДА НІКОЛЬ
МЕНЕДЖЕР СЛУЖБ ІТ-ПІДТРИМКИ – HEALTH WORLD LIMITED
ПРЕДМЕТИ КУРСУ
- Представляємо Angular
• Що таке Angular?
• Основні особливості кутового каркаса
• Відповідні випадки використання
• Будівельні блоки програми Angular
• Базова архітектура програми Angular
• Встановлення та використання Angular
• Анатомія кутової аплікації
• Запуск програми
• Створення та розгортання програми
• Angular для рідних мобільних програм - Вступ до TypeScript
• Мови програмування для використання з Angular
• Синтаксис TypeScript
• Редактори програмування
• Система типів – Визначення змінних
• Система типів – Визначення масивів
• Основні примітивні типи
• Введіть Function ions
• Вивід типу
• Визначення класів
• Методи класу
• Контроль видимості
• Конструктори класів
• Конструктори класів – альтернативна форма
• Неініціалізовані поля
• Інтерфейси
• Робота з модулями ES6
• var проти let
• Функції стрілок
• Компактний синтаксис функції стрілки
• Рядки шаблону
• Generics in Class
• Узагальнення у Function ion - компоненти
• Що таке компонент?
• Ексample Component
• Створення компонента за допомогою Angular CLI
• Клас компонентів
• Декоратор @Component
• Реєстрація компонента в його модулі
• Шаблон компонента
• Напрample: Шаблон HelloComponent
• Напрample: клас HelloComponent
• Використання компонента
• Запустіть програму
• Ієрархія компонентів
• Кореневий компонент програми
• Bootstrap File
• Перехоплювачі життєвого циклу компонентів
• Напрample Хуки життєвого циклу
• Стилі CSS - Шаблони компонентів
• Шаблони
• Розташування шаблону
• Синтаксис Moustache {{ }}
• Встановлення властивостей елемента DOM
• Встановлення основного тексту елемента
• Прив'язка подій
• Обробник подій виразу
• Запобігання обробці за замовчуванням
• Директиви атрибутів
• Застосовуйте стилі, змінюючи класи CSS
• Напрampфайл: ngClass
• Безпосереднє застосування стилів
• Структурні директиви
• Шаблон умовного виконання
• Напрample: ngIf
• Цикл за допомогою ngFor
• ngДля локальних змінних
• Маніпулювання колекцією
• Напрample – Видалення елемента
• Відстеження предметів за допомогою ngFor
• Заміна елементів за допомогою ngSwitch
• Групування елементів
• Довідкова змінна шаблону - Міжкомпонентна комунікація
• Основи спілкування
• Архітектура потоку даних
• Підготовка дитини до отримання даних
• Надіслати дані від батьків
• Докладніше про налаштування властивостей
• Запуск події з компонента
• @Output() Напрample – дочірній компонент
• @Output() Напрample – батьківський компонент
• Повне двостороннє прив'язування
• Налаштування двостороннього зв’язування даних у батьківському - Форми, керовані шаблонами
• Форми на основі шаблонів
• Модуль імпорту форм
• Базовий підхід
• Налаштування форми
• Отримання даних користувача
• Опущено атрибут ngForm
• Ініціалізація форми
• Двостороннє прив'язування даних
• Перевірка форми
• Кутові валідатори
• Відображення стану перевірки за допомогою класів
• Додаткові типи введення
• Прапорці
• Вибір полів (випадний список).
• Параметри візуалізації для вибору (випадаючий список)
• Поля дати
• Перемикачі - Реактивні форми
• Reactive Forms Overview
• Будівельні блоки
• Імпорт Reactive FormsModule
• Побудуйте форму
• Створіть шаблон
• Отримання вхідних значень
• Ініціалізація полів введення
• Встановлення значень форми
• Підписка на введення змін
• Валідація
• Вбудовані валідатори
• Відображення помилки підтвердження
• Спеціальний засіб перевірки
• Використання спеціального засобу перевірки
• Надання конфігурації до користувацького засобу перевірки
• FormArray – динамічне додавання входів
• FormArray – клас компонентів
• FormArray – шаблон
• FormArray – Значення
• Sub FormGroups – клас компонентів
• Sub FormGroups – шаблон HTML
• Навіщо використовувати Sub FormGroups - Послуги та впровадження залежностей
• Що таке послуга?
• Створення базової служби
• Клас обслуговування
• Що таке ін'єкція залежності?
• Введення екземпляра служби
• Інжектори
• Ієрархія інжектора
• Реєстрація служби за допомогою Root Injector
• Реєстрація служби за допомогою інжектора компонентів
• Зареєструйте службу за допомогою інжектора модуля функцій
• Де зареєструвати послугу?
• Впровадження залежностей в інші артефакти
• Надання альтернативної реалізації
• Впровадження залежностей і @Host
• Ін’єкція залежностей і @Optional - Клієнт HTTP
• HTTP-клієнт Angular
• Використання HTTP-клієнта – завершеноview
• Імпорт HttpClientModule
• Служба за допомогою HttpClient
• Створення запиту GET
• Що робить спостережуваний об’єкт?
• Використання служби в компоненті
• Клієнтський компонент PeopleService
• Обробка помилок
• Налаштування об'єкта Error
• Створення POST-запиту
• Створення запиту PUT
• Створення запиту на видалення - Конвеєри та форматування даних
• Що таке труби?
• Вбудовані труби
• Використання каналів у шаблоні HTML
• З’єднання труб
• Інтернаціоналізовані труби (i18n)
• Завантаження даних про мову
• Трубка фініків
• Число Труба
• Валютна труба
• Створіть спеціальну трубу
• Спеціальна труба Example
• Використання спеціальних каналів
• Використання каналу з ngFor
• Фільтруюча труба
• Категорія сопілки: чиста та нечиста
• Pure Pipe Example
• Нечиста труба Example - Вступ до односторінкових програм
• Що таке односторінкова програма (SPA)
• Традиційний Web застосування
• SPA Workflow
• Односторінкова програма Advantages
• HTML5 History API
• SPA виклики
• Реалізація SPA за допомогою Angular - Кутовий маршрутизатор компонентів
• Компонентний маршрутизатор
• View Навігація
• API Angular Router
• Створення програми з підтримкою маршрутизатора
• Розміщення маршрутизованих компонентів
• Навігація за допомогою посилань і кнопок
• Програмна навігація
• Передача параметрів маршруту
• Навігація за допомогою параметрів маршруту
• Отримання значень параметрів маршруту
• Синхронне отримання параметра маршруту
• Асинхронне отримання параметра маршруту
• Параметри запиту
• Надання параметрів запиту
• Асинхронне отримання параметрів запиту
• Проблеми з інструкцією URL запис і створення закладок - Розширений HTTP-клієнт
• Параметри запиту
• Повернення об’єкта HttpResponse
• Налаштування заголовків запитів
• Створення нових спостережуваних
• Створення простого спостережуваного
• Метод спостережуваного конструктора
• Спостережувані оператори
• Карта і фільтр операторів
• Оператор flatMap().
• Оператор tap().
• Комбінатор zip().
• Кешування відповіді HTTP
• Здійснення послідовних викликів HTTP
• Здійснення паралельних викликів
• Налаштування об’єкта Error за допомогою catchError()
• Помилка в конвеєрі
• Відновлення помилок - Кутові модулі
• Чому кутові модулі?
• Анатомія модульного класу
• Властивості @NgModule
• Функціональні модулі
• Напрample Модульна структура
• Створіть модуль домену
• Створіть пару маршрутизації/модуля маршрутизації
• Створіть сервісний модуль
• Створення загальних модулів
• Використання одного модуля з іншого - Розширена маршрутизація
• Функціональний модуль із підтримкою маршрутизації
• Використання модуля функцій
• Ледаве завантаження модуля функцій
• Створення посилань для компонентів функціонального модуля
• Докладніше про відкладене завантаження
• Попереднє завантаження модулів
• прив'язка routerLinkActive
• Маршрут за замовчуванням
• Шлях маршруту підстановки
• redirectTo
• Дитячі маршрути
• Визначення дочірніх маршрутів для дочірніх маршрутів
• Посилання для дочірніх маршрутів
• Навігаційна гвардія
• Створення реалізацій Guard
• Використання охоронців на маршруті - Модульне тестування кутових додатків
• Модульне тестування кутових артефактів
• Інструменти тестування
• Типові етапи тестування
• Результати тестування
• Набори тестів Жасмін
• Характеристики Jasmine (модульні тести)
• Очікування (Стверджувальні іони)
• Сірники
• Напрampопис використання відповідників
• Використання властивості not
• Налаштування та демонтаж у Unit Test Suites
• НапрampФайли функцій beforeEach і afterEach
• Кутовий тестовий модуль
• НапрampКутовий тестовий модуль
• Тестування служби
• Введення екземпляра служби
• Перевірте синхронний метод
• Перевірте асинхронний метод
• Використання фальшивого клієнта HTTP
• Надання шаблонної відповіді
• Тестування компонента
• Модуль тестування компонентів
• Створення екземпляра компонента
• Клас ComponentFixture
• Тести основних компонентів
• Клас DebugElement
• Імітація взаємодії користувача - Налагодження
• Надview кутового налагодження
• Viewкод TypeScript у Debugger
• Використання налагоджувача Keyword
• Журналування налагодження
• Що таке Angular DevTools?
• Використання Angular DevTools
• Angular DevTools – Структура компонентів
• Angular DevTools – Виявлення змін. Виконання
• Виявлення синтаксичних помилок
ДЛЯ КОГО КУРС?
Цей курс призначений для всіх, кому потрібно вивчити основи розробки Angular 15 і відразу застосувати їх для створення web програми.
Ми також можемо провести та налаштувати цей навчальний курс для великих груп, заощаджуючи час, гроші та ресурси вашої організації. Для отримання додаткової інформації, будь ласка, зв’яжіться з нами електронною поштою на ph.training@lumifywork.com
ПРЕДМЕТНІСТЬ
- Web щоб отримати максимальну віддачу від цього курсу Angular, потрібен досвід розробки з використанням HTML, CSS і JavaScript
- Також корисно знати DOM браузера
- Попередній досвід роботи з Angular або AngularJS не потрібен
Пропонування цих курсів компанією Lumify Work регулюється умовами бронювання.
Будь ласка, уважно прочитайте положення та умови, перш ніж записатися на цей курс, оскільки реєстрація на курс є умовою прийняття цих умов.
https://www.lumifywork.com/en-ph/courses/angular-15-programming/
ph.training@lumifywork.com
lumifywork.com
facebook.com/LumifyWorkPh
linkedin.com/company/lumify-work-ph
twitter.com/LumifyWorkPH
youtube.com/@lumifywork
Документи / Ресурси
 |
Програмування LUMIFY WORK Angular 15 [pdfПосібник користувача Програмування Angular 15, програмування |
