In the previous section, you might have noticed the weird gql prefix before the GraphQL queries. This was no mistake.
That is actually called a tagged template literal. It is a feature of ECMAScript introduced with ES2015 and (of course) supported by TypeScript.
By now, you are used to template strings that allow us to embed expressions using ${...}. You have seen these on many occasions throughout this book.
Tagged template literals build upon template strings. They allow us to tag a template string with the name of a function. When a template string has been tagged, the tagged function will be executed and it will have a chance to parse/transform the expression.
The tagged function can actually transform the template literal into another string or anything else it fancies.
In the case of GraphQL, the gql function transforms the readable query into a properly formatted string that can be sent over to the GraphQL API over HTTP.
Check out these references: