Skip to content

BLOG-SERIES-PLAN.md

Latest commit

 

History

History
325 lines (258 loc) · 16.9 KB

BLOG-SERIES-PLAN.md

File metadata and controls

325 lines (258 loc) · 16.9 KB

AngularNetTutorial Blog Series Plan

Series Title: Full-Stack Development with Angular, .NET, and OAuth 2.0 Publication: Scrum and Coke on Medium Tutorial Repository: https://github.com/workcontrolgit/AngularNetTutorial

Status Key:

  • Not started
  • [~] In progress / Draft exists
  • Published

📚 Published Articles

📝 Series 0: Architecture & Workspace

  • [~] Article 0.1 — Git Submodules as Workspace

    • Title: Stop Juggling Multiple Repos: Manage Your Full-Stack App Like a Workspace
    • Subtitle: How Git Submodules Transform Multi-Repository Projects into a Unified Development Experience
    • File: blogs/series-0-architecture/0.1-git-submodule-workspace.md
    • Notes: Draft complete. Ready to publish.

  • [~] Article 0.2 — Playwright Overview

    • Title: End-to-End Testing Made Simple: How Playwright Transforms Testing for Angular Applications
    • Subtitle: Comprehensive E2E Testing for Modern Full-Stack Applications
    • File: blogs/series-0-architecture/0.2-playwright-testing.md
    • Notes: Draft complete. QA done. Ready to publish.

🔐 Series 1: Authentication & Security

  • [~] Article 1.1 — OAuth 2.0 PKCE Flow

    • Title: Why Your Angular App Needs PKCE: OAuth 2.0 Explained with a Working Demo
    • Subtitle: Follow a Login Request from Browser to IdentityServer and Back — No Theory, Just Code
    • File: blogs/series-1-authentication/1.1-oauth2-pkce-flow.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 1.2 — Angular Route Guards

    • Title: Lock Down Your Angular Routes: Auth Guards with OIDC in 5 Minutes
    • Subtitle: How to Protect Pages, Redirect Unauthenticated Users, and Verify It Works with Playwright
    • File: blogs/series-1-authentication/1.2-angular-route-guards.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 1.3 — HTTP Interceptor

    • Title: Never Forget a Bearer Token Again: Angular's HTTP Interceptor Explained
    • Subtitle: How One File Automatically Secures Every API Request in Your Angular App
    • File: blogs/series-1-authentication/1.3-angular-http-interceptor.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 1.4 — Role-Based UI

    • Title: Show the Right Buttons to the Right People: Role-Based UI in Angular
    • Subtitle: How *appHasRole and ngx-permissions Control What Each User Sees — Without Cluttering Your Components
    • File: blogs/series-1-authentication/1.4-angular-role-based-ui.md
    • Notes: Draft complete. Ready for review.

🔧 Series 2: .NET 10 Web API

  • [~] Article 2.1 — Clean Architecture

    • Title: How to Structure a .NET 10 API So It Doesn't Become a Mess
    • Subtitle: A Walking Tour of Clean Architecture: Domain, Application, Infrastructure, and WebApi Layers
    • File: blogs/series-2-dotnet-api/2.1-dotnet-clean-architecture.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 2.2 — JWT Token Validation

    • Title: How Your .NET API Knows to Trust Angular — JWT Validation Explained
    • Subtitle: Connecting IdentityServer, Access Tokens, and API Authorization in One Clear Flow
    • File: blogs/series-2-dotnet-api/2.2-dotnet-jwt-validation.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 2.3 — API Versioning

    • Title: Future-Proof Your .NET API: Add Versioning Without Breaking Existing Clients
    • Subtitle: Why /api/v1/ Matters and How to Implement Versioning the Right Way
    • File: blogs/series-2-dotnet-api/2.3-dotnet-api-versioning.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 2.4 — Swagger with JWT

    • Title: Test Your Secured .NET API Without Writing a Single Line of Frontend Code
    • Subtitle: Configuring Swagger to Accept Bearer Tokens for Interactive API Exploration
    • File: blogs/series-2-dotnet-api/2.4-dotnet-swagger-jwt.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 2.5 — Response Caching with EasyCaching

    • Title: Speed Up Your Dashboard: Easy Response Caching in .NET 10 With EasyCaching
    • Subtitle: How In-Memory Caching, Domain Event Invalidation, and Diagnostic Headers Transform API Performance
    • File: blogs/series-2-dotnet-api/2.5-dotnet-easycaching.md
    • Notes: Draft complete. Ready for review.

