Starter Template for Query API x Craft CMS

This template is a minimal starter for the Query API. It should help to get you started faster with headless development.

✅ Optimized images with ImagerX
✅ Multilingual with Craft multisites
✅ Home and News Section with demo content preconfigured

Select Example Branch

You can find frontend examples in the branches listed below. The code for the frontend is located in the ./frontend folder.

• examples/react-vite: React JS vite example using the @query-api/react SDK.
• examples/next: Next JS example using the @query-api/next SDK.
• examples/nuxt: Nuxt example using the @query-api/nuxt SDK.
• examples/vue: Vue example using the @query-api/vue SDK.

Note

If you don't check out a branch from above, the frontend folder will be empty.

Local Development

Requirements

• DDEV installed locally
• Node > 20 installed locally
• Basic Craft Knowledge

Setup

Paste this command in your terminal and press enter. This should set everything up for you.

./scripts/setup.sh

Note

You will find more instructions in the frontend/README.md.

Access the control panel:

Use these credentials to access the control panel:

• User: admin
• Password: admin123

Important Security Notes

If you use this as a starter for your own application, be sure to flip the access token! The access token used in that demo project is publicly available and not save at all.

Further Resources

• Craft Query API: Learn how to use the Craft Query API.
• React SDK: Learn how to use the @query-api/react SDK.
• Next SDK: Learn how to use the @query-api/next SDK.
• Nuxt SDK: Learn how to use the @query-api/nuxt SDK.
• Vue SDK: Learn how to use the @query-api/vue SDK.

Support

If you encounter bugs or have feature requests, please submit an issue. Your feedback helps improve the starter!