In short:
ak-web-frameworksis a knowledge skill for Next.js (App Router, Server Components, SSR, ISR, caching) and Turborepo (monorepos, pipelines, build caching). It reads the project config first, then opens only the guide that fits the job: rendering and data, optimization, SEO/GEO, or monorepo structure. It keeps the framework and icon set you already use; RemixIcon is only an extra option.
Disclosure: I maintain AgentKit and have an affiliate relationship with it: the AgentKit link in this post is an affiliate link; buying through it gets you 30% off.
Summary
Use it when you start a new Next.js app, move a JS-heavy client page to Server Components, tune caching when data is stale or the API is called too often, migrate a monorepo to Turborepo, or add SEO/GEO to a public site. If you want to change the stack or icon set, say so: by default it keeps what you have.
flowchart LR
A["Next.js or Turborepo work"] --> B["ak-web-frameworks"]
B --> C["Read manifests and config"]
C --> D["Code following the right guide"]
D --> E["Check with build, curl, browser"]It rests on 4 ideas:
| Idea | Question | Example |
|---|---|---|
| Existing stack | Which framework, workspace and icon set does the project use? | Seeing turbo.json and apps/web, build work follows the Turborepo guide |
| Server or client | Does this component need to run in the browser? | The list page fetches data on the server; only the stateful "Like" button uses 'use client' |
| How stale data may be | Fresh data every time, on a schedule, or only on change? | The blog uses revalidate: 3600, the cart uses no-store, publishing a post calls revalidatePath('/posts') |
| One content source for SEO/GEO | Where do the sitemap, llms.txt and .md versions get their data? | One getPages() function feeds the HTML pages, sitemap.xml, llms.txt and the .md versions |
For monorepos, the skill keeps apps/ and packages/ clearly separate, declares ^build so dependencies build first, declares the right outputs so the cache hits, and enables remote caching for team work.
Sample prompt to start a new app:
/ak-web-frameworks nextjs Create the <app name> app with Next.js App Router and TypeScript.
Outcome: npm run dev works, with a root layout, home page, loading and error states.
Constraints: a single app, no monorepo yet, no icon set chosen yet.
Done when: npm run build passes.This skill has no flags. After the command you write the framework (such as nextjs or turborepo) and then the task. Whatever you write, the skill still reads the project config to learn the real stack.
Below is the detailed version: the run flow, 5 situations with prompts, how to write the input, the change history by ak release, and common pitfalls. The detailed version and the interactive page are for subscribers. Your agent can also search them through the portal's MCP.
Opens when your account has subscriber access
This guide is for subscribers
Once your account has access, the full piece, the interactive visual and the agent call all open.
- Sign in or create a modernEngineer accountReading access belongs to your account email.
- Choose a plan on the pricing page1, 3 or 12 months, paid by VietQR bank transfer. Access opens about a minute after the money arrives.
- Or redeem a Facebook subscriber codePeople supporting the page on Facebook get an activation code by message each month.
Already a subscriber? Sign in to read.
Use this piece in your agent
Get an API keyCopy the text below and paste it into Claude Code, Codex or whichever agent you use. The agent reads the piece and checks it against the repo you have open.
Read "ak-web-frameworks: build Next.js and Turborepo on the stack you have" on modernEngineer and apply it to this repo.
1. Call the content_get tool of the modernengineer MCP server with locale "en", slug "ak-web-frameworks". If the modernengineer MCP server is not connected, stop and walk me through connecting it from https://modernengineer.dev/en/mcp.
2. Summarize the main steps of the piece and point out which apply to this repo.
3. Propose concrete changes and ask me before editing any file.Connect MCP in Claude Code (once)
claude mcp add --transport http modernengineer \
https://api.modernengineer.dev/mcp \
--header "Authorization: Bearer <API key>"Reading the full piece over MCP needs an API key from a subscriber account or one that bought this guide. Without access, the agent only gets the opening.
- Version
- v1.0.0
- Updated
- 22/10/2026
- Licence
- All rights reserved
- Slug
- ak-web-frameworks
