Provide an example wknd tutorial with Nuxt/Vue

[colinscz]

Feature Request

• Please provide a headless Example with Nuxt https://nuxt.com/ and/or Vue.js https://vuejs.org/

Expected Behavior

• It should work the same way as the already existing Next.js/React.js examples, just to give an idea for people developing frontends with Vue/Nuxt-based applications that need to integrate with AEM Headless.

Actual Behavior

• Currently there are tutorials for Next.js, React, Android, Webcomponents etc. but none for Nuxt/Vue.

Open points

• It's unclear if an integration with the provided libraries and AEM headless is feasible and possible with those technologies (Vue/Nuxt).

[davidjgonzalez]

Can you check out the vue sample here? https://experienceleague.adobe.com/landing/experience-manager/headless/developer/code.html?lang=en

[colinscz]

@davidjgonzalez thank you for the link, I was not aware of those playgrounds. The vue example is already interesting.

Do you also have an example in work for a Nuxt app. Similar to the Next.js starter app?
There are two Nuxt GraphQL modules that might be of help for that.

https://github.com/tobiasdiez/nuxt-graphql-server
https://github.com/diizzayy/nuxt-graphql-client

[davidjgonzalez]

Unfortunately no - everything we have is listed.

[colinscz]

@davidjgonzalez is there a way to provide and test one from outside over a contribution that could run alongside the ones you listed?

[davidjgonzalez]

keep in mind AEM doesn't use POST based GQL like most clients/frameworks - AEM has its own abstraction of persisted queries (which is a HTTP GET to an endpoint that gets you a GQL like response) - this is a long way of saying, im skeptical Nuxt Graphql libraries would be useful for interaction w AEM.

[davidjgonzalez]

Absolutely! Link to a GitHub repo that has one you have the rights to contribute and we'll work on getting it moved over/posted to code playgrounds section!! That would be fantastic! 🙇

[colinscz]

@davidjgonzalez unfortunately I don't have a private instance, just one in the office that I could try against.
Is there a way to export the AEM model you guys used for the adventure setup?
Then I could import in our instance and test it against that or a free private tier where I could prepare this example project?

I would suggest to use the same as base and maybe add also a request with multiple parameters. Since there is a bug when you send multiple parameters with the headless packages. Even though the docs suggest it's supported the headless packages don't.

See: adobe/aem-headless-client-js#61