Now that we can add a new entry to the developers' collection, let's show a list of all the developers on the front page of the "Coders repository".

Open the file ch6/ts/step-1/home.ts (or step-2, depending on your progress during the past section), and enter the following content:

import {Component} from '@angular/core'; 
import {DeveloperCollection} from './developer_collection'; 
 
@Component({ 
  selector: 'home', 
  templateUrl: './home.html' 
}) 
export class Home { 
  constructor(private developers: DeveloperCollection) {}
 
  getDevelopers() { 
    return this.developers.getAll(); 
  } 
} 

There is nothing new to us here. We extend the functionality of the Home component by providing an external template and implementing the getDevelopers method, which delegates its call to the instance of DeveloperCollection that is injected in the constructor.

The template itself is something that we...