This device is not compatible.

Build an E-book Reader in Angular With Gutendex API

PROJECT


Build an E-book Reader in Angular With Gutendex API

In this project, we’ll build an e-book reader in the Angular framework using Gutendex API.

Build an E-book Reader in Angular With Gutendex API

You will learn to:

Extract information from an external API.

Extract data from online text files.

Develop and implement pipes in Angular.

Implement text search functionality.

Skills

Web Development

Dependency Injection and Services

Web Frameworks

Prerequisites

Basic understanding of Angular framework

Basic understanding of dependency injection

Intermediate understanding of working with TypeScript

Technologies

Angular

Material UI

Project Description

In this project, we will build an e-book reader using the Gutendex API, a web API for Project Gutenberg e-book metadata. We will use the API to fetch and display the books metadata and the text.

This project will allow the readers to search and read the books they want. They will also be able to change the font size, and line spacing. Also, we will learn to do an optional line breaks toggle for continuous display. We’ll use features like dependency injection and Angular pipes to fetch and display the data from the API and to implement the search feature.

The final book display will be as follows:

Project Tasks

1

Getting Started

Task 0: Introduction

Task 1: Handle Component Routing

Task 2: Extract Data from the API

2

Develop Books Search and Grid UI

Task 3: Develop the Header

Task 4: Extract Books Data

Task 5: Add the Download Functionality

Task 6: Add the Books Grid with the Search Box

3

Develop the Book Reader

Task 7: Handle the Book Display and Text

Task 8: Implement a Font Size Change

Task 9: Develop the Line Spacing Change Logic

Task 10: Build the Book Reading UI

4

Develop Text Search Functionality

Task 11: Count the Total Matches

Task 12: Develop Text Highlight Functionality

Task 13: Integrate the Highlight Functionality

Task 14: Develop the Search Results Navigation Functionality

Task 15: Develop the Text Search UI

Congratulations!

has successfully completed the Guided ProjectBuild an E-book Reader in Angular With GutendexAPI

Relevant Courses

Use the following content to review prerequisites or explore specific concepts in detail.