Tweet
Tweet

Slide 1

Slide 1 text

Rainer Hahnekamp 14. October 2023 DevFest Vienna Modularity in TypeScript Applications

Slide 2

Slide 2 text

About Me... Professional NgRx https://www.youtube.com/ @RainerHahnekamp https://www.ng-news.com https://github.com/softarc-consulting/sheriff ● Rainer Hahnekamp ANGULARarchitects.io ● Developer / Trainer / Speaker Modern Spring for Angular

Slide 3

Slide 3 text

Agenda ● Frontend Architecture ● Sheriff in Theory ● Modularity in JavaScript/TypeScript ● Sheriff in Practice ● Q&A

Slide 4

Slide 4 text

Shared Forms Grid Error Handling Widgets Backend Middleware ... App Shell Domain (Holidays ) Domain (Customers) Domain (Bookings) Domain (Diary) Layer 1 - Domain modules

Slide 5

Slide 5 text

Domain Feature (Container Cmp.) Data UI (Presentational Cmp.) Domain Models Layer 2 Sub Modules

Slide 6

Slide 6 text

Modularity in JavaScript ● Native with ESM ● Third-Party Libraries ○ Nx ○ dependency-cruiser ○ madge ○ good-fences ○ eslint-plugin-boundaries

Slide 7

Slide 7 text

Sheriff: Modularity in TypeScript ● Module Encapsulation

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

Sheriff: Modularity in TypeScript ● Module Encapsulation ● Dependency Rules

Slide 13

Slide 13 text

No content

Slide 14

Slide 14 text

No content

Slide 15

Slide 15 text

Sheriff: Modularity in TypeScript ● Module Encapsulation ● Dependency Rules ● Lightweight

Slide 16

Slide 16 text

Sheriff: Modularity in TypeScript ● Module Encapsulation ● Dependency Rules ● Lightweight ● Convention over Configuration

Slide 17

Slide 17 text

Sheriff: Modularity in TypeScript ● Module Encapsulation ● Dependency Rules ● Lightweight ● Convention over Configuration ● Zero Dependencies

Slide 18

Slide 18 text

Sheriff: Modularity in TypeScript ● Module Encapsulation ● Dependency Rules ● Lightweight ● Convention over Configuration ● Zero Dependencies ● For all TypeScript Projects

Slide 19

Slide 19 text

Sheriff: Modularity in TypeScript ● Module Encapsulation ● Dependency Rules ● Lightweight ● Convention over Configuration ● Zero Dependencies ● For all TypeScript Projects ● (Heavily) Influenced by Nx

Slide 20

Slide 20 text

https://github.com/ softarc-consulting/sheriff

Slide 21

Slide 21 text

Thanks!!!

Slide 22

Slide 22 text

Contact Data @Rainer Hahnekamp https://www.youtube.com/@RainerHahnekamp https://www.youtube.com/@ng-news https://www.angulararchitects.io https://www.rainerhahnekamp.com https://github.com/softarc-consulting/sheriff