Угловая структура папок / файлов для простого приложения (руководство по стилю)

Question

Я изучаю руководство по стилю angular, и у меня возникли некоторые сомнения при разработке простого приложения! Приложение предназначено для управления акциями пользователей на бирже. Так что нужно:

• модуль для аутентификации пользователя (вход, регистрация и сброс пароля)
• модуль с компонентом для отображения всех акций пользователя и еще один для добавления новых акций
• модуль для редактирования профиля пользователя

Модуль аутентификации будет иметь разную компоновку по сравнению с остальной частью приложения (аутентификация будет иметь только централизованную форму, тогда как у остальной части приложения будет навигационная панель в качестве меню).

Вопрос 1: Я создам компонент с именем Layout внутри модуля Auth и использую его только для просмотров аутентификации; Где я могу создать компонент или модуль Layout (я не знаю, какой именно) для использования с остальной частью приложения? Должен ли я создать модуль Core, а внутри этого модуля модуль Layout? Должен ли я создать основной модуль и модуль макета (вне ядра)?

Вопрос 2: где я должен создать охрану для аутентификации? Эта защита будет использоваться для модулей Stocks и Profile, чтобы избежать пользователей, которые не вошли в систему

Вопрос 3: как бы вы структурировали этот простой проект относительно папок и файлов?

Answer 1

В настоящее время я использую эту статью для организации структуры папок Angular. По сути, у нас есть три основные папки - основные, общие, просмотры.

• ядро: оно имеет CoreModule который предоставляет все общие приложения приложения. Импортируется только один раз в AppModule, В этой папке у меня есть подпапки services и guard, потому что они являются инъекционными (ответ на вопрос 2). охранники, которых я не предоставляю CoreModule, Я предоставляю их в модулях маршрутизации, т.е. AppRoutingModule,
• поделился: он имеет SharedModule который объявляет и экспортирует все общие компоненты приложения, каналы, перечисления, классы и директивы (все классы ожидают службы и средства защиты). SharedModule импортируется views модуль.
• views: он получает все модули views (обычно модули с отложенной загрузкой).

Структура (ответ на вопрос 3):

/app
|---/core
|   |---/guards
|   |---/services
|   |---core.module.ts
|
|---/shared
|   |---/components
|   |---/directives
|   ...
|   |---shared.module.ts
|
|---/views
|   |---/view-X
|       |---/components
|       |---/directives
|       |---view-X.component.html
|       |---view-X.component.css
|       |---view-X.component.spec.ts
|       |---view-X.component.ts
|       |---view-X.module.ts
|       |---view-X-routing.module.ts

В вашем случае может быть три вида папок / модулей: аутентификация, пользовательский сток и пользовательское редактирование. Каждый из них будет иметь структуру, аналогичную view-X Пример папки (ответ на вопрос 1).