Angular アプリケーションのシンプルなアーキテクチャ

アトミックデザインの紹介

共有モジュールの中身がひと目でわかりますか? また、別のファイルを開かずに、どのコンポーネントに他のコンポーネントへの依存関係やバインディングがあるかを教えてください。あなたの答えが何であれ、私と一緒にお茶かコーヒーを淹れて、ブラッド・フロストの原子設計理論の基礎理解することをお勧めします





Angular

 





Angular のアトミック デザインのディレクトリ構造
Angular

, Angular « — » ( «  — »). , , .





«»  — . .





 — «»





, . (@Input) - (@Output). , .





  •  — , . HTML- .





  •  — .





 — «»





HTML-, «» , TypeScript.





, , , .





, , . «» , . , . «» TypeScript HTML-CSS. , . , - .





«», . , , .





 . HTML-CSS ng-content



.





( ), HTML-. , .





:





スタイリングと一緒に共通のラッパー コードをグループ化し、ロジックを持たないテンプレート コンポーネント。
-, .

 





テンプレート コンポーネントに基づくページまたはスマート コンポーネント。 スタイルはありませんが、ロジックを駆動します。
«» -. , .

, Angular Material, . , router-outlet



. , «/» .





, .   .





, , . . .





«» «» ? . /. , -, .





 — «»

core/features/shared (  /  / ). «» /, .






"JavaScript Developer. Professional".



"Async Patterns JavaScript". JavaScript, , map, reduce . !








All Articles