The primary feature of 7 Minute Workout is to execute a predefined set of exercises. Hence we are going to create a feature module now and later add the feature implementation to this module. We call this module workout-runner. Let's initialize the feature with Angular CLI's scaffolding capabilities.
From the command line, navigate to the trainer/src/app folder and run the following:
ng generate module workout-runner --module app.module.ts
Follow the console logs to know what files are generated. The command essentially:
- Creates a new Angular WorkoutRunnerModule module inside a new workout-runner folder
- Imports the newly created module into the main application module app (app.module.ts)
We now have a new feature module.
Give every feature its own module.
Open the newly generated module definition (workout-runner.module.ts) and look at the generated content. WorkoutRunnerModule imports CommonModule, a module with common Angular directives such as ngIf and ngFor, allowing us to use these common directives across any component/directive defined in WorkoutRunnerModule.
Modules are Angular's way of organizing code. We will touch upon Angular modules shortly.
Copy the model.ts file from http://bit.ly/ng6be-2-1-model-ts into the workout-runner folder. Shortly, we will see how these model classes are utilized.
Since we have started with a preconfigured Angular app, we just need to understand how the app starts.