🎨 Series 3: Angular Material UI

  • [~] Article 3.1 — Data Tables

    • Title: Build a Production-Ready Data Table in Angular Material: Sort, Filter, Page
    • Subtitle: From Zero to a Fully Functional Employee List with MatTable, MatPaginator, and Server-Side Filtering
    • File: blogs/series-3-angular-material/3.1-angular-material-datatable.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 3.2 — Reactive Forms

    • Title: Reactive Forms Done Right: Validation Patterns Every Angular Developer Should Know
    • Subtitle: Required Fields, Email Validation, and Min Value Rules with Angular Material — One Form for Create and Edit
    • File: blogs/series-3-angular-material/3.2-angular-reactive-forms.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 3.3 — Dialogs

    • Title: The Right Way to Ask "Are You Sure?" — Angular Material Dialogs for Confirm Actions
    • Subtitle: Building a Delete Confirmation Dialog with MatDialog, Proper Result Handling, and Reuse Across the App
    • File: blogs/series-3-angular-material/3.3-angular-material-dialogs.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 3.4 — ng-matero Admin Shell

    • Title: Why We Didn't Build the Admin Shell from Scratch: ng-matero Explained
    • Subtitle: How a Starter Template Provides the Responsive Layout, Theme Customizer, and Date Adapter — So You Can Focus on Features
    • File: blogs/series-3-angular-material/3.4-ng-matero-admin-shell.md
    • Notes: Draft complete. Ready for review.

🎭 Series 4: Playwright Testing Deep Dives

  • [~] Article 4.1 — First Playwright Test

    • Title: Your First Playwright Test for an Angular App — From Zero to Green
    • Subtitle: Step-by-Step: Install Playwright, Write a Login Test, and Run It Against a Real OAuth 2.0 App
    • File: blogs/series-4-playwright-testing/4.1-playwright-first-test.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 4.2 — Page Object Model

    • Title: Stop Copy-Pasting Selectors: The Page Object Model for Angular Material
    • Subtitle: How BaseListPage and BaseFormPage Eliminate Selector Duplication Across Your Entire Test Suite
    • File: blogs/series-4-playwright-testing/4.2-playwright-page-object-model.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 4.3 — Role-Based Testing

    • Title: One Feature, Three Users: Testing Role-Based Access Control with Playwright
    • Subtitle: How to Verify That Employees See Read-Only Views, Managers Can Create, and HRAdmins Can Delete — Without Guessing
    • File: blogs/series-4-playwright-testing/4.3-playwright-role-based-testing.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 4.4 — JWT Token Testing

    • Title: How to Extract and Verify JWT Tokens in Playwright Tests
    • Subtitle: Decode the Token, Check the Claims, and Confirm the Right Scopes Are Granted
    • File: blogs/series-4-playwright-testing/4.4-playwright-jwt-token-testing.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 4.5 — API Testing

    • Title: Skip the UI: Test Your .NET API Directly with Playwright's Request Fixture
    • Subtitle: Authenticate via Browser, Extract the Token, and Call API Endpoints Programmatically
    • File: blogs/series-4-playwright-testing/4.5-playwright-api-testing.md
    • Notes: Draft complete. Ready for review.

🛠️ Series 5: DevOps & Data

  • [~] Article 5.1 — Database Seeding

    • Title: 1,000 Test Employees in 3 Seconds: Database Seeding for Development and Testing
    • Subtitle: How the Bogus Library Generates Reproducible Fake Data That Makes Your App Look Real From Day One
    • File: blogs/series-5-devops-data/5.1-database-seeding.md
    • Notes: Draft complete. Ready for review.

  • [~] Article 5.2 — CI/CD with GitHub Actions

    • Title: Run Your Playwright Tests Automatically: CI/CD for a Full-Stack Angular/.NET App
    • Subtitle: GitHub Actions Workflow That Runs All Three Browsers, Publishes JUnit Reports, and Comments Results on Every Pull Request
    • File: blogs/series-5-devops-data/5.2-cicd-github-actions.md
    • Notes: Draft complete. Ready for review.

