Angular Routing Module Setup

This challenge focuses on the foundational step of setting up routing in an Angular application. You will create a dedicated routing module to manage your application's navigation, which is crucial for building single-page applications (SPAs) that allow users to move between different views without full page reloads.

Problem Description

Your task is to create a separate Angular module specifically for handling application routing. This module will define the available routes and associate them with corresponding Angular components.

What needs to be achieved:

1. Create a new Angular module named AppRoutingModule.
2. This module should import RouterModule and Routes from @angular/router.
3. Define an array of Routes that maps URL paths to specific components.
4. Configure this Routes array using RouterModule.forRoot().
5. Export AppRoutingModule so it can be imported by the root AppModule.

Key Requirements:

• The routing module must be a standalone module.
• It must correctly configure the routes for at least two distinct components (you'll need to assume or create placeholder components for this exercise).
• The RouterModule.forRoot() method should be used to set up the router, as this is typically done in the root routing module.

Expected Behavior: When the AppRoutingModule is imported into AppModule, Angular's routing system should be initialized and ready to handle navigation based on the defined routes.

Edge Cases to Consider:

• Default Route: Consider how to handle the root path (/).
• Wildcard Route: Implementing a "Not Found" route for any undefined paths is good practice.

Examples

Example 1:

Input:
- Create a routing module named 'AppRoutingModule'.
- Define routes for a 'HomeComponent' and a 'AboutComponent'.
- Set the default route to 'HomeComponent'.
- Implement a wildcard route for 'NotFoundComponent'.

Output:
(Conceptual - this isn't a direct input/output, but the resulting structure)
- An 'app-routing.module.ts' file will be created.
- This file will contain the AppRoutingModule class.
- The module will export the configured router.

Explanation:
The goal is to structure the application's navigation logic into a dedicated module, making the main AppModule cleaner and the routing configuration more organized.

Constraints

• The routing module must be named AppRoutingModule.
• The solution must be written in TypeScript.
• You should assume that HomeComponent, AboutComponent, and NotFoundComponent already exist or can be created as simple placeholder components.

Notes

• Remember to import RouterModule and Routes from @angular/router.
• The RouterModule.forRoot() method is crucial for setting up the main router configuration.
• For a more complex application, you might use RouterModule.forChild() in feature modules, but for this root module, forRoot() is appropriate.
• Think about how you would typically import this AppRoutingModule into your main AppModule.