Dino Lozina
Create a Programmatic SEO Project Using Next.js and Static Site Generation
#1about 3 minutes
How Zapier's SEO strategy inspired the project
The project was inspired by Zapier's success in generating massive organic traffic by creating thousands of integration-specific landing pages.
#2about 4 minutes
Targeting long-tail keywords instead of high-value terms
Programmatic SEO focuses on generating many pages for specific long-tail keywords instead of competing for broad, high-value keywords.
#3about 4 minutes
Why search engine crawlers prefer server-rendered HTML
Google crawlers can easily parse server-rendered HTML for quick indexing, whereas client-side rendered JavaScript can be slow and unreliable.
#4about 3 minutes
Choosing Next.js for static site generation
Next.js was selected for its powerful features like hybrid static and server rendering, route pre-fetching, and minimal configuration.
#5about 1 minute
Generating dynamic pages with getStaticPaths and getStaticProps
Use `getStaticPaths` to define all the dynamic routes and `getStaticProps` to fetch data for each page from an external API at build time.
#6about 3 minutes
Combining a .NET API with a Next.js frontend
The final solution uses a .NET backend API to provide path and content data to a Next.js frontend, which generates all static pages at build time.
#7about 3 minutes
Q&A on unique content, TypeScript, and Gatsby
The Q&A covers strategies for ensuring content uniqueness, Next.js's full TypeScript compatibility, and a comparison with Gatsby.
Related jobs
Jobs that call for the skills explored in this talk.
Matching moments
03:55 MIN
An overview of Next.js and its optimization capabilities
Next.js Unleashed: Optimizing Web Vitals for superior User Experience
Unlock full access
Log in or set up an account to access this feature and more.
04:14 MIN
Audience Q&A on use cases, CMS, and SEO
One Framework To Rule Them All: Faster Websites With Astro
Unlock full access
Log in or set up an account to access this feature and more.
07:08 MIN
Creating dynamic product pages with Next.js
Teini - an extremely small webshop leveraging awesome and free tech
Unlock full access
Log in or set up an account to access this feature and more.
06:37 MIN
Answering questions on headless architecture
Fast & Furious - Going headless with Nuxt.js!
Unlock full access
Log in or set up an account to access this feature and more.
05:13 MIN
Using static site generators and Jamstack for efficiency
How Your Bundle Size Affects The Climate
Unlock full access
Log in or set up an account to access this feature and more.
05:21 MIN
Key takeaways and best practices for Angular SEO
SEO in Angular? No big deal with SSR and Angular Universal
Unlock full access
Log in or set up an account to access this feature and more.
04:02 MIN
Using static site generators to pre-render markup
Jamstack and Web Performance, a match made in heaven
Unlock full access
Log in or set up an account to access this feature and more.
06:14 MIN
Understanding the SEO problem in single-page applications
SEO in Angular? No big deal with SSR and Angular Universal
Unlock full access
Log in or set up an account to access this feature and more.
Featured Partners
Related Videos
GraphQL + Apollo + Next.js: A Lovely Trio
Josh Goldberg
Microfrontends at Scale
Josh Goldberg
Teini - an extremely small webshop leveraging awesome and free tech
Christian K.
From Zero to Hero: NextJS 13 and Tailwind CSS for Beginners
Marius Obert
SEO in Angular? No big deal with SSR and Angular Universal
Martina Kraus
Next, Nest, Nuxt… Nust?
Marius Obert
Next.js Unleashed: Optimizing Web Vitals for superior User Experience
Eileen Fürstenau
Fast & Furious - Going headless with Nuxt.js!
Samuel Snopko
Related Articles
View all articles.gif?w=240&auto=compress,format)



From learning to earning
Jobs that call for the skills explored in this talk.

doinstruct Software GmbH
Berlin, Germany
Senior
GIT
JavaScript
TypeScript




brandung GmbH & Co. KG
Intermediate
MongoDB
Next.js
GraphQL
PostgreSQL
TypeScript
+1




Zebresel - Deine Agentur für d igitale Medien.
GIT
HTML
Vue.js
Node.js