Showing posts from 2018

GraphQL Express: Queries on child items.

Full disclosure this blog is me learning in public. Maybe this is obvious to you, maybe there is a better way to do this, if so let me know. In the end it caught me out so I thought I'd write down what my solution ended up being.

The problem: In the GraphQL documentation the servers are always shown returning simple hello world style results. I wanted to be able to find all the items associated with a user ID and then all items that match certain criteria within that set. The project that I have been using to learn GraphQL is an implementation of the Tech Radar idea that was popularised by ThoughtWorks. In this the client can select a radar and potentially a subset of the items on the radar, say they only want to display a single section.

In the GraphQL Express examples it shows how to grab top level items, filtering these is easy. You can grab all the data from your data source and pass it through a filter function and return it. Simple. It looks something like this:

1 2 3 4 5 6 7…

GraphQL query for list of items

I'm starting to look into GraphQL. It's got a lot of hype at the moment and there is more and more pressure to start playing with it in production applications.

It's got a bunch of advantages and a quick play shows me that it's not just hype. There is plenty of information available on why you would want to use it, if you're looking for that kind of thing I'd suggest starting with

One limitation that I have come across when I was looking to implement a small application with some colleagues was that there doesn't seem to be a way to query for a known list of items without making the server support it. I'll use GitHub's GraphQL API as an example.

Lets say I have a curated list of repositories that I would like to query for as far as I can see there is no way to enumerate over that list within the GraphQL syntax. It is simple enough to get a list of repositories for a given user but I haven't been able to work out (yet?) how …

Logout from Auth0 SPA

I have been working through some Auth0 tutorials lately to get an understanding of how to implement it in production.

One thing that is missing in the Auth0 SPA basic tutorial is how to log the user out. I got a bit panicked when I first used it and didn't see the login screen after logging out.  It's not enough to simply clear the tokens from the local cache you need to call logout on the Auth0 Client.

This is all pretty simple once you know it needs to happen.

1. Update the code in the log out method to call logout with the desired return value:

1: logout() { 2: // Clear Access Token and ID Token from local storage 3: localStorage.removeItem("access_token"); 4: localStorage.removeItem("id_token"); 5: localStorage.removeItem("expires_at"); 6: // You don't need navigate to the home route anymore 7: // Auth0 will redirect you 8: // history.replace("/home"); 9: // Call logout with white listed ret…

Reflections on speaking to an empty room.

I gave a talk on agile at DDD Sydney to a, nearly, empty room. It seemed a long fall from the standing room only session I gave on Postman just a year before. I was pretty disappointed by the turnout and I think I let my presentation suffer as a result. I've been giving some thought as to why the talk would get so few attendees. I think the key issues were the topic and the presenter.

Agile is a topic that I expect most people feel that they know enough about and my talk was a very high level overview. I can see how it wouldn't attract the attention of the more experienced developers. The talk was originally proposed for the junior track but it was positioned on the general developer track. Looking at what was on the Junior track this makes sense. The junior track had some great talks from more junior developers than myself. In regards to turnout it means that much of the intended audience was in a different room. There is probably a large overlap with the junior track attende…

Adding text fo a file input using CSS Grid

I've been playing with CSS grid, listening to some podcasts and running through a few courses/tutorials.

One of the things that struck me as really useful is the ability to overlay elements on top of each other without using absolute positioning. I seee that this could be particularly useful when you want to have styled content display as part of a file upload process. Using CSS Grid you can have CSS stylable text visible and user selectable text that when clicked on opens a file dialogue.

As you can see in the below CodePen I've simply made a div with a 1:1 grid to act as the container. Into this container I have placed a div with my desired text followed by a input element of type file.
I've then styled these two elements to place them both in the first column of the first row.
This places the second element over the first (the input over the div).
I've then set the opacity on the input to 0 so all the user sees in the div.

See the Pen Text on a file upload using CSS…

Bush Mechanic Headphones

My Razor Kraken headphones broke. Devastating.

One of the arms was broken through and I wasn't ready to let them go.

So in the great Australian tradition of a trip to Bunnings can solve everything, I ran down the road grabbed some things and bush mechanic-ed them back to health.

I reinforced the broken arm with some flat steel I super glued over the break to hold it together while I added a larger reinforcement to the outside of the arm.  I attached these with clamps made from aluminium bar.

Now they're back in working order.  Happy days.