Quicklist is a compact Angular app from June 2021. It shows a list of artists, filters the list live as you type, and opens a details view for any item. I built it to learn Angular’s way of doing things after working mostly in React and server-rendered templates.

What it does

  • A search box bound to the list through a custom searchArtists pipe, so filtering is declarative in the template rather than imperative in the component.
  • Two routes: the list and a details page per artist, wired through the Angular router.
  • Bootstrap styling through ng-bootstrap.
  • Unit test scaffolding with Karma and Jasmine, including a spec for the pipe.

What I learned

Pipes are the piece of Angular I liked most. Putting the filter in a pure pipe kept the component free of filtering logic and made it trivially testable. The rest, modules, dependency injection, decorators, was a useful contrast with React’s lighter structure and made me better at reading Angular codebases later.

Source in the repository.