skills.rest
meriley
merileyCOMMUNITY
Explore all skills by this author →
GitHub

vendure-admin-ui-writing

Generate Vendure Admin UI extensions with React components and GraphQL hooks.

Updated Aug 27, 2026
Search Tags:#typescript#react#graphql#ui development#admin ui#vendure
One-click install
npx skills add https://github.com/meriley/claude-code-skills --skill vendure-admin-ui-writing
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: vendure-admin-ui-writing
Source: https://github.com/meriley/claude-code-skills/tree/main/skills/vendure-admin-ui-writing
Command: npx skills add https://github.com/meriley/claude-code-skills --skill vendure-admin-ui-writing

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines the development of custom user interfaces within the Vendure Admin Panel, enabling the creation of rich, interactive extensions.

Core Features & Use Cases

  • Component Development: Create React components for new Admin UI sections.
  • Route Registration: Define and register new routes within the Admin UI.
  • Navigation Integration: Add custom menu items to the Admin UI navigation.
  • Data Fetching: Integrate with Vendure's GraphQL API using provided hooks (useQuery, useMutation).
  • Use Case: When developing a new feature for a Vendure e-commerce store that requires a dedicated section in the admin panel for managing custom product attributes, use this skill to build the necessary UI components, routes, and navigation links.

Quick Start

Use the vendure-admin-ui-writing skill to create a new React component for the Vendure Admin UI that displays a list of custom items.

Frequently Asked Questions about vendure-admin-ui-writing

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

FAQPage Schema
How do I build a custom admin UI extension for Vendure?▼

To build a Vendure admin UI extension, you create React components, register new routes, and integrate navigation menu items. You can also use GraphQL hooks like useQuery and useMutation for data fetching and mutations within the admin panel.

How do I add a custom navigation menu item to the Vendure Admin Panel?▼

Adding a custom navigation menu item to the Vendure Admin Panel involves defining route registration and integrating it with the navigation. This allows you to build dedicated sections for managing custom e-commerce features directly within the interface.

Can I use GraphQL hooks to fetch data in Vendure admin extensions?▼

Yes, you can use GraphQL hooks like useQuery and useMutation to fetch and mutate data in Vendure admin extensions. This allows your custom React components to interact directly with the Vendure GraphQL API for seamless e-commerce management.

Does building a Vendure Admin UI extension require TypeScript and React?▼

Building a Vendure Admin UI extension uses React for component development and TypeScript, alongside GraphQL for data fetching. These technologies are used to create rich, interactive features within the admin panel.

How do I inject services into my custom Vendure admin React components?▼

You inject services into custom Vendure admin React components using the useInjector hook. This facilitates service injection, allowing your extensions to access and interact with internal Vendure functionalities.

Related Skills

Explore More Software Engineering Skills→
lenneTechlenneTech

claude-code-plugin-expert

Enforces official Claude Code plugin development best practices across plugin components.

Official
Advanced
phuong-nam-devphuong-nam-dev

Migrating to Vendure Dashboard

Migrates Vendure Admin UI extensions from Angular to the React Dashboard.

Community
Advanced
markus41markus41
1

graphql

Create GraphQL schemas, resolvers, queries, mutations, and subscriptions.

Community
Intermediate
vuminhieuvuminhieu

shopify

Guide Shopify app, extension, and theme development using GraphQL and REST Admin APIs.

Community
Advanced