frontend-development

Build React and Shopify Polaris admin app frontends with API hooks, i18n, and loadable components.

Updated Jan 31, 2026
One-click install
npx skills add https://github.com/nhson2612/__ --skill frontend-development-nhson2612
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-development
Source: https://github.com/nhson2612/__/tree/main/.claude/skills/frontend
Command: npx skills add https://github.com/nhson2612/__ --skill frontend-development-nhson2612

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a structured approach and reusable patterns for developing the frontend of Shopify embedded admin applications, ensuring consistency and efficiency.

Core Features & Use Cases

  • React + Polaris Components: Utilizes Shopify's Polaris design system for a native look and feel.
  • API Hooks: Simplifies data fetching, creation, editing, and deletion with custom hooks.
  • Internationalization (i18n): Manages translations for multi-language support.
  • Code Splitting: Implements loadable components for optimized performance.
  • Use Case: Develop a new settings page for an app, including form inputs, data saving, and internationalized labels, following the provided patterns.

Quick Start

Follow the development commands to start building your embedded app frontend.

Frequently Asked Questions about frontend-development

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

FAQPage Schema
How do I build a Shopify embedded admin app frontend with React and Polaris?

You build a Shopify embedded admin app frontend by applying the provided React and Polaris component patterns, which include reusable API hooks for data management, i18n for translations, and loadable components for code splitting.

What is the best way to manage data fetching in a Shopify Polaris admin application?

The best way to manage data fetching, creation, editing, and deletion in a Shopify Polaris application is by using the custom reusable API hooks provided by this Skill to simplify data operations.

How do I add internationalization (i18n) to a Shopify admin app?

To add internationalization to a Shopify admin app, implement the i18n patterns included in this Skill to manage translations and provide multi-language support for your application's labels and text.

Can I use loadable components for code splitting in my React Shopify app?

Yes, you can use loadable components for code splitting in your React Shopify app to optimize performance, as this Skill implements loadable components specifically for this purpose within the Shopify ecosystem.

Does this Skill provide patterns for creating a new settings page with form inputs and data saving?

Yes, this Skill provides patterns for developing a new settings page for an app, including form inputs, data saving, and internationalized labels, following the provided React and Polaris guidelines.