Best Analog.js Angular Starters & Boilerplates 2026

TL;DR

Analog.js is Angular's answer to Next.js and SvelteKit — a fullstack meta-framework that adds file-based routing, SSR, SSG, and API routes to Angular's powerful component system. By 2026, the ecosystem has matured with Analog 2.0 shipping content resources and leaner builds. If you're building Angular apps and want Next.js-style DX without leaving the Angular ecosystem, these starters eliminate weeks of boilerplate setup.

Key Takeaways

• Analog 2.0 (Nov 2025) added Content Resources for reactive content management and significantly reduced bundle sizes
• Powered by Vite and Nitro — same deployment targets as SvelteKit and Nuxt: Vercel, Netlify, Cloudflare, Node.js, and more
• File-based routing replaces Angular's module-based router config — routes live in src/app/pages/ as .page.ts files
• Angular's DI and signals system works natively — Analog is Angular, not a wrapper
• Nzoni is the most complete Angular SaaS boilerplate as of March 2026, with auth, billing, and multi-tenancy built in
• Best for: Teams with Angular expertise who want fullstack capabilities without switching to React or Vue

---

What Is Analog.js?

Analog is to Angular what Next.js is to React and SvelteKit is to Svelte. It's not a separate framework — it's Angular with batteries included:

Feature	Vanilla Angular	Analog.js
File-based routing	❌ (module config)	✅
SSR	Partial (Angular Universal)	✅ (Nitro-powered)
SSG	Manual	✅
API routes	❌	✅ (Nitro)
Vite dev server	❌ (webpack/esbuild)	✅
Content management	❌	✅ (v2 Content Resources)
Edge deployment	❌	✅ (Cloudflare, Vercel Edge)

Analog 2.0 (November 2025) was a significant milestone — it reduced bundle sizes by optimizing the Nitro adapter layer, and introduced Content Resources: reactive Angular signals that load and cache content (markdown, JSON, remote data) with built-in loading states.

The Angular team at Google has endorsed Analog as the community meta-framework for fullstack Angular development.

---

The Best Analog.js Starters in 2026

1. Official Analog Starter (Free, Open Source)

GitHub: analogjs/analog → apps/analog-app Stack: Angular + Analog 2.0 + TailwindCSS + TypeScript Best for: Learning Analog, simple apps, building a base

The official starter from the Analog team is minimal but well-structured. It demonstrates the core Analog patterns:

src/app/
├── pages/                  # File-based routes
│   ├── index.page.ts       # → /
│   ├── about.page.ts       # → /about
│   └── blog/
│       ├── index.page.ts   # → /blog
│       └── [slug].page.ts  # → /blog/[slug]
├── server/
│   └── routes/
│       └── api/
│           └── v1/
│               └── hello.ts # API route → /api/v1/hello

What's included:

• Analog 2.0 with Content Resources
• TailwindCSS 4.x configured
• TypeScript strict mode
• SSR + SSG ready
• Vite HMR

What's missing: Auth, database, billing — this is a blank canvas starter.

Install:

npm create analog@latest my-app
cd my-app && npm install && npm start

2. Nzoni Angular SaaS Boilerplate (Paid, $149)

URL: nzoni.app Stack: Angular + Analog + Supabase + Stripe + TailwindCSS + PrimeNG Best for: Angular developers building B2B SaaS products

Nzoni is described as "the most complete Angular SaaS starter kit" and it earns that title. In March 2026, it includes:

Authentication:

• Supabase Auth with email/password, magic links, OAuth (Google, GitHub)
• Row-Level Security (RLS) policies pre-configured in Supabase
• Role-based access control (admin, user, member)
• Multi-tenancy support with organization workspaces

Payments:

• Stripe integration with subscription management
• Pricing page with plan switching
• Usage-based billing hooks
• Webhook handling for subscription events

UI:

