futuretrainee
New member
EDIT -> TLDR: Rank for keywords that are easier in the beginning, to get traffic to your site. Show the search engines that people are wanting to see what you are doing/selling. Then slowly build link authority by having blogs post about you. Side note places like ProductHunt (all you have to do is launch and like 20 other places will repost as they just repost the content on product hunt) which has like a 90 DR (which is insane). These backlinks will let search engines know that hey, this is probably going to match the searchers intent. I linked free keyword research tools at bottom. Also... just type into Google and see what sites come up... follow their style and content... there is a reason they are ranking in the top.
Now onto the real post...
https://preview.redd.it/wgtqm1blujt...bp&s=86e16197555cd27dadcce95e4b351249612e517e
Welp I guess I made, it. I'm about to be rich???!
...
no. but I can help show you how we ranked on Google.
Context
First
Each page of your app needs to have an exported metadata object.
We are using Next.js's App router. This is important as it comes pre-baked with some helpful SEO tools. One thing is the ability to export metadata at the top level of the page. This looks something like this:
What is metadata you might ask? Well to put it simply in this context, it helps describe what your page is and/or will be doing. Search engines are looking for the content/pages that will deliver exactly what the user is looking for. Let's say the users query is "best crock pot chicken". The intent of the user is probably not to buy a crock pot, but instead read an article or watch a video on how to cook the best crock pot chicken. Search engines know this and will rank sites that best answer your users intent. One way we can help search engines is by making sure the metadata on each page is optimized for exactly what the page is trying to portray.
Second
You need a sitemap.xml
In Next.js a sitemap is super simple to add, and will help Search Engines know what pages to rank/priority.
In the
folder add a
file in it, paste this code:
Third
You need a robots.txt file
I know it sounds simple, but this can help Search engines more efficiently index your site by knowing which paths to stay away from. Just add this code in the
folder:
Fourth
You need to export a large metadata object for your marketing home page.
This is the main entry point for 90% of your customers so make sure you incorporate all the keywords/titles/descriptions you need.
You can add this to your root layout in
file:
Fifth
You should have OG images.
What is an OG image? An OG image is a "Open Graph" image used to represent content on social media. It's the visual preview displayed when links are shared. It usually enhances link click through rates because it has a snapshot of your product.
You can add a .png (usually you just take a screenshot of your hero section) to your root page by going to
and then put your image. You must name it this:
Sixth
Look for keywords that don't have a hard keyword ranking.
How do you find this ranking? Go here it is free and will help you see what keywords are harder to rank for. Start getting traffic and ranking by going for easier keywords. You can go for harder ones, but that will require much more than what we talked about in this post.
Resources:
Taxonomy - this repo helps a lot with understanding the SEO basics of what we talked about
Ahrefs - this is a free keyword difficulty checker
Conclusion
Honestly the best form of SEO is just shipping your product. It takes some time for Google to index your site. I'm not an SEO expert, just a dude who wanted to share what helped me. This isn't law and there are probably people out there screaming saying "Oh no you missed this! and that!", but this is just my experience. Hopefully this helps. TBH how did we get to position number 2 so fast?? Well, our keywords are super easy to rank for. You will need quality backlinks and killer content if you really want to rank high on Google for hard keywords. Some of my sites are ranked on third page and have been working on them for a while, but the keywords are just so tough it takes time. Don't give up.
Now onto the real post...
https://preview.redd.it/wgtqm1blujt...bp&s=86e16197555cd27dadcce95e4b351249612e517e
Welp I guess I made, it. I'm about to be rich???!
...
no. but I can help show you how we ranked on Google.
Context
- I have a couple of different sites (startups)
- This one is fairly new ~ 2 month old
- Decided to work on SEO specifically as the main traffic source
- Using Next.js so no pre-built SEO help (aside from the metadata api + some other things) that something like Wix/Shopify would give
First
Each page of your app needs to have an exported metadata object.
We are using Next.js's App router. This is important as it comes pre-baked with some helpful SEO tools. One thing is the ability to export metadata at the top level of the page. This looks something like this:
Code:
export const metadata = {title: "Blog", description: "This is a cool blog lol..."}
What is metadata you might ask? Well to put it simply in this context, it helps describe what your page is and/or will be doing. Search engines are looking for the content/pages that will deliver exactly what the user is looking for. Let's say the users query is "best crock pot chicken". The intent of the user is probably not to buy a crock pot, but instead read an article or watch a video on how to cook the best crock pot chicken. Search engines know this and will rank sites that best answer your users intent. One way we can help search engines is by making sure the metadata on each page is optimized for exactly what the page is trying to portray.
Second
You need a sitemap.xml
In Next.js a sitemap is super simple to add, and will help Search Engines know what pages to rank/priority.
In the
Code:
/src/app
Code:
sitemap.ts
Code:
import { MetadataRoute } from "next";
import { headers } from "next/headers";
/**
* @description
* This function will generate a dynamic sitemap including all the blogPosts we have added to the db.
* NOTE: this will add the actual file to the domain path like: https://acme.com/sitemap.xml
*
*
* @example
https://acme.com
2023-04-06T15:02:24.021Z
yearly
1
https://acme.com/about
2023-04-06T15:02:24.021Z
monthly
0.8
https://acme.com/blog
2023-04-06T15:02:24.021Z
weekly
0.5
*
* @see
* https://nextjs.org/docs/app/api-reference/file-conventions/metadata/sitemap
*/
export default async function sitemap(): Promise {
const headersList = headers();
const domain = headersList.get("host")!;
// this will be our static pages we don't store in the DB. ex) pricing, about, etc...
const staticPages = [
{
path: null, // this is the root ex. https://acme.com
},
{
path: "blog",
},
];
return [
// just the basic pages we have for marketing
...staticPages.map(({ path }) => ({
url: `https://${domain}/${path ?? ""}`,
lastModified: new Date(),
})),
];
}
Third
You need a robots.txt file
I know it sounds simple, but this can help Search engines more efficiently index your site by knowing which paths to stay away from. Just add this code in the
Code:
/src/app
Code:
import { type MetadataRoute } from "next";
import { headers } from "next/headers";
export default function robots(): MetadataRoute.Robots {
const headersList = headers();
const domain = headersList.get("host")!;
return {
rules: {
userAgent: "*",
allow: ["/", "/api/og/*"],
disallow: "/private/",
},
sitemap: `https://${domain}/sitemap.xml`,
};
}
Fourth
You need to export a large metadata object for your marketing home page.
This is the main entry point for 90% of your customers so make sure you incorporate all the keywords/titles/descriptions you need.
You can add this to your root layout in
Code:
/src/app/layout.tsx
Code:
export const metadata: Metadata = {
title: {
default: "Your name",
template: `%s | Your name`,
},
keywords: [
// add a bunch of keywords like "things lol"
],
metadataBase: new URL("https://www.yourname.com"),
description:
"Your description",
authors: [
{
name: "you",
url: "https://www.you.com",
},
],
creator: "you",
openGraph: {
title: "Your OG title",
description:
"Your OG description",
url: "https://www.yoursite.com",
siteName: "yoursite.com",
type: "website",
locale: "en_US",
},
icons: {
icon: "/favicons/favicon.ico",
shortcut: "/favicons/favicon-16x16.png",
apple: "/favicons/apple-touch-icon.png",
},
manifest: `https://www.yoursite/site.webmanifest`,
};
Fifth
You should have OG images.
What is an OG image? An OG image is a "Open Graph" image used to represent content on social media. It's the visual preview displayed when links are shared. It usually enhances link click through rates because it has a snapshot of your product.
You can add a .png (usually you just take a screenshot of your hero section) to your root page by going to
Code:
/src/app
Code:
opengraph-image.png
Sixth
Look for keywords that don't have a hard keyword ranking.
How do you find this ranking? Go here it is free and will help you see what keywords are harder to rank for. Start getting traffic and ranking by going for easier keywords. You can go for harder ones, but that will require much more than what we talked about in this post.
Resources:
Taxonomy - this repo helps a lot with understanding the SEO basics of what we talked about
Ahrefs - this is a free keyword difficulty checker
Conclusion
Honestly the best form of SEO is just shipping your product. It takes some time for Google to index your site. I'm not an SEO expert, just a dude who wanted to share what helped me. This isn't law and there are probably people out there screaming saying "Oh no you missed this! and that!", but this is just my experience. Hopefully this helps. TBH how did we get to position number 2 so fast?? Well, our keywords are super easy to rank for. You will need quality backlinks and killer content if you really want to rank high on Google for hard keywords. Some of my sites are ranked on third page and have been working on them for a while, but the keywords are just so tough it takes time. Don't give up.