Skip to content
Development
Command

/add-section

Create a reusable page section component with responsive design.

From plugin
larouex-fullstack-builder
881 skills12 agents81 commands

Command definition

add-section.md

Create a reusable page section component with responsive design.

Generate:

  • Section component in /components/sections
  • TypeScript interface for section props (title, subtitle, content, image, CTA)
  • Responsive Bootstrap grid layout (container, row, col)
  • Multiple section variants: hero, features, testimonials, pricing, CTA
  • Content props with flexible structure
  • Image optimization using Next.js Image component
  • Background options (color, gradient, image)
  • Spacing and padding controls
  • Call-to-action button integration
  • Example usage with sample content

Make the section highly customizable and reusable. Include proper semantic HTML (section, article), accessibility features, and mobile-first responsive design. Support both Server and Client Components.

@larouexnonprofitconsulting
Ships withlarouex-fullstack-builder

A comprehensive Claude Code plugin with 81 commands and 12 specialized AI agents for building modern, full-stack web applications with Next.js 15, Azure, Railway, Bootstrap, and TypeScript.

Stars on GitHub

Momentum

stars in total
8
Star history of LarouexNonprofitConsulting/larouex-fullstack-plugin on GitHub, a chart by star-history.com

Other commands on larouex-fullstack-builder.

More commands from other plugins.

build
Auto-invoked

build

Command

Implement tasks incrementally — build, test, verify, commit. Add "auto" to run the whole plan in one approved pass.

@addyosmani@addyosmaniInstall Command