Web component for Cradle CMS fetching article data in JSON format.
Add the file article.liquid to the components folder.
Add a article template article.json.liquid in folder templates for JSON output with the following content:
{% layout 'none' %}
{{ article | json | unescape }}
Include the component code to the site with tag {% component 'article' %}.
A good practise to dcrease the payload and utilize the browser cache is to include all the components to the same js-file in assets folder and include in the theme with {{ 'components.js.liquid' | asset_url | script_tag }} but please note that one should remove the script tags in the js-component file article.liquid.
Use the component at the desired place by including <blog-article> as html tag and the url article containing the articles slug.
<blog-article url="{{ '<article handle with articles slug>' | url }}"></blog-article>
The URL contains the articles slug as it adds the article-context to the handle.