NgRx в глубине (Angular 7 и NgRx 7, с БЕСПЛАТНОЙ электронной книгой) - Видеоуроки

NgRx In Depth (Angular 7 and NgRx 7, with FREE E-Book)
Duration 05:04:37
Открыть все курсы от udemy
Облачный хостинг на SSD с лучшей техподдержкой! Развернуть приложение в один клик

Познакомьтесь с современной экосистемой NgRx, включая NgRx Store, Effects, Router Store, NgRx Entity, DevTools и Schematics. Одной из наиболее распространенных проблем, с которыми мы столкнемся как веб-разработчики, являются проблемы управления состоянием. Как правило, они появляются в больших приложениях, где у нас есть несколько компонентов, которые должны одновременно отображать и изменять одни и те же общие данные в разных точках дерева компонентов. В этих ситуациях невозможно, чтобы только один компонент загружал и владел ссылкой на данные, поскольку эти данные необходимы в других частях приложения, с которыми компонент не связан напрямую.

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

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

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

Сокращение количества запросов API также важно, если наше приложение построено на платформе Pay As You Go, такой как Firebase или Amazon AWS, где выставление счетов производится за использованную полосу пропускания.

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

В этом курсе мы подробно рассмотрим наиболее часто используемую реализацию Angular в централизованном дизайне хранилища: мы собираемся охватить экосистему библиотеки Ngrx Angular Reactive Extensions.

Ngrx - это набор связанных библиотек, которые вместе предоставляют полное решение для реализации решения для хранилища в Angular. Мы рассмотрим Ngrx Store, который содержит систему реактивного хранилища, аналогичную Redux, которая является сердцем решения для магазина.

Мы также собираемся подробно рассмотреть эффекты Ngrx, что также является фундаментальной частью архитектуры магазина. Мы расскажем о Ngrx Entity, который является практичным решением для хранения коллекций в хранилище.

Мы также покажем, как пошагово настроить Ngrx DevTools, включая модуль Router Store, и мы создадим хорошую часть нашего решения для хранилища, используя Ngrx Schematics и Angular CLI.

Пройдя этот курс, вы освоитесь с решением централизованного хранилища в целом и с реализацией этой конструкции в Angular Ngrx в частности.

Вы будете чувствовать себя комфортно, проектируя новые функции приложения, используя дизайн хранилища, используя простую методологию, и вы будете знать всестороннюю экосистему библиотеки Ngrx: включая библиотеки Ngrx Store, Effects и Entity.

Полный список уроков Развернуть / Свернуть
  • Урок 1. Angular NgRx Course Helicopter View 00:06:56
  • Урок 2. Environment Setup - Get the Lessons Code Up and Running 00:06:20
  • Урок 3. Why Ngrx? What Concrete Problems Does it Solve? 00:07:03
  • Урок 4. The Store Architecture in a Nutshell 00:07:09
  • Урок 5. Setting Up Ngrx Store with Ngrx Schematics 00:06:42
  • Урок 6. Exploring the Centralized Store Service API 00:04:08
  • Урок 7. Defining our First Ngrx Action using Ngrx Schematics 00:04:40
  • Урок 8. Dispatching an Action - Implementing the Login Component 00:07:09
  • Урок 9. Setting Up the Ngrx DevTools - Demo 00:04:44
  • Урок 10. Understanding Reducers - Writing Our First Reducer 00:09:10
  • Урок 11. How To Define the Store Initial State 00:04:31
  • Урок 12. Speed Up Reducer Development Using Ngrx Schematics 00:07:05
  • Урок 13. Implementing The Logout Action 00:04:04
  • Урок 14. How To Access and Use the NgRx Store Data 00:06:57
  • Урок 15. Understanding Ngrx Selectors - Step-by-Step Explanation 00:08:32
  • Урок 16. Implementing an Authentication Guard in an NgRx Application 00:09:20
  • Урок 17. What is an NgRx Effect? Scaffolding an Effect class using Schematics 00:04:59
  • Урок 18. NgRx Effects - Step-by-Step Implementation of the Login and Logout Effects 00:06:48
  • Урок 19. Keeping the User Logged In After Refresh - Initialization Effects 00:08:07
  • Урок 20. NgRx Store Freeze - Why make the Store State Immutable? 00:07:57
  • Урок 21. Setting up a Time Travelling Debugger with Ngrx Router Store 00:08:31
  • Урок 22. NgRx Entity - Section Kick Off 00:04:35
  • Урок 23. NgRx Feature Design - Defining the Actions First 00:06:23
  • Урок 24. What does the Store State of an Entity Collection look like? 00:04:22
  • Урок 25. Defining our First NgRx Entity Adapter 00:03:26
  • Урок 26. Implementing a Router Resolver using NgRx Store 00:07:10
  • Урок 27. Loading Data From the Backend using NgRx Effects 00:05:23
  • Урок 28. Implementing an NgRx Entity Reducer, NgRx Entity In Action (Demo) 00:08:08
  • Урок 29. Load All Courses - Action Design and Implementation 00:05:00
  • Урок 30. Courses List Component - Implementing the Store Solution 00:06:43
  • Урок 31. How to use NgRx Selectors - Components as Pure Projections of State 00:07:32
  • Урок 32. Loading a Collection of Entities using an Effect 00:02:50
  • Урок 33. NgRx Effects Conditional Data Loading 00:10:13
  • Урок 34. Learn one of the main benefits of the Store Architecture 00:09:31
  • Урок 35. NgRx Data Pagination - New Section Kickoff 00:03:42
  • Урок 36. Lessons Pagination Feature - NgRx Action Design 00:06:42
  • Урок 37. NgRx Entity Schematics, configuring the Lessons Entity 00:07:54
  • Урок 38. Design and Initial Implementation of the Lessons Pagination Solution 00:06:47
  • Урок 39. Implementing the Lessons Page Selector 00:05:45
  • Урок 40. NgRx Entity - Setting up an Entity Default Sort Order 00:03:32
  • Урок 41. Implementing the Lessons Data Source using the Store 00:05:39
  • Урок 42. Implementing the Load Lessons Page Effect 00:07:54
  • Урок 43. Implementing the Lessons Pagination Feature 00:05:58
  • Урок 44. Implementing a Loading Indicator - Design and Initial Implementation 00:05:19
  • Урок 45. Loading Indicator - Implementation Conclusion 00:02:55
  • Урок 46. Error Handling in NgRx Effects (the correct way) 00:08:52
  • Урок 47. Switching our application to OnPush Change Detection 00:04:43
  • Урок 48. Other Courses 00:02:18
  • Урок 49. Angular NgRx Course Conclusion 00:04:29
