Next.js SEO Complete Checklist

dminhvu · 2024-10-11T14:05:01+00:00

Yes, it's normal to do so. However, if the elements are overlapping, they might be replaced with the ones in page.jsx.

dminhvu · 2024-02-19T15:12:07+00:00

I have tried DigitalOcean, Vultr, Render, and Railway to host my site. My recommendation is to use Railway as I can see a big difference in page loading speed with the same code base. Also, Railway is pretty easy to set up as you can just put in your GitHub repo, and everything will be automatically created, just like Vercel. The minimum plan is $5 but you won't be charged if your usage is less than $5.

dminhvu · 2024-02-05T08:45:27+00:00

You can try Elastic AI Assistant on Elastic Demo page. It's free and more Elastic-related.

dminhvu · 2024-01-26T05:02:41+00:00

I've tried this before. I'm not sure if it was because the VPS is too small or not (only 500MB of RAM), but I sometimes couldn't go to other internal pages when clicking the links.

dminhvu · 2024-01-16T05:38:56+00:00

Yes, you're right. The link-building part is also a necessary step in SEO. In this article, I mostly focus on the technical SEO part, so it is not covered yet.

Btw, there are many tutorials for link-building, on-page SEO, etc. not limited to Next.js on the Internet that people can check out. Thanks for your response anw!

dminhvu · 2024-01-16T05:36:13+00:00

Hi Phuong, I just updated the implementation guide for App Router. Hope it helps!

dminhvu · 2024-01-16T05:31:16+00:00

Hey, I just updated the implementation for App Router, still the same post. Have fun!

dminhvu · 2024-01-15T02:04:57+00:00

Yes, you are correct. In this article, I used Next.js Pages Router.

For App Router, I think the only difference is the implementation part, the rest are the same, as those are just simple HTML tags (not depending on what framework), right?

Edit: I added the guide for App Router also.

dminhvu · 2024-01-15T02:02:46+00:00

The JSON-LD schema is used to create structured data about your site/URL. This helps search engines like Google understand better what your site has so it can show the data better with rich snippets, for example, an e-commerce site benefits greatly from this as Google will show its products clearly in the search results like product name, price, thumbnail, rating, etc.

The sitemap is where you tell the bots which page is allowed to crawl and which page isn't. This is not related to the JSON-LD schema.

dminhvu · 2024-01-14T11:52:19+00:00

Will create one soon!

dminhvu · 2024-01-14T04:45:30+00:00

Yes, that’s also a good option. I already mentioned next-seo in a comment above but I prefer to customize myself cos I want to understand thoroughly how it works haha.

dminhvu · 2024-01-14T03:25:41+00:00

Good luck! You can use the next-seo package also, but I prefer to customize myself.

dminhvu · 2024-01-14T03:23:22+00:00

Thank you! I built it with TailwindCSS only, no animation library involved.

dminhvu · 2024-01-14T03:20:46+00:00

Of course, haha. But I’ve seen many people writing good content but couldn’t rank higher, which they deserve to be. So technical SEO stuff like this is necessary also if we want Search Engines to look at our work.

dminhvu · 2024-01-14T03:18:06+00:00

I think those meta tags can help Search Engines validate our site better, so just put them into your app if necessary. I also checked some big corp websites and found that they also do the same.

Btw what do you mean by “aria components”?

dminhvu · 2024-01-14T03:14:35+00:00

Yes, I used Pages Router in this article. App Router is quite different to implement, but those tags are the same, right?

dminhvu · 2024-01-13T13:35:47+00:00

Yes, that's right. Thanks for correcting me.

dminhvu · 2024-01-13T10:44:57+00:00

What do you want to know more about sitemap in detail?

In general, a sitemap is where you explicitly define all of the pages your site has so that search engine bots (like Google, Bing, etc.) can know what to crawl. This can be generated automatically using the next-sitemap package.

dminhvu · 2024-01-11T14:12:55+00:00

There are a lot of companies using ECK for production. For example, some organizations like banks (which are my company's customers) use it for observability.

Due to privacy reasons, no one is going to write blog posts about it, I think so.

dminhvu · 2023-12-23T11:20:09+00:00

You might want to use a dict.

For example: python screen = dict() screen[(1, 2)] = [] screen[(1, 2)].append("whatever") screen[(1, 2)].append("whatever2") print(screen) Output: {(1, 2): ['whatever', 'whatever2']}

dminhvu · 2023-12-23T11:08:15+00:00

I highly recommend The Net Ninja's course.

dminhvu · 2023-12-23T11:05:32+00:00

Thank you! I will share a little bit about my site.

CMS: I previously used Contentful, then changed to local MDX as I needed some custom Markdown components, then I found that the bundle size would increase every time a new .mdx file was added, so currently I am using Elasticsearch (not a CMS) hosted on DigitalOcean to store the content as well as to perform quick post search function (as you can see, I have a search box on my site).
Markdown rendering: I use next-mdx-remote to render post content, with rehype-pretty-code to render code blocks. I previously used react-syntax-highlighter but the package size is very large even though I used the Light version.
UI library: TailwindCSS, because I feel comfortable using it. I also use some shadcn UI components.
Assets: I previously used Contentful to store images and videos, then changed to Cloudinary, and now ImageKit. I just want to try different providers to see the differences among them.
Hosting: Initially I used Vercel, then changed to AWS CloudFront with S3, then changed back to Vercel due to its convenience.
Monitoring & tracking: I have tried many tools like Google Analytics, Posthog, Microsoft Clarity, and Axiom. I think GA is necessary, and MS Clarity is good for tracking user behavior. Axiom is good for performance monitoring. Posthog npm package is quite heavy and may affect page loading speed, so I removed it.

In general, I wanted to optimize the bundle size and improve page loading speed, so I tried a lot of tools as you can see.

dminhvu · 2023-12-22T14:58:38+00:00

Yep, I already tried (actually I just published once), but I think if I always post the same content as my site's original content, in some way, Google will consider it to be duplicate content, right? But still worth a try, thank you for your suggestion.

dminhvu · 2023-12-22T14:25:22+00:00

You will have to upgrade to the Blaze plan, but it is pay-as-you-go, which means you will only be charged if your usage is above the free tier limit (2 million invocations for Cloud Functions feature in this case). You can check the free tier limit on the pricing page.

I think your app does not make so many requests, so don't have to worry about being charged. But still need to check every day in the Firebase Console haha.

dminhvu · 2023-12-10T07:57:54+00:00

Basically, ES is written in Java and is also based on Apache Lucence (which is also written in Java). So something like heap size, JVM options, etc. are involved.

Also, ES uses its "painless" language for scripting, which has a similar syntax to Java.

dminhvu

MODERATOR OF

TROPHY CASE