• PrimeNG component library pre-integrated (buttons, tables, forms, dialogs)
• TailwindCSS for utility classes
• Dark/light mode toggle
• Responsive layout system

DX:

• Analog 2.0 with SSR configured for Vercel and Cloudflare
• i18n setup (English/Spanish out of the box)
• Jest + Playwright testing configured
• GitHub Actions CI/CD workflow

At $149 one-time, Nzoni is competitive with Next.js SaaS starters like Supastarter or MakerKit. The difference: it's designed specifically for Angular teams who don't want to learn React.

3. AnalogKit (Free, Community)

GitHub: Search "analogkit" on GitHub Stack: Angular + Analog + Prisma + NextAuth-style auth + TailwindCSS Best for: Developers who want open-source Angular SaaS patterns

AnalogKit is a community-maintained Angular SaaS starter that implements patterns similar to the T3 stack but for Angular:

• Prisma ORM for database access (supports PostgreSQL, MySQL, SQLite)
• API routes via Analog's Nitro integration for a proper backend
• Auth using Angular-native JWT implementation
• tRPC-style RPC — experimental but functional in the 2026 version
• PocketBase adapter as an alternative to PostgreSQL + Prisma

It's less polished than Nzoni but provides a solid open-source foundation for teams that prefer to own their entire stack.

4. Brick SaaS (Paid, $299)

URL: brick-saas.com Stack: Angular frontend + ASP.NET Core API Best for: Enterprise teams mixing Angular frontend with .NET backend

Brick SaaS is unique in offering Angular as the frontend for a .NET Core backend — the fullstack choice for organizations already running .NET infrastructure. The Angular side uses Analog for SSR and routing, while the backend is fully typed with OpenAPI-generated TypeScript clients.

Trade-off: This is a hybrid architecture, not a pure Analog app. The API routes are .NET, not Nitro. If you need .NET, it's valuable; otherwise Nzoni or AnalogKit are more integrated.

5. Create Analog Content Site (Free, Official)

GitHub: analogjs/analog Stack: Angular + Analog Content Resources + Markdown Best for: Blogs, documentation sites, content-heavy apps

Analog 2.0's Content Resources feature was designed specifically for markdown-based content sites. The official content site starter demonstrates:

// src/app/pages/blog/[slug].page.ts
import { Component } from '@angular/core';
import { injectContent, MarkdownComponent } from '@analogjs/content';

@Component({
  template: `
    @if (post$ | async; as post) {
      <article>
        <h1>{{ post.attributes.title }}</h1>
        <analog-markdown [content]="post.content" />
      </article>
    }
  `,
})
export class BlogPostPageComponent {
  post$ = injectContent<PostAttributes>('blog');
}

Content Resources are reactive signals — they automatically update when the underlying markdown file changes, with built-in loading states and error handling.

---

Analog vs Other Angular Fullstack Options

Approach	Framework	DX	Production-Ready	Ecosystem
Analog.js	Angular	⭐⭐⭐⭐	✅ (v2.0)	Growing
Angular Universal	Angular	⭐⭐⭐	✅	Mature
NestJS + Angular	Angular	⭐⭐⭐⭐	✅	Mature
Next.js + React	React	⭐⭐⭐⭐⭐	✅	Dominant
Nuxt + Vue	Vue	⭐⭐⭐⭐	✅	Strong

When to choose Analog over Angular Universal: Analog's file-based routing is dramatically more ergonomic than configuring RouterModule by hand. If you're starting fresh, Analog is the better choice. Angular Universal is still valid for migrating existing apps.

When to choose Analog over switching to Next.js: If your team has deep Angular expertise — Angular's dependency injection, signals, component architecture, and RxJS patterns. Analog lets you keep that expertise while gaining Next.js-style DX.

---

File-Based Routing in Analog

The most transformative Analog feature for developers coming from Angular is file-based routing. Instead of:

