Setup Guide

Live in 5 minutes

Install the backend package, add 4 lines of config, drop in 2 frontend components.

Prerequisites

Node.js 18+.NET 9 SDKSQL Server (LocalDB OK)
1

Install the packages

~30s

Two commands — one for your Next.js frontend, one for your .NET backend.

Terminal
# Frontend (Next.js)
npm install @altiusseo/next

# Backend (.NET)
dotnet add package AltiusSEO.Core
2

Configure the .NET backend

~1 min

Add 3 lines to Program.cs and a connection string to appsettings.json.

Program.cs
using AltiusSEO.Core.Extensions;

builder.Services.AddAltiusSEO(options => {
    options.ConnectionString = builder.Configuration.GetConnectionString("Default");
    options.SiteId = "my-site";
    options.LicenseKey = ""; // leave empty for free tier
});

// Auto-creates 11 database tables on first run
app.UseAltiusSEODatabase();

// Registers all API endpoints
app.MapAltiusSEO();        // /api/seo/*
app.MapAltiusSEOAdmin();   // /api/admin/seo/*
appsettings.json
{
  "ConnectionStrings": {
    "Default": "Server=(localdb)\\mssqllocaldb;Database=MyApp_SEO;Trusted_Connection=True;TrustServerCertificate=True;"
  }
}
3

Wrap your frontend

~1 min

Create a client provider and add it to your root layout. The SEOTracker is invisible — it auto-tracks page views.

app/providers.tsx
'use client';
import { SEOProvider, SEOTracker } from '@altiusseo/next';

export function Providers({ children }: { children: React.ReactNode }) {
  return (
    <SEOProvider apiUrl="/api/seo" siteId="my-site">
      {children}
      <SEOTracker />
    </SEOProvider>
  );
}
app/layout.tsx
import { Providers } from './providers';

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        <Providers>{children}</Providers>
      </body>
    </html>
  );
}
4

Add SEO to your pages

~1 min

Use SEOHead for meta tags and any schema component for structured data.

app/blog/[slug]/page.tsx
'use client';
import { SEOHead, ArticleSchema } from '@altiusseo/next';

export default function BlogPost({ post }) {
  return (
    <>
      <SEOHead
        title={post.title}
        description={post.excerpt}
        ogImage={post.coverImage}
        canonical={`https://mysite.com/blog/${post.slug}`}
      />
      <ArticleSchema
        headline={post.title}
        author={post.author}
        datePublished={post.date}
      />
      <article>{post.content}</article>
    </>
  );
}
5

Open your admin dashboard

~30s

Drop the dashboard into any admin route and visit it immediately.

app/admin/seo/page.tsx
'use client';
import { SEODashboard } from '@altiusseo/next';

export default function SEOAdmin() {
  return <SEODashboard />;
}

Visit /admin/seo — you now have a 20-tab SEO panel with analytics, sitemap management, robots.txt editor, and more.

6

Optional: Redirect middleware

~1 min

Handle 301/302 redirects automatically at the Next.js edge before your pages load.

middleware.ts
import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';
import { createAltiusSEOMiddleware } from '@altiusseo/next/middleware';

const seoMiddleware = createAltiusSEOMiddleware({
  apiUrl: process.env.NEXT_PUBLIC_API_URL || '/api/seo',
  siteId: 'my-site',
});

export async function middleware(request: NextRequest) {
  const seoResponse = await seoMiddleware(request);
  if (seoResponse) return seoResponse;
  return NextResponse.next();
}

Your site now has

Automatic privacy-first page view tracking
Meta tags + Open Graph on every page
Schema markup for rich search results
Full admin dashboard at /admin/seo
Automatic redirect handling at the edge
Live XML sitemap at /sitemap.xml
Robots.txt served from your backend
SEO score checker for every page

Any questions?

The full configuration reference is in our docs, or ask us directly.