Windows Errors? Fix Them Before They Spread
Repair common Windows errors and clear accumulated junk for a smoother, more stable PC - no reinstall needed.Free scan · no reinstallCrashes, No Sound, or Screen Glitches?
Random freezes, missing sound and display glitches usually trace back to one bad driver. Find and replace yours safely.Free scan · under a minuteShared components should own structure, responsive behaviour and structured data. Route-specific page files should own every sentence a visitor reads. That is the rule Daniel Pertu sets out in a DEV Community article about building a guide cluster for CogniPrep, and it is a useful answer to a question that haunts any site with many related pages: where does this paragraph come from?
This piece explains the pattern, how its three layers fit together, where it trades off against a single dynamic template, and what to watch for with structured data. The pattern and its benefits are the author’s design judgment, not an experimentally measured result.
As an Amazon Associate I earn from qualifying purchases.
The rule in one sentence
Pertu’s wording: “A shared component may own markup, mobile behaviour and structured data. It may never own a sentence a visitor reads.” His implementation comment adds that every visitor-facing string belongs in the page.tsx that composes the blocks.
The concern behind it is a familiar failure mode. Shared components slowly collect variants and default copy. Eventually nobody can tell, looking at a rendered paragraph, whether it lives in the page, in a component prop default, or in a conditional branch three components deep. Banning copy from shared components makes the answer to “where does this paragraph come from?” always the same: the route file.
#1 Best Overall
The article’s context is CogniPrep, which had /interview and /assessment-centre-practice landing pages but no supporting content clusters. The article is tagged Next.js, React, TypeScript and SEO and is dated “Sep 24” on the retrieved page; no year is shown, so none is assumed here.
What is shared and what is not
The second question the article frames is “what is shared and what is not.” The split is:
| Owned by shared components | Owned by the route’s page file |
|---|---|
| Markup and layout structure | Headings and paragraphs text |
| Mobile and responsive behaviour | Step lists, FAQ questions and answers |
| Structured data (JSON-LD) emission | The data that feeds those blocks |
| Common chrome: header, breadcrumb, title, contents list | Which sections exist and in what order |
The three layers
1. A metadata registry
Each guide has a record holding fields such as slug, label, H1, meta title, meta description, social title, keywords and a hub-card blurb. According to the article, other pages reuse this single record for hub cards, the sitemap, sibling links and metadata, so a guide’s identity is declared once.
Do these 3 things before closing this tab:
1Repair Windows errors before they cause bigger problems2Scan for outdated or missing drivers - takes under a minute3Clear out junk files and repair common Windows errorsNote that this registry does contain copy (an H1, a description). It is page-level metadata about the guide rather than body content inside a reusable component, so it sits outside the “components never own sentences” rule: the text is still authored per guide, not baked into a shared widget.
2. A shared metadata function
A helper takes a registry entry and the route path and returns a Next.js metadata export. The article centralizes canonical, robots, Open Graph and Twitter handling here, so individual pages do not repeat it. For supported fields and current behaviour, the official Next.js documentation for generateMetadata (App Router) is the authority; the article’s example only illustrates one use.
The article’s title example is explicitly site-specific. CogniPrep appends ” | CogniPrep” (12 characters), so it limits the supplied meta title to 48 characters to stay under the author’s own 60-character target. Neither 48 nor 60 is a Google rule; adapt the numbers to your own suffix and targets.
3. A shared shell with a page-local body
The shell supplies the header, breadcrumb, title and contents-list framing, then renders its children. Each guide route writes its own sections by composing shared blocks. A rough illustration of the shape (not the author’s code):
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
// app/guides/example-guide/page.tsx
export const metadata = buildMetadata(guides["example-guide"], "/guides/example-guide");
export default function Page() {
return (
<GuideShell guide={guides["example-guide"]}>
<Section id="overview" heading="What this guide covers">
<p>Every sentence here is written in this file.</p>
</Section>
<Steps items={steps} />
</GuideShell>
);
}If a reviewer wants to change a sentence, they open one file and find it.
Route folders versus one dynamic template
The article chooses a folder per guide over a single [slug] route driven by a registry. The trade-off is qualitative: a dynamic route means fewer files, while separate folders let a guide change shape without first being extracted from a generic template. The author considers twelve folders manageable compared with forcing twelve guides into one permanent layout. “Twelve” is an example from this site, not a threshold, and no benchmark backs either option.
Rank #4
| Axis | Dynamic [slug] template |
Route folder per guide |
|---|---|---|
| Clarity of copy ownership | Depends on where content is stored; can drift toward template defaults | Always the route file, per the pattern |
| Consistency of shared metadata | Strong by construction | Strong if every page uses the shared helper |
| Ease of adding a page | Add a record and content | Add a folder, a page file and a registry entry |
| Unique layout for one guide | Requires template branching or extraction | Just change that page |
| Risk of content or schema drift | Lower if everything comes from one data shape | Lower if blocks derive markup from visible data |
| Maintenance overhead | Fewer files; template grows variants | More files; each simpler |
Neither wins universally. If your guides really are identical in shape and written by a content pipeline, a template may suit you better. If they diverge editorially, per-route files avoid the accumulating-variants problem the rule is meant to prevent.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Structured data from the same data as the visible content
The article has content blocks emit structured data from the same data that renders the visible section. Its example feeds one steps array to both an ordered list and a HowTo JSON-LD object; the FAQ block works the same way. Because both outputs read one source, the visible text and the markup are less likely to diverge.
Colocation is not validation, though. Google Search Central’s general structured data guidelines (last updated 2026-07-10 UTC) say markup must represent the page content and warn against irrelevant or misleading markup, which can cost rich-result eligibility through a manual action. JSON-LD is Google’s recommended format among those it supports. Google also states: “Google does not guarantee that your structured data will show up in search results, even if your page is marked up correctly according to the Rich Results Test.” Check each feature’s own requirements before relying on a block to emit a given type.
An exception: claims about the product
The author carves out one exception to page-authored copy. A scenario listing should be derived from the real exercise library, not typed by hand, because it asserts which product scenarios exist. The general principle: if a sentence is really a factual claim about a system, generate it from that system’s source of truth so it cannot go stale. The article presents this as design guidance, not an audit of CogniPrep’s current product.
Adopting the pattern
- List the strings visitors read and find any that live in shared components, including prop defaults and fallback text.
- Move them into the route files, or into data the route passes in.
- Give each guide one registry record and route every metadata export through a single helper.
- Build shared blocks that accept content as props or children and emit their JSON-LD from those same props.
- Keep generated claims, such as lists of available features, tied to their real source.
- Validate the output of each structured-data block against the relevant Google feature requirements.
A practical test for whether it is working: pick any paragraph on a live page and trace it to its source in under a minute.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