// app.routes.ts (Angular Router)
export const routes: Routes = [
  { path: 'dashboard', component: DashboardComponent },
  { path: 'settings', component: SettingsComponent },
  {
    path: 'users',
    loadChildren: () => import('./users/users.routes').then(m => m.routes),
  },
];

You get:

src/app/pages/
├── dashboard.page.ts     → /dashboard
├── settings.page.ts      → /settings
└── users/
    ├── index.page.ts     → /users
    └── [id].page.ts      → /users/:id

Route components are just Angular components decorated with @RouteMeta:

// src/app/pages/dashboard.page.ts
import { Component } from '@angular/core';
import { RouteMeta } from '@analogjs/router';

export const routeMeta: RouteMeta = {
  title: 'Dashboard',
  canActivate: [authGuard],
};

@Component({
  template: `<h1>Dashboard</h1>`,
})
export default class DashboardPageComponent {}

---

Performance: Analog 2.0 vs Previous Versions

Analog 2.0's biggest improvement was build output optimization. Previous versions had overhead from the Nitro adapter that resulted in larger server bundles than necessary.

Benchmarks from the Analog team (November 2025):

Metric	Analog 1.x	Analog 2.0	Improvement
Server bundle size	~850KB	~420KB	-51%
First Contentful Paint	1.4s	0.9s	-36%
Build time (medium app)	45s	28s	-38%
Cold start (Vercel Edge)	180ms	85ms	-53%

The server bundle reduction is especially significant for edge deployments where cold start time matters.

---

Recommended Stack for Angular SaaS in 2026

For a new Angular SaaS project in 2026, this stack pairs well with Analog:

Layer	Choice	Why
Meta-framework	Analog 2.0	File routing, SSR, API routes
UI components	PrimeNG or Angular Material	Most complete Angular component libraries
CSS	TailwindCSS 4.x	Analog has first-class Vite integration
Database	Supabase	Excellent Angular SDK, RLS, auth
Auth	Supabase Auth	Pre-built with Supabase
Payments	Stripe	Best Analog integration via Nitro routes
Deployment	Vercel or Cloudflare Pages	Both have Nitro adapters
ORM	Prisma or Drizzle	Both work with Analog API routes

---

Getting Started with Nzoni

For teams wanting the fastest path to a working Angular SaaS:

# After purchasing Nzoni and downloading
unzip nzoni.zip && cd nzoni

# Install dependencies
npm install

# Set up environment variables
cp .env.example .env.local
# Fill in: SUPABASE_URL, SUPABASE_ANON_KEY, STRIPE_SECRET_KEY

# Run database migrations
npx supabase db push

# Start development
npm run dev

The setup process mirrors MakerKit and Supastarter in complexity — about 30–45 minutes to a running local environment.

---

Recommendations

Use the official Analog starter if:

• You're evaluating Analog for the first time
• Building a content site (blog, docs) — the Content Resources feature is excellent
• You prefer open-source with no vendor dependencies

Use Nzoni if:

• You're building an Angular SaaS and want auth + billing without building them yourself
• Your team knows Angular and doesn't want to switch to React for a SaaS project
• PrimeNG's component library fits your design needs

Use AnalogKit if:

• You need open-source SaaS patterns for Angular specifically
• You prefer PostgreSQL + Prisma over Supabase

Methodology

• Sources: Analog.js GitHub (3,900+ stars), AnalogJS 2.0 InfoQ announcement (Nov 2025), Nzoni.app product page, Boilerplatelist.com Angular SaaS collection, official Analog documentation at analogjs.org
• Date: March 2026

---

Exploring other framework starters? See Best React Router v7 boilerplates 2026 and Best SvelteKit SaaS boilerplates 2026.

Evaluating Angular vs other frameworks for your SaaS? See our Next.js vs SvelteKit vs Nuxt SaaS comparison 2026.

More Angular tooling: Angular 21 Zoneless performance guide 2026 on PkgPulse.