{"id":17056262,"url":"https://github.com/biophoton/reactive-architecture-and-ux-patterns_angular","last_synced_at":"2025-06-29T11:37:19.707Z","repository":{"id":77494384,"uuid":"262111388","full_name":"BioPhoton/Reactive-Architecture-and-UX-Patterns_Angular","owner":"BioPhoton","description":"Reactive Architecture and UX Patterns for Angular and RxJS","archived":false,"fork":false,"pushed_at":"2020-08-20T17:01:08.000Z","size":3117,"stargazers_count":14,"open_issues_count":0,"forks_count":6,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-06-06T06:38:20.641Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/BioPhoton.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2020-05-07T17:09:14.000Z","updated_at":"2024-05-13T16:27:38.000Z","dependencies_parsed_at":null,"dependency_job_id":"2624ea9d-ae5c-47bb-83e0-5b7bc516bd3a","html_url":"https://github.com/BioPhoton/Reactive-Architecture-and-UX-Patterns_Angular","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/BioPhoton/Reactive-Architecture-and-UX-Patterns_Angular","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BioPhoton%2FReactive-Architecture-and-UX-Patterns_Angular","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BioPhoton%2FReactive-Architecture-and-UX-Patterns_Angular/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BioPhoton%2FReactive-Architecture-and-UX-Patterns_Angular/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BioPhoton%2FReactive-Architecture-and-UX-Patterns_Angular/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BioPhoton","download_url":"https://codeload.github.com/BioPhoton/Reactive-Architecture-and-UX-Patterns_Angular/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BioPhoton%2FReactive-Architecture-and-UX-Patterns_Angular/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262588472,"owners_count":23333179,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-14T10:23:50.395Z","updated_at":"2025-06-29T11:37:19.688Z","avatar_url":"https://github.com/BioPhoton.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003c!-- Course Image --\u003e\n![](docs/assets/images/Reactive-architecture-and-ux-patterns_angular_michael-hladky.png)\n\n\u003c!-- Course Title --\u003e\n# Reactive Architecture and UX Patterns\n\n\u003c!-- Course Tagline --\u003e\n#### Getting the tools and understanding to craft fully reactive angular applications!\n\n\u003c!-- Course Description --\u003e\n\n\u003c!-- Course Description Intro Images --\u003e\n![](docs/assets/images/Reactive-architecture-and-ux-patterns_secondary_angular_michael-hladky.png)\n\n\u003c!-- Course Description Text --\u003e\n\n## Overview\n\nWelcome to my course! My name is Michael and I will lead you through this content.\n\nThe title of this course is reactive architecture and UX patterns.\nAs those are pretty broad terms let be elaborate a bit on the scope and target audience.\n\n\n## Level of this Course\n\n\nFirst the level. For this course, you definitely need some fundamental knowledge about RxJS,\n and you should use it regularly in your Angular projects.\nGeneral terms like subscription handling, multi-casting, or hot/cold Observables should at least ring a little bell.\n\nIf this is not the case no big deal. As this, in an online course, you can consume it as fast or slow as you like.\nIt's all about fun and explores new things, so the most important to enjoy it! :)\n\n\n## Content and Learning Goals\n\nThis course starts with the fundamentals of the different operator groups we will use,\nand points out some interesting details.\n\nWith that in mind, we will start to work on our first patterns.\n\nExercises we will master are:\n- Combining streams\n  - Overview of combination the operators\n  - Deriving state from HTTP calls\n  - Prevent over fetching with simple Http Caching\n  - Editing and user-controlled  opt-In updates\n  - Optimize View updates and  Performance\n  - Comparison of the combination patterns\n- Reactive State-Management    \n  - State aggregation\n  - Model vs ViewModel\n  - Sharing state and instances\n  - Lazyness and component initialization\n  - Immutability and gotchas in operators\n- Higher-Order Operators\n  - Overview of the different flattening operators\n  - Avoid race-conditions and over-fetching in UIs\n  - HTTP optimization strategies \n- Resilience and Error-Handling\n  - Error handling operators overview\n  - How to encapsulate error-prone code\n  - Load balancing  and polling\n  - Offline friendly and exponential backoff\n  - Comparison of the different retry \u0026 repeat mechanisms\n- Reactive Template Rendering and Performance Optimisations\n  - Angular Change Detection in-depth\n  - The principle of Locallity in Angular Components\n  - Template Helpers of Rendering\n  - Analizing and Fixing Blocking UI\n  - Zone-Less Change Detection\n\nLet’s jump right in and start with the first section.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbiophoton%2Freactive-architecture-and-ux-patterns_angular","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbiophoton%2Freactive-architecture-and-ux-patterns_angular","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbiophoton%2Freactive-architecture-and-ux-patterns_angular/lists"}