Demo Application
Look at how to integrate the NASA APIs in a React application.
We'll cover the following
Now that we understand NASA APIs, we can use these APIs in an example application. We'll use the following NASA APIs in our application:
Asteroids NeoWs
EONET
Mars Rover Photos
APOD
Application workflow
Let's look at the application workflow from the user's perspective:
At the start of the application, we see the homepage. This page has the Astronomy Picture of the Day and a navbar that we can use to navigate to other pages.
The events page presents a table containing all the available events categories. The last column provides a link to see information about all the ongoing events for that specific category.
On the asteroids page, we get information about the asteroids closest to Earth today in tabular form.
The Mars rover photos page provides images captured by the rovers. By default, it shows images captured by the NAVCAM of the Spirit rover. We can look at the images captured by other cameras and rovers by selecting other rovers and cameras from the drop-down lists on this page.
Demo application
The widget below contains the code for our application. Click the "Run" button to run the application.
Get hands-on with 1400+ tech skills courses.