Angular random quote #3

This is the third project of my ongoing challenge, 100 angular projects.

In this project, I created a web page which fetches a random quote from an API endpoint and displays it on the page.

Screen Shot Muse

I have learned a few new concepts while creating this simple web application, such as

  • using services to separate fetching data from components
  • using observable and Angular HttpClient for fetching data asynchronously and providing a way for the data to be consumed from a component
  • calling child component’s function from parent component using @ViewChild

Service, Observable and HttpClient for asynchronous API call

Using service to get a random quote from a component

Calling child component’s function from the parent component

Live address: http://5b3705ca02ed8359970e2262.silly-perlman-68e0f4.netlify.com/

Git: https://github.com/zkkmin/muse

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s