install-sections

Install new shadcnblocks sections and extract text to i18n files for a page route.

Updated Nov 18, 2025
One-click install
npx skills add https://github.com/deomiarn/website-template --skill install-sections
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: install-sections
Source: https://github.com/deomiarn/website-template/tree/main/.claude/skills/install-sections
Command: npx skills add https://github.com/deomiarn/website-template --skill install-sections

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Automates page construction by installing new shadcnblocks sections, assembling the page, and extracting text to i18n files to support multilingual content.

Core Features & Use Cases

  • Selective Installation: Install only NEW sections without overwriting existing components.
  • Page Assembly: Create app/[locale]/[route]/page.tsx with installed sections.
  • i18n Extraction: Extract hardcoded text to de.json and en.json and apply useTranslations.

Quick Start

Provide a page route and a list of sections to install; the skill will install missing components and generate the page with i18n-ready text.

Frequently Asked Questions about install-sections

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate installing shadcnblocks sections and building a multilingual page?

This Skill automates shadcnblocks section installation, assembles them into app/[locale]/[route]/page.tsx, and extracts hardcoded text to i18n JSON files (de.json, en.json) with useTranslations wired throughout, eliminating manual component setup and translation extraction.

Can I install new sections without overwriting existing components?

Yes. The Skill checks components/ for existing sections, installs only NEW sections via pnpm dlx shadcn add, and preserves all existing components during page assembly.

What happens to hardcoded strings when I build a page with this Skill?

Hardcoded strings are automatically extracted to de.json and en.json translation files, and useTranslations hooks are applied across the page so content renders in the user's locale.

Do I need to define branding before using this Skill?

Yes. This Skill applies only after branding is defined; it builds on your existing design tokens and component library to install and arrange new sections in order.

What's the best workflow for assembling a page with multiple sections and translations?

Provide the page route and an ordered list of sections to install. The Skill installs missing sections, creates the page file, and extracts all text to translation files in a single non-destructive pass.