# ACTIVITY 7: Angular Basic Routing

I created a folder and install angular in folder.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726584895545/ba8ce288-8959-4f1f-842f-93948bcb921a.png align="center")

Created 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/v1726584955411/6970fa22-970d-4dd9-94bd-52f6227a1c4c.png align="center")

Create a app.module.ts inside of the app folder.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726585012415/9a7048e2-9109-4ec1-80ac-e6c374d1a6e6.png align="center")

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

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726585150929/b2ed62f1-cafa-4a51-a309-7b22881b28f7.png align="center")

Create a Ngmodule for imports, declaration, providers, and bootstrap. Export class AppModule.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726585192214/7d5ec9a8-2c38-4168-97b5-f90377941516.png align="center")

In app.component.html create a html code to provide the link of the components

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726585229055/0a6b4633-31a9-4cbb-8079-2dceeb380c7e.png align="center")

Output:

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1726586767553/3dc7d70c-c0bb-4659-8f9e-b4e9dc0d50e6.gif align="center")

[https://github.com/RodelCalda/Basic-Angular-Routes.git](https://github.com/RodelCalda/Basic-Angular-Routes.git)