Netlify-cms: NextJS Support?

[josephmaxim]

Anyone successfully used netlify-cms with NextJS? been searching online and nobody seems to have done it. or is it even possible?

[erquhart]

Netlify CMS is designed to work with static site generators, but it doesn't support specific tools - it just edits static content and data files, such as Markdown and YAML, with no opinion or requirement regarding _what you do_ with those files. Folks normally build website content from those files using a static site generator. Next.js has static site generation capabilities, but it doesn't have built in support for processing Markdown.

Here's an example project that Netlify CMS would work with, as there are Markdown files in the content directory: https://github.com/tscanlin/next-blog

That project adds it's own conversion step to it's build process where it compiles the markdown files to HTML and makes the HTML available to Next.js in a JSON file.

Hope it helps! Let us know if you have any other questions, and if you do use Netlify CMS with Next.js, please consider writing a short guide for our docs to help others do the same!

[Ikhan]

@josephmaxim check this out

https://github.com/netlify/netlify-cms/blob/master/website/content/docs/nextjs.md

[erquhart]

On the docs site too: https://www.netlifycms.org/docs/nextjs/

_{Sent with GitHawk}

[josephmaxim]

@Ikhan & @erquhart Thanks!

[josephmaxim]

@erquhart do you have any example of how to implement blogging? on the docs it only shows static individual pages.

[go-diego]

@josephmaxim did you need help with anything in particular?

[josephmaxim]

@go-diego yes. do you have an example of how to dynamically display md files using Nextjs? for example on my home page i want to be able to display a list of blog post.

[go-diego]

@josephmaxim sorry for the delay.

While in Jekyll I maintained md files, one per each post, I couldn't find an easy way of doing that with Next at the time. So what I did was convert all md posts into one list of objects in a json file so that NetlifyCMS now manages a list instead of a folder collection.

One post object looks something like this:

 {
      "title": "",
      "publish_date": "",
      "description": "",
      "body": "",
      "tags": []
    }

Where body is a markdown widget and it's output is handled by react-markdown on the client side. This worked out for me as I could easily iterate over the array of posts. There is a Sanity + NextJS tutorial that follows a similar pattern, so I went with it.

[wutali]

I got the same issue, and then I tried to build an example of building a website using Next.js and Netlify CMS. Check it out:

https://github.com/wutali/nextjs-netlify-blog-template