webdesign

Design, implement, and validate accessible React/Next.js web interfaces with TanStack.

5|Updated May 2, 2026

Search Tags:#design #testing #accessibility #frontend #react #tanstack #next.js

Ready to run

npx skills add https://github.com/vanducng/skills --skill webdesign-vanducng

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: webdesign
Source: https://github.com/vanducng/skills/tree/main/skills/webdesign
Command: npx skills add https://github.com/vanducng/skills --skill webdesign-vanducng

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Design, build, and validate polished, accessible, and responsive web user interfaces in React/Next.js ecosystems.

Core Features & Use Cases

Design quality and accessibility audits for frontend interfaces.
Guidance for React/Next.js apps, TanStack routing/forms/tables, and testing workflows.
Optional Three.js/WebGL scenes for rich visual experiences.

Quick Start

Provide a plan to build a responsive, accessible web UI using Next.js or React with TanStack patterns and automated testing.

Frequently Asked Questions about webdesign

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

FAQPage Schema

How do I build an accessible and responsive web UI with React and Next.js?▼

To build an accessible and responsive web UI with React and Next.js, you need a plan that aligns with design-quality guidelines, app-framework references, and cross-device verification to ensure your polished interfaces are validated for accessibility and responsiveness across target devices.

What is the best way to integrate TanStack routing and forms in a Next.js frontend?▼

The best way to integrate TanStack routing and forms in a Next.js frontend is to follow established TanStack practices alongside your app-framework references to ensure validated state management and routing behaviors are correctly implemented within your React components.

How do I set up automated testing workflows for React and TanStack applications?▼

To set up automated testing workflows for React and TanStack applications, implement defined testing strategies that include UI testing and performance checks to verify your frontend tasks deliver functional, validated user interfaces across different environments.

Can I add Three.js WebGL scenes to my React or Next.js web interface?▼

Yes, you can add Three.js WebGL scenes to your React or Next.js web interface for rich visual experiences, integrating into your frontend stack while maintaining alignment with overall design-quality and accessibility guidelines.

Does this approach support accessibility audits for existing frontend interfaces?▼

Yes, this approach supports accessibility audits for existing frontend interfaces by validating them against design-quality guidelines, identifying accessibility gaps and providing cross-device verification to ensure polished, compliant UI delivery.