1. Auto generate anchor links in Contentful & documentToHtmlString

    Posted 2 years ago

    For this very blog I sometimes want to do internal linking. A common practice for my writing is to have a heading that marks the beginning of a relevant section. Rather than managing the anchor links by hand, I used the `documentToHtmlString` method (provided by Contentful to convert the document structure to HTML structure) to do it for me and generate predictable anchors.

  2. Using reference based linking from Contentful

    Posted 2 years ago

    With some nicely formatted content, the blog becomes readable, so let's improve the internal linking system by investigating the Tags in relation to Articles. This will allow users to navigate and group articles based on a common tag.

    Requirement for this step is to have multiple articles added, where some have a common tag.

  3. Marking up the Contentful contents

    Posted 2 years ago

    Now that we have some content exposed, it might have occurred that it's not really anything useful for a visitor. We're getting a JSON shape from the Contentful API, so let's make turn that into HTML markup using the tools that Contentful provides.

  4. Add the articles from Contentful to Nuxt3

    Posted 2 years ago

    What makes a website a blog? Articles of course! In the last step we already did a lot of legwork to grab contents and show it on the page, so this is just a repetition of what we already were doing, should be straight forward then!

  5. Dynamic slugs to pages

    Posted 2 years ago

    In previous parts we've already established a connection to Contentful, but it's a static setup. In this step we'll be mapping a route to a page, which allows for more creativity and less manual maintenance.

  6. Connecting Nuxt 3 to the Contentful blog

    Posted 2 years ago

    So far we have two unconnected systems. So in this post, we're going to connect them to read from the Pages, Articles and Tags. We're first just going to add all of the utilities and helpers that we'll need. We're going to create a Nuxt plugin and some composables.

  7. Setup Contentful for a simple Blog

    Posted 2 years ago

    In this tutorial, we'll set up Contentful for the basics of a simple blog. This will not cover more advanced setups, like multi language support or specific types of content. You should be able to use this as a springboard to build to your own specific needs.