skills.rest
akkpol
akkpolCOMMUNITY
Explore all skills by this author →
GitHub

frontend-agent

Automate CraftFlow ERP frontend UI/UX implementation with React, Next.js, and Tailwind CSS.

Updated Aug 27, 2026
Search Tags:#ui#frontend#react#nextjs#tailwind#ux#thai-language
One-click install
npx skills add https://github.com/akkpol/crafe-flow-nextjs --skill frontend-agent-akkpol
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-agent
Source: https://github.com/akkpol/crafe-flow-nextjs/tree/main/.codex/skills/frontend-agent
Command: npx skills add https://github.com/akkpol/crafe-flow-nextjs --skill frontend-agent-akkpol

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

CraftFlow ERP frontend development often requires consistent UI/UX implementation across components, pages, and layouts. This skill provides a structured approach using React, Next.js App Router, Tailwind CSS, and the shadcn/ui component library to speed up development while maintaining design coherence and Thai language support.

Core Features & Use Cases

  • Provides a clear component and page scaffolding pattern aligned with CraftFlow design patterns.
  • Defines file ownership and edit/read-only boundaries to streamline collaboration.
  • Supports Thai language UI guidelines and responsive design principles across frontend projects.

Quick Start

Implement the frontend-agent in a CraftFlow project to begin automating UI/UX implementation workflows.

Frequently Asked Questions about frontend-agent

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

FAQPage Schema
How do I automate frontend UI implementation for CraftFlow apps?▼

Automate frontend UI implementation for CraftFlow apps by applying structured React, Next.js App Router, Tailwind CSS, and shadcn/ui patterns. This skill enforces design conventions and Thai language rules to speed up development while maintaining coherence across components, pages, and layouts.

What is the best way to enforce Thai language support in Next.js App Router projects?▼

Enforce Thai language support in Next.js App Router projects by applying specialized UI guidelines and component patterns. This approach ensures Thai language rules are consistently integrated across your frontend components and layouts without manual formatting adjustments.

Can I use shadcn/ui components with Tailwind CSS for responsive CraftFlow ERP layouts?▼

Yes, you can use shadcn/ui components with Tailwind CSS for responsive CraftFlow ERP layouts. This skill provides scaffolding patterns and responsive design principles to guide consistent UI integration and component development across your project.

How do file ownership boundaries streamline React frontend development workflows?▼

File ownership boundaries streamline React frontend development workflows by defining clear edit and read-only zones for components and pages. This structured approach prevents conflicts and ensures consistent UI integration across collaborative CraftFlow projects.

When do I need structured component scaffolding for Next.js and Tailwind CSS?▼

You need structured component scaffolding for Next.js and Tailwind CSS when building CraftFlow ERP interfaces that require consistent design patterns. It provides a clear file ownership model and UI guidelines to maintain coherence across multiple pages and layouts.

Related Skills

Explore More Design & Creative Skills→
agusmdevagusmdev
5

tanstack-shadcn-setup

Configure Tailwind CSS v4 and shadcn/ui for TanStack Start and Router projects.

Community
Advanced
bandofaibandofai
3

Invoice Generation Skill

Generates invoices with tax calculations and ASC 606 revenue recognition.

Community
Intermediate
mcgilly17mcgilly17
2

Next.js 15+ Patterns

Guide Next.js 15+ app development with App Router, Server Components, and Server Actions.

Community
Advanced
MonosenMonosen

tailwind-css-patterns

Apply Tailwind CSS utility patterns to React, Vue, Svelte, or vanilla JavaScript components.

Community
Intermediate