Original subtitles

Now let's start with step number one

in this lecture.

Let's double check our code

and verify that we're happy with it.

Now for this I'm back in this blog project

which we worked on in the last course section.

If you didn't follow along there,

you find my latest snapshot attached.

Just be aware that the MongoDB credentials I'm using here,

won't work for you.

This is my cluster and I invalidated this user

and its password after recording this course.

So you will need to bring your own MongoDB database

and your own connection string

to make that API route work.

Other than that you can continue

with what I shared here as an attachment.

And therefore, now we want to double check this setup

and see if we're happy with it.

Now, of course, such a validation is an ongoing process

and you will always find improvement potential,

but generally what we have here shouldn't be too bad.

We are, for example, already using Nextimage.

So the optimized images in all the places

where we are working with images,

even in our post contents.

Even there we make sure that images

that are part of our posts are rendered with Nextimage.

And that is a great optimization

because that loads images only when they are needed.

It loads them lazily, and it also shrinks them in size.

Now, speaking of lazy loading,

that also is a concept we know in general in React,

and most prominently when working with just React,

without NextJS, you might want to lazy load your routes.

So that the code for a given page

is only downloaded if you're visiting that page,

and it's not downloaded if you not visit the page.

The great thing here is that NextJS

has this kind of lazy loading built in.

You don't need to worry about it.

Your different pages, which we have here,

are already lazy loaded.

So the code for them is only fetched on demand,

when we visit a page.

So that built-in lazy loading

is a very nice feature to have.

Now regarding the metadata, which we should add.

I'm happy with the amount of metadata, like title,

and this description tag I added in the last course section.

Of course, there is more you might want to add.

Favicons, images which are displayed

if you share a page through Facebook or Twitter.

So these little preview images and so on.

These are all extra kinds of data

you could add into your head section,

but for this demo here for this project,

the current amount of metadata which we added,

is fine for me.

And therefore at the moment, I'm happy with that code.

I think it should be fine

but we will soon revalidate this

by doing a test build, of course.

Nonetheless, for the moment let's move on to the next step.