skills.rest
buitrankimlong
buitrankimlongCOMMUNITY
Explore all skills by this author →
GitHub

new-page

Generate Ginfor B2B pages with a consistent design system and i18n keys.

Updated May 30, 2026
Search Tags:#React#TypeScript#design system#page creation#Ginfor B2B
One-click install
npx skills add https://github.com/buitrankimlong/thongtincty --skill new-page-buitrankimlong
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: new-page
Source: https://github.com/buitrankimlong/thongtincty/tree/main/.claude/skills/new-page
Command: npx skills add https://github.com/buitrankimlong/thongtincty --skill new-page-buitrankimlong

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires react-i18next, @shadcn, lucide-react, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill helps in quickly and consistently creating new pages in the Ginfor B2B application, adhering to the defined design system for a professional and unified user experience.

Core Features & Use Cases

  • Design System Compliance: Ensures pages are built in accordance with the specified design system for visual and functional consistency.
  • Scaffold Creation: Generates the basic page structure with predefined components for faster development.
  • Customization Support: Allows for easy customization of page titles, subtitles, and content layout.
  • Use Case: Ideal for new page creations within the app such as reporting sections, company profiles, or user settings pages.

Quick Start

Generate a new page using the new-page skill for your project's specific section by following the guidelines.

Frequently Asked Questions about new-page

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

FAQPage Schema
How do I create new React pages that align with a B2B design system?▼

To create React pages aligned with a B2B design system, this generator automatically scaffolds the page structure with predefined components, layout rules, and i18n keys to ensure visual consistency.

Does this page creation skill support TypeScript and shadcn components?▼

Yes, this page creation skill fully supports TypeScript and React workflows, explicitly integrating shadcn components and lucide-react icons to maintain strict design system compliance.

What is the best way to scaffold a Ginfor B2B reporting section?▼

The best way to scaffold a Ginfor B2B reporting section is to use this skill to generate the base page structure, which automatically configures the layout, titles, and internationalization keys.

How do I add internationalization keys when generating a new web page?▼

When generating a new web page, internationalization keys are automatically included via the react-i18next dependency, ensuring your newly scaffolded page is ready for multilingual support.

Can I customize the layout and titles of the generated React pages?▼

Yes, you can customize the layout, page titles, subtitles, and content structure of the generated React pages, allowing you to adapt the base scaffold for specific features like user settings.

Why does my generated Ginfor B2B page need predefined components?▼

Your generated Ginfor B2B page needs predefined components to guarantee functional and visual consistency across the application, preventing design fragmentation when implementing new features.

Related Skills

Explore More Software Engineering Skills→
MesferAliMesferAli

atlas-ui

Provide guidance on Atlas UI components, theming, forms, and data display.

Community
Intermediate
JeremyDev87JeremyDev87
31

widget-slot-architecture

Build Next.js layouts with Parallel Routes and one-slot-one-widget patterns.

Community
Advanced
mateo19182mateo19182

i18n

Automate React i18n tasks by extracting hardcoded strings and replacing them with translation keys.

Community
Intermediate
hico-mrmgnhico-mrmgn

playwright-test

Create and maintain Playwright end-to-end tests for Next.js, React, or static sites.

Community
Advanced