Skip to content

Instantly share code, notes, and snippets.

@isaacplmann
Last active April 22, 2024 03:36
Show Gist options
  • Star 31 You must be signed in to star a gist
  • Fork 7 You must be signed in to fork a gist
  • Save isaacplmann/0255c1f42ee6c1dad87586b1f6719023 to your computer and use it in GitHub Desktop.
Save isaacplmann/0255c1f42ee6c1dad87586b1f6719023 to your computer and use it in GitHub Desktop.
Advanced Angular Patterns

Advanced Component Patterns

Also, check out Advanced Angular Component Patterns on Egghead!

* Titles subject to change

React Angular
Introducing Advanced React Component Patterns 00 Introducing Advanced Angular Component Patterns (egghead)
Build a Toggle Component (source) 01 Build a Toggle Component (stackblitz) (egghead)
Write Compound Components (source) 02 Write Compound Components (stackblitz) (egghead)
Make Compound React Components Flexible (source) 02 Write Compound Components (stackblitz)
Make Enhanced React Components with Higher Order Components (source) 03a Communicate Between Components Using Dependency Injection (stackblitz) (egghead) (egghead)
03b Enhance Components with Directives (stackblitz) (egghead)
Handling Prop Namespace Clashes with Higher Order Components (source) 04 Avoid Namespace Clashes with Directives (stackblitz)
Improve Debuggability of Higher Order Components (source) N/A
Handle Ref Props with Higher Order Components (source) 05 Handle Template Reference Variables with Directives (stackblitz)
Improve Unit Testability of Higher Order Components (source) Testing Directives - see Thoughtram's article
Handle Statics Properly with Higher Order Components (source) N/A
Use Render Props with React (source) 06 Use <ng-template> (stackblitz) (egghead)
Use Prop Collections with Render Props (source) 07 Use Content Directives (egghead)
Use Prop Getters with Render Props (source) 08 Configure Content Directives (egghead)
Use Component State Initializers (source) 09 Use State Initializers
Make Controlled React Components with Control Props (source) 10 Use Control Inputs
Implement a React Context Provider (source) 11 Compound Components with Services
Implement a Higher Order Component with Render Props (source) N/A
Re-render Descendants Through shouldComponentUpdateFinish (source) 12 Re-render Descendants Through ChangeDetectorRef
Use Redux with Render Props (source) 13 Use Ngrx with Directives

Notes on Advanced React Component Patterns

@prasajaga
Copy link

so awesome thank you for providing this

@ravitejabommakanti
Copy link

This is so helpful, thanks for sharing this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment