What is an API? An application programming interface acts as an intermediary between your application and the API’s server. You request information from the server and it gives you information that you requested. When you get the data that you need, you can build a front-end design to display the information in a readable format.
Find An API
You can use websites like Programmable Web, RapidAPI or API List. While you are evaluating APIs to use, consider whether or not you want to pay to use it. You can find free APIs for your projects.
Farmsense API
I found a free API on ProgrammableWeb called Farmsense. Farmsense provides three APIs to farmers: Day Lengths, Frost Dates and Moon Phases. I used the Moon Phases API to display the current phase of the moon.
Farmsense API uses the date to tell you what phase the moon is in, what percentage of full it is, how long the day is and more.
When I reviewed the AstroWidget, it shows way more information than I want. I wanted to display the current phase of the moon using HTML, JavaScript and CSS. First, I sketched out a design so that I would know what I wanted to build. Then, I read the API’s documentation. Farmsense API doesn’t require an API key. It does requires the current date.
I used JavaScript to get the current date and choose Milwaukee, WI as the location. Farmsense requires your location in longitude and latitude. To simplify, I decided to use one location.
Getting the Data From the API
How do you get data from the API? It returns the data in JSON. Instead of using the Astro-Widget’s method of retrieving the data, I used the JavaScript Fetch API to get it. The Fetch API made it simple and easy to retrieve the data and put it spots I wanted it.
The API doesn’t include images of the moon in each phase. I found icons of Moon Phases on Icons8. Then, I wrote a JavaScript function to determine the moon phase and displayed an icon image that closely matches the phase.
APIs let you work with data to create something more interesting. With HTML, CSS and JavaScript, you can create a simple user interface that retrieves data from an API. No database required for you to maintain. You can get start learning how to work with an API quickly. Have you built something fun with an API?