# Angular Library Grid

**book.service.ts**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1732815270270/b5e930f9-c34e-4f91-8980-25646538d5fc.png align="center")

**book.model.ts**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1732815339483/d48ff85d-ca67-4748-902a-3ef7ed243428.png align="center")

**book.component.ts**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1732815441594/3d767f80-68be-4bf1-8887-3d1db291d40e.png align="center")

**book.component.html**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1732815476221/f5f79c68-c795-4546-a8b8-b668f4f8cc6a.png align="center")

### **OUTPUT:**

**Mobile view**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1732815628284/9732473c-3fd3-48ed-93e1-168ed17c7044.png align="center")

**Tablet view**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1732815696973/1801f2ce-fb86-4ecc-b722-2c79e94bfcbd.png align="center")

**Desktop view**

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1732815759362/ad240904-1824-464d-892e-10ddb7d5bfde.png align="center")

Github Link:[https://github.com/itsmekent/library-grid](https://github.com/itsmekent/library-grid)