Tag: API

Playing with COVID-19 data: D3.js Bar Charts

Leave a comment

Last week, we gathered COVID-19 statistical data.  This week, we are going to try to build some charts using D3.js.  D3.js is a javascript library that allows you to generate some fairly fancy charts and graphs but we are going to start with some basic bar charts.  Let’s take a look at a simple example. …

Continue reading "Playing with COVID-19 data: D3.js Bar Charts" →

Did you know that you can use Google Sheets as a JSON API?

Leave a comment

You don’t necessarily need to write server-side code for everything.  Sometime there is a much easier solution.  Did you know that you can use Google Sheets as an API endpoint?  Let’s take a look at a quick example. For a few years now, I have been archiving my tweets as Google Sheets documents.  There is …

Continue reading "Did you know that you can use Google Sheets as a JSON API?" →

Playing with the OpenWeather API: The basics

Leave a comment

Ever since Apple bought and shut down Dark Sky, I have been struggling to figure out what to replace it with.  I figured that this would be a good excuse to play with some weather APIs.  I have done this once before but that was with Rivets and YQL (neither of which I can necessarily …

Continue reading "Playing with the OpenWeather API: The basics" →

I created a new website

Leave a comment

I haven’t had a lot at jws.app since registering the domain so, I spent a bit of time over the past few weekends and finally built a website there.  The idea was that it pulls recent activity from travels.jws.app, photos.jws.app, blog.jws.app, github, and DEV and auto-updates the website based upon those feeds.  I wanted to …

Continue reading "I created a new website" →

How to get the user’s street address, using navigator.geolocation and MapQuest

Leave a comment

Let’s say that you have a webform where you are collecting a user’s street address.  You can save the user a few minutes by defaulting the value for them.  In this example, we are using Vue.js, Axios, a MapQuest API, and navigator.geolocation to first get the latitude and longitude from the client and then send it off to MapQuest to get a physical address.

See the Pen
HTML5 Geolocation (how to get a street address) by Joe Steinbring (@steinbring)
on CodePen.

This example builds off of our earlier Axios / Vue.js 2 APIs 101 post. But you will notice that there is a methods property, now. The this.geolocation() function is then kicked off within mounted().

Have a question or comment? Drop it in the comments and I will try to help.

Axios / Vue 2 101

Axios / Vue.js 2 APIs 101

Leave a comment

If you have a WordPress-based website like this one, you might eventually want to try to make use of its APIs.  Using Axios and Vue.js, it is pretty easy to do.  At the time of writing this, Vue.js 3 exists but I am going to use Vue.js 2 anyways.

There are two API endpoints that we care about for the purposes of this demo:  https://blog.jws.app/wp-json/ and https://blog.jws.app/wp-json/wp/v2/posts.  The first one will get us all of the basic information from the blog (such as the title and the description).  The second API endpoint will get us a listing of blog posts.

See the Pen
Axios / Vue.js 2 APIs v1 by Joe Steinbring (@steinbring)
on CodePen.

There are two variables defined within data(): info and posts. Thanks to the way Vue works, you can reference {{info.home}}, {{info.name}}, and {{info.description}} before Axios has even finished getting the values from https://blog.jws.app/wp-json/.

Have a suggestion on how to better this example?  Feel free fork the pen and drop a link, below.