# ACTIVITY 7: Angular Basic Routing

**Step 1: I created a folder and install angular in folder.**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726998104345/ee386749-6e38-4861-8dec-420d099a4ee4.png align="center")

**Step 2: Create your components Homepage, Login, Signup, and Landing page component inside in components folder using terminal. code: ng generate component components/(name of components).**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726998217818/2492e177-c013-405c-b1ca-5b87eca05b6e.png align="center")

**Step 3 : Create a app.module TS inside of the app folder.**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726998351563/0ba1f890-6cca-4096-af97-0ffa172f46b0.png align="center")

n app.module create a route const to provide routing in components

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726998495479/191f4e6f-d20d-4059-8523-171d82d1decc.png align="center")

**Step 4: Create a Ngmodule for imports, declaration, providers, and bootstrap. Export class AppModule.**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726998723646/10363b89-4ef1-48e9-be37-8b58d72b7c0a.png align="center")

**Step 5: In app.component.html create a html code to provide the link of the components**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726998914336/a2706edc-b845-40c6-a4b2-da33b11bb838.png align="center")

**Output:**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726999008263/a5f41693-e168-41e2-8d93-8a2e0d3d1521.png align="center")

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726999051956/03c13083-5795-4e68-85cf-f461ba326cdc.png align="center")

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726999187828/2e0987d9-2030-4f0d-aab8-6a79d200a00a.png align="center")

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726999220581/45b566d9-4b52-4701-a459-cc3237d33941.png align="center")

Git Hub Repo : [https://github.com/ChristineMaitom/Angular-Basic-Routing](https://github.com/ChristineMaitom/Angular-Basic-Routing)