☁️ Series 5 Azure Deployment Sub-Series

Target audience: developers new to Azure with a Visual Studio Professional subscription ($50/month credit). Each article ships with real, runnable Bicep templates and GitHub Actions workflows.

  • Article 5.3 — Azure Subscription Setup

    • Title: Your First Azure Deployment: Setting Up a Visual Studio Subscription
    • Subtitle: Activate Your $50 Monthly Credit, Install the Azure CLI, and Understand What Fits in Your Budget
    • File: blogs/series-5-devops-data/5.3-azure-subscription-setup.md
    • Branch: feature/5.3-5.8-azure-deployment-series
    • Notes: Blog only — no code files. Setup guide for new Azure users.

  • Article 5.4 — Bicep Infrastructure

    • Title: Infrastructure as Code: Provision All Azure Resources with One Bicep Command
    • Subtitle: From Empty Subscription to a Running App Service Plan, SQL Server, and Static Web App in Minutes
    • File: blogs/series-5-devops-data/5.4-azure-bicep-infrastructure.md
    • Code: infra/main.bicep, infra/modules/*.bicep, infra/parameters/dev.bicepparam
    • Branch: feature/5.3-5.8-azure-deployment-series
    • Notes: Writes real Bicep templates that can be run against an actual Azure subscription.

  • Article 5.5 — OIDC GitHub Actions Setup

    • Title: Secure CI/CD: Connect GitHub Actions to Azure Without Storing Passwords
    • Subtitle: How Federated Identity Credentials Replace Long-Lived Secrets With Short-Lived OIDC Tokens
    • File: blogs/series-5-devops-data/5.5-azure-oidc-github-actions.md
    • Code: Walkthrough of infra/scripts/setup-oidc.sh (already written)
    • Branch: feature/5.3-5.8-azure-deployment-series
    • Notes: Explains the existing setup-oidc.sh script step by step; covers 4 GitHub Secrets.

  • Article 5.6 — Deploy .NET Apps

    • Title: Deploy .NET API and IdentityServer to Azure App Service with GitHub Actions
    • Subtitle: Restore, Build, Test, Publish, and Deploy — Automatically on Every Push to Main
    • File: blogs/series-5-devops-data/5.6-azure-deploy-dotnet-apps.md
    • Code: .github/workflows/deploy-api.yml, .github/workflows/deploy-identityserver.yml
    • Branch: feature/5.3-5.8-azure-deployment-series
    • Notes: Covers deployment order (IdentityServer first), App Service config, EF Core migrations.

  • Article 5.7 — Deploy Angular

    • Title: Deploy Angular to Azure Static Web Apps: Zero Cost, Global CDN, Auto PR Previews
    • Subtitle: Inject Environment URLs at Build Time and Let GitHub Actions Handle the Rest
    • File: blogs/series-5-devops-data/5.7-azure-deploy-angular-swa.md
    • Code: .github/workflows/deploy-angular.yml, staticwebapp.config.json
    • Branch: feature/5.3-5.8-azure-deployment-series
    • Notes: Covers environment URL injection at build time and SPA fallback routing config.

  • Article 5.8 — Post-Deployment Configuration and Validation

    • Title: Connect the Stack: Post-Deployment Configuration and Validation
    • Subtitle: Wire Up IdentityServer Redirect URIs, CORS, and Validate the Full Login Flow on Azure
    • File: blogs/series-5-devops-data/5.8-azure-post-deployment-config.md
    • Branch: feature/5.3-5.8-azure-deployment-series
    • Notes: Blog only — configuration checklist, common failure patterns, end-to-end validation steps.

🤖 Series 6: AI App Features

  • Article 6.1 — .NET AI Foundation

    • Title: Run a Local LLM in Your .NET 10 API with Ollama
    • Subtitle: How Microsoft.Extensions.AI Makes Your API AI-Ready Without Locking You Into One Provider
    • File: blogs/series-6-ai-app-features/6.1-dotnet-ai-foundation.md
    • Branch: feature/6.1-dotnet-ai-foundation
    • Notes: Not started.

  • Article 6.2 — HR AI Assistant

    • Title: Build an HR AI Assistant That Knows Your Data
    • Subtitle: Feed Real Employee Metrics Into a Local LLM and Get Meaningful Insights Back
    • File: blogs/series-6-ai-app-features/6.2-dotnet-ai-hr-assistant.md
    • Branch: feature/6.2-dotnet-ai-hr-assistant
    • Notes: Not started.

  • Article 6.3 — Angular AI Chat Widget

    • Title: Add an AI Chat Widget to Angular with Streaming
    • Subtitle: Build a Real-Time Chat UI with SSE Streaming, Angular Signals, and Angular Material
    • File: blogs/series-6-ai-app-features/6.3-angular-ai-chat-widget.md
    • Branch: feature/6.3-angular-ai-chat-widget
    • Notes: Not started.

  • Article 6.4 — AI Dashboard Insights

    • Title: AI-Generated Dashboard Insights in Angular Material
    • Subtitle: How to Prompt an LLM With Live Metrics and Display Smart Summaries on the Dashboard
    • File: blogs/series-6-ai-app-features/6.4-angular-ai-dashboard-insights.md
    • Branch: feature/6.4-angular-ai-dashboard-insights
    • Notes: Not started.

  • Article 6.5 — Natural Language Search

    • Title: Natural Language Employee Search with LLM Query Parsing
    • Subtitle: Replace Keyword Filters With Plain-English Queries — The LLM Translates Intent Into API Parameters
    • File: blogs/series-6-ai-app-features/6.5-dotnet-natural-language-search.md
    • Branch: feature/6.5-natural-language-search
    • Notes: Not started.

  • Article 6.6 — AI Response Caching

    • Title: Cache Your AI Responses: Save Time and API Costs
    • Subtitle: How EasyCaching Cache-Aside Eliminates Duplicate LLM Calls and Adds Cache Observability Headers
    • File: blogs/series-6-ai-app-features/6.6-dotnet-ai-response-caching.md
    • Branch: feature/6.6-ai-response-caching
    • Notes: Not started.

🛠️ Series 7: Developer Productivity AI

  • Article 7.1 — Claude Code Workflow

    • Title: How We Built 22 Articles with Claude Code
    • Subtitle: The Prompting Patterns, CLAUDE.md Conventions, and Session Workflows That Made It Possible
    • File: blogs/series-7-developer-productivity-ai/7.1-claude-code-workflow.md
    • Branch: feature/7.1-claude-code-workflow
    • Notes: Not started.

  • Article 7.2 — Copilot for Clean Architecture

    • Title: GitHub Copilot for .NET Clean Architecture
    • Subtitle: Prompt Patterns for Generating CQRS Handlers, FluentValidation Rules, and Mapster Mappings
    • File: blogs/series-7-developer-productivity-ai/7.2-copilot-clean-architecture.md
    • Branch: feature/7.2-copilot-clean-architecture
    • Notes: Not started.

  • Article 7.3 — AI-Generated Playwright Tests

    • Title: Generate Playwright Tests from User Stories with AI
    • Subtitle: From Requirements to Running Tests — How to Prompt Your Way to a Full E2E Test Suite
    • File: blogs/series-7-developer-productivity-ai/7.3-ai-generated-playwright-tests.md
    • Branch: feature/7.3-ai-generated-playwright-tests
    • Notes: Not started.

  • Article 7.4 — AI Code Review in GitHub Actions

    • Title: AI Code Review in GitHub Actions
    • Subtitle: Add an Automated AI Reviewer to Every Pull Request Using the Anthropic API
    • File: blogs/series-7-developer-productivity-ai/7.4-ai-code-review-github-actions.md
    • Branch: feature/7.4-ai-code-review-ci
    • Notes: Not started.

📊 Publication Tracker

Total articles planned: 37 Published: 1 Draft ready: 22 Not started: 16 (Series 5 Azure sub-series × 6, Series 6 × 6, Series 7 × 4)

📋 Writing Guidelines

  • Follow BLOG-TEMPLATE.md for structure
  • Save drafts as [N.N]-[topic].md in the appropriate blogs/series-N-*/ folder
  • All code examples must come from the actual tutorial repo
  • Test all code examples before publishing
  • No tables — use bullet lists with em dashes (—)
  • Add Series Navigation section at bottom of each article
  • Update this plan when an article is published (change [ ] to [x])