What is it?
SEO is making your pages findable and well-represented in search results. For frontend developers it's mostly technical: server-rendered content crawlers can read, correct meta tags, structured data (JSON-LD), a sitemap, fast Core Web Vitals, and clean semantic HTML. The content strategy is someone else's job; the technical foundation is yours.
Why it matters
A beautiful site nobody can find earns nothing. Technical SEO is frontend work — SSR vs CSR, metadata, structured data, performance — and it's a differentiator in hiring because most juniors skip it entirely. Knowing how Google reads a page is a senior signal.
What to learn
- Crawlability: why SSR/SSG beats client-only rendering for SEO
- Meta tags: title, description, canonical, robots
- Open Graph + Twitter cards for social sharing
- Structured data (JSON-LD): Article, Course, FAQ, Breadcrumb
- Sitemaps and robots.txt
- Core Web Vitals as a ranking factor
- Semantic HTML + heading hierarchy as a crawl signal
Common pitfall
Building an SEO-critical page as a client-only SPA. Crawlers run limited
JavaScript, slowly, and don't wait for your useEffect fetch. If the
content matters for search, render it on the server. "It shows up when I
visit" is not the same as "Google can read it."
Resources
Primary (free):
- Google Search Central — SEO starter guide · docs
- Next.js — Metadata · docs
- Schema.org · docs
- Google Rich Results Test · tool
Practice
Take a page you built. Add a proper <title> + meta description, Open
Graph tags, and one piece of JSON-LD (Article or Breadcrumb). Run it
through the Rich Results Test and the Open Graph debugger. Done when the
Rich Results Test shows a valid structured-data type and the social
preview renders correctly.
Outcomes
- Decide SSR vs CSR for a page based on whether it needs to rank.
- Write correct title, description, and canonical tags.
- Add valid JSON-LD and verify it with the Rich Results Test.
- Generate a working sitemap + robots.txt.