Этот курс находится в платной подписке!

И будет доступен в бесплатном просмотре 08.03.2019. Если у тебя еще нет у нас аккаунта - зарегистрируйся и оформи премиум подписку в своем личном кабинете, и смотри этот, а также многие другие курсы, прямо сейчас.

Следи за последними обновлениями и новостями в нашем coursehunter-club.net (Ex coursehunters.club), или вступай в наш канал telegram.

Комментарии

Похожие курсы

30-11--0001 en 41 урок
ultimateangular NGRX Store + Effects
Усовершенствуйте реактивное и высокопроизводительное управления Redux для Angular приложений. Вам нужны предсказуемые, поддерживаемые и быстрые приложения. Вы будете управлять действиями, редюсерами, структурами данных с объектами, Memoized Selectors, паттернами Redux, побочными эффектами, неизменностью до предварительной загрузки, состоянием маршрутизатора и тестированием. Все в реальном это в реальном приложении.
Duration 07:31:17
32 0
07-01-2019 en 24 урока
frontendmasters Reactive Angular with NgRx
Научитесь использовать Angular с NgRx и RxJs, чтобы существенно упростить управление состояниями и управление потоками при одновременном сокращении объема кода. Мы интегрируем NgRx в наше приложение и рассмотрим, как работать с Store, действиями, редукторами, селекторами, инструментами разработки и представим сущность NgRx, чтобы еще больше упростить процесс.
Duration 03:14:18
1 0
15-01-2017 ru 16 уроков
webformyself Angular 4 NgRx
В этом курсе мы будем рассматривать @ngrx/store - Redux в Angular 4. Сперва мы напишем приложения, которое реализуем обычным подходом Angular, и уже после, мы перепишем его c Redux используя ngrx. Мы поработаем также с reducers, actions, state используя соответствующие типы и интерфейсы. Мы добавим в наше приложение асинхронности и подключим к нему сервер с БД, где будет хранится состояние нашего приложения.
Duration 02:20:46
69 2
30-11--0001 en 87 уроков
udemy Angular ngrx store masterclass - cover Angular 4
В этом курсе мы собираемся изучить экосистему библиотеки Angular Ngrx, а именно все, что вращается вокруг библиотеки Ngrx Store и Ngrx Effects.
Курс охватывает Angular 4, и он состоит из пошагового создания чата.
В курсе будет поэтапно создаваться приложение чата, которое воспроизводит ситуацию, с которой столкнулась команда Facebook - счетчиком непрочитанных сообщений. Мы собираемся решить проблему не с помощью оригинального...
Duration 08:23:50
14 19

Последнее добавленное

Полный курс по программированию на Python для начинающих

Полный курс по программированию на Python для начинающих

en
Изучите Python для AI, машинного обучения, науки о данных и разработки приложений. Математики, ученые и инженеры любят Python. Почему? Потому что он делает сложные вычисления и повторяющиеся задачи действительно простыми для написания и выполнения. Разработчики любят его, потому что он простой...
Python для анализа данных

Python для анализа данных

ru
«Данные — это новая нефть». Они помогают усовершенствовать продукт, привлечь новых пользователей и являются драйвером роста любой компании. Компании во всем мире используют Python для сбора и анализа данных. В Uber, Yandex и Facebook, знание Python является обязательным требованием при приеме...
Flutter и Dart: полноценное мобильное приложение™

Flutter и Dart: полноценное мобильное приложение™

en
Изучение того, как создавать приложения для iOS и Android, с полным демонстрационным примером на основе Dart и Flutter Framework. Flutter - это SDK для мобильных приложений, предназначенный для создания высококачественных собственных интерфейсов на iOS и Android в рекордно короткие сроки. Flutter ра
Flutter: кроссплатформенное приложение iOS / Android

Flutter: кроссплатформенное приложение iOS / Android

en
Создавайте кроссплатформенные красивые нативные приложения в рекордно короткие сроки. Flutter - это SDK для мобильных приложений, в комплекте с фреймворком, виджетами и инструментами, который предоставляет разработчикам простой и продуктивный способ создания и развертывания красивых мобильных...
Программирование на Dart от новичка до эксперта

Программирование на Dart от новичка до эксперта

en
Изучите Dart с уровня Beginner и станьте экспертом, который может начать изучать Flutter, AngularDart и многое другое. В этом курсе вы узнаете все, что вам нужно знать о Dart. Dart - это язык, который становится популярным день ото дня, и разработчики по всему миру стремятся к этому языку...
Понятный JavaScript (Middle)

Понятный JavaScript (Middle)

ru
Хочешь стать JavaScript разработчиком, систематизировать знания и выйти на совершенно новый уровень! Курс «Понятный JavaScript» — это комплексная программа обучения, которая позволит тебе полностью изучить с нуля главный язык Frontend разработчика. Уже через 3 месяца ты будешь знать JavaScript...
chat
logo