Content & CMS
GROQ
GROQ — the query language that fetches exactly the content a page needs.
GROQ (Graph-Relational Object Queries) is Sanity's query language — think SQL for structured content. A page describes the exact shape of data it wants, joins related documents and projects only the fields it renders, all resolved server-side in the Content Lake.
- 01Precise fetching: a page requests the fields it renders, not whole documents, so payloads stay small.
- 02Joins, filters and projections run in the Content Lake, not in client code.
- 03Queries live alongside the components they feed, so content needs are visible in code review.
- 04Typed end-to-end: GROQ queries generate TypeScript types, catching content-shape bugs before they ship.
- 05One query language across web, mobile and any future channel reading the same content.
GROQ is the query language that makes structured content useful. It is the delivery layer of Sanity, and Karve uses it on every headless build so a page asks for precisely the data it renders — nothing more. For Dubai and UAE businesses running large, content-heavy sites, that precision is the difference between a page that loads instantly and one that ships kilobytes the visitor never sees.
Why we build with GROQ
Traditional CMS APIs hand you a whole document and leave the shaping to the browser. GROQ flips that: the query describes the exact result shape, joins referenced documents and projects only the fields in play. In our web development work, that keeps payloads small, markup clean and the content logic readable right next to the component it feeds.
Fetch exactly what a page renders
Projection is the heart of GROQ. A single query can pull a hero, its image, a list of related case studies and the localised SEO fields in one request — then return them in the precise shape the component expects.
- Filters and joins resolve server-side, so related content arrives without client-side waterfalls
- Coalesce-based language fallbacks pick the active locale from internationalised arrays, English to Arabic
- Query results are CDN-cached and can be delivered live, so editors see changes the moment they save
- Queries generate TypeScript types, so the data contract is checked at build time
GROQ in a typed, modern stack
We pair GROQ with Next.js so queries run server-side during rendering and the page ships fully formed, with clean markup and per-field metadata. The generated types mean a renamed field surfaces as a compile error, not a blank section in production.
Proven in production
This site runs on GROQ, and so does client work like the SAAS Properties build. If you want the bigger picture on how a headless, query-driven approach helps search visibility, read our piece on headless CMS and SEO.
What it does
Precise field projection
Each page declares the exact fields it renders, so responses stay lean and markup stays clean — no over-fetching, no shaping data in the browser.
Server-side joins and filters
References, filters and projections resolve in the Content Lake, so related content arrives in a single request instead of a waterfall of round-trips.
Typed queries end-to-end
We generate TypeScript types straight from GROQ, so a renamed field or a wrong shape is caught at build time rather than in production.
Locale-aware delivery
GROQ resolves the active language from internationalised arrays with an English fallback, so one query serves both English and Arabic for GCC sites.
Performance by default
Smaller payloads and CDN-cached query results mean faster first loads and better Core Web Vitals across large, content-heavy sites.
About GROQ
When does GROQ matter for my project?
GROQ comes into play any time content lives in Sanity and a frontend needs to read it — which on our builds is every page. You rarely choose GROQ in isolation; it ships with the headless CMS. It matters most on large, content-heavy or multilingual sites, where fetching only the fields a page renders keeps loads fast and code maintainable.
Does using GROQ add cost or time to a build?
GROQ is open-source and built into Sanity, so it adds no licence cost of its own. It is part of how we deliver our web development service, not a separate line item. If anything it saves time later: precise queries and generated types mean fewer data bugs and less rework as the site grows.
How is GROQ different from SQL or GraphQL?
GROQ is purpose-built for document content rather than relational tables, so it handles deep references, arrays and Portable Text naturally. Compared with GraphQL, it needs no pre-defined schema of queries — you shape any result on the fly, which suits an evolving content model. Sanity does also expose a GraphQL API if a project specifically requires it, and we will use whichever fits your stack best.
Can GROQ feed more than just a website?
Yes. Because GROQ reads from a central Content Lake over an HTTP API, the same content can power a website, a mobile app, a digital screen or a third-party integration — each querying for exactly the fields it needs. Author once, deliver everywhere, with no duplicate content systems to keep in sync.
How does GROQ handle Arabic and English content?
We store English and Arabic on the same document using internationalised arrays, then resolve the active language inside the query with a coalesce fallback to English. One GROQ query therefore serves both locales for a GCC site, with right-to-left rendering driven by the URL — no duplicate documents and no drift between language versions.
Who maintains GROQ queries after launch?
We do. Queries live in the codebase next to the components they feed and are covered by generated types, so changes are safe to make and easy to review. Karve offers ongoing support and technology consulting to extend or optimise your queries as the content model grows, and your own developers can pick them up readily because GROQ is well documented and easy to learn.
Where GROQ fits
Web Development in Dubai
Web development in Dubai built on Next.js, Sanity and Laravel — fast, SEO-optimised, mobile-first websites and headless ecommerce engineered to convert across the UAE.
The service