Arms crossed picture of James Auble
prismic.io and nuxt.js logos together

A Review of Prismic Using Nuxt.JS

Published

So let's get this out of the way first--this blog's content you're reading right now uses Prismic--so I can assure you there are at least a few reasons to try it. In this post I'll go over some successes and pain points I've encountered while migrating this blog to Prismic, and stories of building a demo blog with Prismic and Nuxt.

The Use Cases 

  1. This Blog. In the past I had hosted my blog on Medium and had fetched my articles to display them here. I decided to give Prismic a shot and GraphQL to fetch and generate my posts from Prismic using Gridsome which my site has been using for a couple years now.
  2. A blog demo using Prismic and Nuxt.

Successes 

Right away I was drawn to the Prismic admin--I liked the simplicity of it.

Everything seemed relatively straight forward in terms of modeling content and creating documents for said models (called "Content Types" in Prismic).

After building my blog with Gridsome and Prismic and seeing very little out there about pairing the two, I was happy to see that Prismic appeared to be treating Nuxt.js as a first-class framework to pair with Prismic (along with Next.js and others).

I could go on, but I think a list of things I appreciated would serve better:

  • Many Nuxt.js users seemed to be using Prismic and were posting in the forum.
  • Docs specifically for setting up Prismic with Nuxt.js.
  • Several ways to query your data including GraphQL, the @prismicio/client package, and the REST API.
  • A free plan for devs and hobbyists.
  • All the field types that I could imagine needing.

These were the most important to me, and because of these I was relatively happy...for a while...

Struggles 

Thennn I began to hit some bumps in the road.

The weather was really nice as long as I kept it simple with my feature needs. But as I began to kinda work on the--what you might say--less critical needs of the site--Prismic became a bit more difficult to work with.

Here are some of the pain points I experienced:

  • I couldn't find much at all about how fetching content differed when run in SSR/SSG mode. Although I was able to query my data at generation time which is what I wanted so I shut up and moved on.
  • The Prismic documentation always seemed either too verbose or too terse and I really struggled, having to navigate multiple doc pages, finally finding my answer usually on the Prismic Forum or on Google on some third-party forum or blog.
  • The API seemed to lack some things I've come to think are standard, like passing a start position while paginating ( See here) , or being able to make a single query to fetch posts and their tags.
  • Simple things like creating a Navigation Menu are a bit strange being that they're on the same level with other Custom Types, and the link fields do not accept relative URLs. There is a long thread about this if you want to read more.
  • There is no official chat support, so finding immediate answers, especially with the lack of--and quality of documentation--may be challenging.

Conclusion 

In short, I'd say if you just need some very simple content managed and served up--and are going headless with your site--it'll probably do. Say--something like just a blog page on a site that's mainly static. But at this point, I would have to say that using Prismic to serve content for a full-site would likely bring many headaches and lots of time loss.

I was planning on finishing up this demo project and working up a little tutorial with it, but as I began to encounter all these pain points, I realized it was not something I'd recommend using just yet.

If you're interested in checking out the demo and the code they are below.

Demo: http://my-nuxt-prismic.jamesauble.com/
Repo: https://github.com/james0r/my-nuxt-app

Code on web assassins!

Scrolldown Icon