Nuxt The Next Headless Git Based CMS? Create a Blog Using Nuxt Content. // Nuxt.js 2020 Tutorial

👉Check out my last video from this series

0:00 Introduction
0:39 .Tech Domains
1:34 Recap Of Nuxt Content
5:51 Add Syntax Highlighting
6:41 Working woth $content (sortBy)
14:01 Create next and previous

♡ ♡ ♡

MY COURSES -

♡ ♡ ♡

Make Sure To Check These Courses Out On Udemy! 💻

___

Links

[ProgramWithErik]

Use Code "erik.tech" at Checkout for a special 80% OFF on 1 & 5 Year .TECH Domains!

[junihh]

I really really thank you Erik. With this video you close some open questions that I have about Nuxt Content. Now is the right time to re-open my old blog. 😃

[alenanik]

Awesome! Thanks for sharing! I actually created one in a couple of hours with your tutorial, finally motivated to have a blog :)

[RIT_Edition]

Hi,
How to dynamically add metadata that coming from nuxt content (for eg - article.title)

[FlorianEagox]

great vid, absolutely loving nuxt content!

[kelvinangstrom]

Nice video, thanks for that. One thing that I have noticed in the Nuxt Content docs is that there does not seem to be any mention of images. How do you add inline images in the markdown files? It seems that it would be pretty limited to only have posts with text and codeblocks.

[ComisarioLobo]

Hi Erik, could you please make an in depth video comparing Next with Nuxt?

[duketranslucentrd]

Presumably markdown-style links compile to <nuxt-link>?

[austinfay]

On the topic of whether or not Nuxt is good for static site generation...

I definitely think Nuxt Content is good because it extends the flexibility of Nuxt. But if you're looking for a static site generator specifically, there are definitely better options. Even though I have lots of experience with Vue and Nuxt, I decided to go with Hugo for my latest project. Not only does it have way more features for building content driven sites, but it's also really fast. The Nuxt generate command is comparatively pretty slow. I'm using netlify cms to manage my content, so the build process of the website occurs on netlify as well. And since they charge by the minute for build time, it's extremely important to have a fast site generator.

I also noticed that in Nuxt 2.12, has terrible routing for static generation. We're familiar with the fact that nuxt-link and the router causes the interface to rerender by downloading additional using data and component code, preventing a full page load. I noticed that when running "nuxt generate" with this new Content plugin, it generates a db.json file which stores information about all of the markdown content in one file. Unfortunately, when navigating to a new route, this db.json file is always transferred in it's entirety to the client. In essence, your site causes the user's browser to download all of the articles on your website even if they were just reading one article. Very inefficient.

Seeing this strange behavior, I took a look at the source code for the Nuxt Content docs site in order to see how it worked. I found that they were using nuxt-edge, which is an experimental version of Nuxt (version 2.13). In this new version, they introduce a new cli command "nuxt export". It basically serves the same purpose, but it fixes the issue that I described in the previous paragraph.

So if you're looking for a tool to build a static site right now, I would avoid Nuxt. It's slow and still in early development for this kind of purpose. If you do decide you want to use it as a static site generator, at least wait until version 2.13 is officially released.

[cprobert]

I have a statically generated nuxt site, that uses strapi as a headless CMS. The problem is your hydrated content can differ from your static content if you don't re generate after each CMS edit.

Plugging nuxt content overcame this by allowing me to write a script that "cached" the strapi data to the filesystem. It also made deploying different targets much easier (staging and production). So it's a big win for me.

My only disappointment was not being able to bind markdown properties from my data to the <nuxt-content> component.

[TheSclare]

Many thanks. I hope you update more of your old videos too!

[iwebcomerce]

Hi Erik, thanks for the videos! if I want to use nuxt content, after deploy the app, can I dinamically add other md file on content folder ? I want to add dynamically md files on my blog, without generate entire project, each time i made changes on my posts. Thanks

[sanjayatony]

what to passing YML to SEO title dan description?
and also, adding an image to the markdown file. (where to put the image and the URL)
searched cant find anywhere
nice video btw, I easily can understand it. Thanks!

[andyfensham]

How would I load the markdown files from a server, and can one use the YAML or json data inside your markdown file. For e.g. you have the blog page (Your index page with the list of blogs). However, when inside the specific markdown file, you seem to have to write the content manually again in your markdown file. For e.g. your title and your extract. Is there a way to use that in the markdown file.

[karanmeghe]

Why are you not reviewing Jonas Js, node js, advanced css Courses ??

[kelvinsmith]

Everybody that's making videos on Nuxt content is running away from showing how to include a dynamic image on a markdown file and I see why. SHM
Youtube instructors and their half-backed tutorials.