Ant Design | BestHub

Rare Earth Juejin Tech Community

May 6, 2025 · Frontend Development

Ant Design Component Model Context Protocol (MCP) Service: Design, Implementation, and Usage Guide

This article details the design, implementation, and practical usage of a Model Context Protocol (MCP) service for Ant Design components, explaining how to extract component documentation, define MCP tools and prompts, integrate with AI models like Claude, and improve frontend development efficiency.

AIAnt DesignMCP

0 likes · 21 min read

Ant Design Component Model Context Protocol (MCP) Service: Design, Implementation, and Usage Guide

Rare Earth Juejin Tech Community

Apr 19, 2025 · Frontend Development

Using MasterGo MCP with Cursor to Generate Frontend Code from DSL

This guide explains how to obtain a token, install MasterGo MCP in Cursor, configure the mcp.json file, and use the provided getDSL and getComponentLink tools to retrieve design canvas DSL and generate front‑end code such as React, Vue, or Flutter components.

Ant DesignCursorDSL

0 likes · 6 min read

Using MasterGo MCP with Cursor to Generate Frontend Code from DSL

Rare Earth Juejin Tech Community

Feb 18, 2025 · Frontend Development

Comprehensive Guide to RTL Support in CSS and Frontend Development

This article explains the challenges of Right‑To‑Left (RTL) layout adaptation, compares three implementation strategies—including CSS logical properties, transform scaling, and manual RTL code—and demonstrates how tools like rtlcss, Tailwind, and Ant Design can automate or simplify RTL support for modern web projects.

Ant DesignCSSLogical Properties

0 likes · 20 min read

Comprehensive Guide to RTL Support in CSS and Frontend Development

大转转FE

Oct 18, 2024 · Frontend Development

Design and Implementation of ZhiZhu Customer Service Workbench

This article explains the architecture and key features of ZhiZhu's customer service workbench, covering the overall system, the iframe‑based IM communication, multi‑tab third‑screen design, conversation caching with LRU, and full‑event tracking implementation using React, Umi and Ant Design.

Ant DesignCustomer ServiceReact

0 likes · 11 min read

Design and Implementation of ZhiZhu Customer Service Workbench

Rare Earth Juejin Tech Community

Apr 13, 2024 · Frontend Development

Implementing a Custom OnBoarding Tour Component with Ant Design 5 in React

This article walks through building a reusable OnBoarding (tour) component for React applications using Ant Design 5, explaining the underlying mask technique, step management, animation handling, resize observation, and providing complete source code and usage examples.

Ant DesignReactTour Component

0 likes · 14 min read

Implementing a Custom OnBoarding Tour Component with Ant Design 5 in React

Rare Earth Juejin Tech Community

Apr 1, 2024 · Frontend Development

Resolving Large Number Precision Issues in Ant Design Table Selection Popup

During a daily stand‑up, a team member struggled with a bug where a data‑selection modal using Ant Design's Table failed to display selected rows correctly due to large numeric IDs losing precision in JavaScript, and the issue was resolved by preventing automatic JSON parsing of 16‑digit strings.

Ant DesignJSON parseJavaScript

0 likes · 5 min read

ByteFE

Jan 25, 2024 · Frontend Development

Building a Screen Recording Application with Electron, React, Vite, and FFmpeg

This tutorial walks through creating a desktop screen‑recording tool using Electron with a React‑Vite front‑end, Ant Design UI, IPC communication, system‑tray controls, draggable windows, and FFmpeg for capturing video in WebM, MP4, or GIF formats.

Ant DesignElectronFFmpeg

0 likes · 8 min read

Building a Screen Recording Application with Electron, React, Vite, and FFmpeg

Rare Earth Juejin Tech Community

Jan 11, 2024 · Frontend Development

Ant Design Theme Customization: From Less Variables to CSS‑in‑JS and Performance Strategies

This article examines the evolution of Ant Design's theming—from the less‑based Antd 4.x approach to the CSS‑in‑JS design‑token system in Antd 5.x—analyzes the performance trade‑offs of CSS‑in‑JS, and presents the official antd‑style solution for high‑performance, extensible, and compatible style overrides.

Ant DesignCSS-in-JSTheme Customization

0 likes · 18 min read

Ant Design Theme Customization: From Less Variables to CSS‑in‑JS and Performance Strategies

政采云技术

Dec 21, 2023 · Frontend Development

Understanding Controlled and Uncontrolled Forms in React: Ant Design, Hooks, and React‑Hook‑Form

This article explains the concepts, use‑cases, and performance trade‑offs of controlled versus uncontrolled forms in React, demonstrates how Ant Design 3 and 4 implement form handling with HOC or Context + hooks, and introduces the lightweight, non‑controlled approach of react‑hook‑form with practical code examples.

Ant DesignControlledForms

0 likes · 12 min read

Understanding Controlled and Uncontrolled Forms in React: Ant Design, Hooks, and React‑Hook‑Form

Rare Earth Juejin Tech Community

Dec 7, 2023 · Frontend Development

Custom Ant Design Select Component with Integrated Table and Dumi Documentation Guide

This article explains how to create custom Ant Design select components that display additional information via integrated tables, covering form implementation, basic and advanced versions with infinite scrolling, handling Ant Design bugs, and documenting the components using Dumi, complete with code examples.

Ant DesignCustom SelectReact

0 likes · 26 min read

Custom Ant Design Select Component with Integrated Table and Dumi Documentation Guide

Rare Earth Juejin Tech Community

Aug 8, 2023 · Frontend Development

Best Practices for Ant Design Forms, Dynamic Form Handling, and Component Organization in React

This article reviews practical guidelines for building maintainable Ant Design forms in React, covering layout strategies, dynamic form techniques, component encapsulation, table and tab implementations, CSS styling conventions, architecture considerations, and custom hooks to improve code quality and developer productivity.

Ant DesignDynamic FormJavaScript

0 likes · 17 min read

Best Practices for Ant Design Forms, Dynamic Form Handling, and Component Organization in React

Rare Earth Juejin Tech Community

Nov 22, 2022 · Frontend Development

Building a Management Backend with Ant Design 5, React 18, Vite, and TypeScript

This article explains why Ant Design 5 is preferred over MUI, then walks through configuring Vite and tsconfig, creating login and home pages, designing a recursive routing system, implementing lazy loading, menu generation, route listening hooks, tab management with KeepAlive, theme customization, and dynamic routing with React Router 6.4.3 for a full‑featured admin dashboard.

Ant DesignReactRouting

0 likes · 17 min read

Building a Management Backend with Ant Design 5, React 18, Vite, and TypeScript

政采云技术

Jul 12, 2022 · Frontend Development

Configurable Form Data Design for React/Ant Design Projects

This article introduces a lightweight, configuration‑driven approach to building form fields in React using Ant Design, showing how to replace repetitive FormItem code with a declarative schema, handle edit/detail modes, render different component types, and apply common validation rules.

Ant DesignForm ConfigurationJavaScript

0 likes · 12 min read

Configurable Form Data Design for React/Ant Design Projects

Laiye Technology Team

Apr 15, 2022 · Frontend Development

Improving Maintainability of an Ant Design‑Based Component Library with HoC, Dumi, and Monorepo

This article describes how a company refactored its Ant Design‑based React component library by standardizing on higher‑order component wrappers, adopting the dumi documentation tool, and organizing the codebase with a Lerna‑Yarn monorepo, resulting in significantly improved maintainability and developer efficiency.

Ant DesignHOCMonorepo

0 likes · 9 min read

Improving Maintainability of an Ant Design‑Based Component Library with HoC, Dumi, and Monorepo

ByteFE

Dec 13, 2021 · Frontend Development

Unified Route, Menu, and Breadcrumb Configuration for a React + Ant Design Admin Project

This article demonstrates how to centralize route, menu, permission, and breadcrumb definitions in a React and Ant Design based admin application by using nested configuration objects, flattening utilities, and dynamic lookup functions to reduce duplication and simplify maintenance.

Ant DesignBreadcrumbReact

0 likes · 13 min read

Unified Route, Menu, and Breadcrumb Configuration for a React + Ant Design Admin Project

政采云技术

Jul 13, 2021 · Frontend Development

Understanding rc-form: Internals, APIs, and Usage in React Forms

This article provides a comprehensive overview of rc-form, a React library used by Ant Design to manage form state, validation, and data collection, explaining why it is needed, its core APIs, practical usage examples, and a deep dive into its internal implementation.

Ant DesignJavaScriptReact

0 likes · 19 min read

Understanding rc-form: Internals, APIs, and Usage in React Forms

ByteFE

Mar 22, 2021 · Frontend Development

Table Virtualization Practices in React Ant Design: Approaches and Lessons

This article examines the challenges of virtualizing large Ant Design tables in a React+Umi stack, outlines three internal implementation strategies, discusses common pitfalls such as blank flicker and column fixing, and recommends open‑source alternatives for efficient table rendering.

Ant DesignReactTable Virtualization

0 likes · 13 min read

Table Virtualization Practices in React Ant Design: Approaches and Lessons

AntTech

Jan 29, 2021 · Frontend Development

Invisible Design System: Ant Design’s Engineering Approach to Design Asset Management

This article introduces Ant Design’s Invisible Design System, explaining how design asset management and engineering rules (ETCG) are explored to create unified, hidden guidelines that improve component consistency, workflow efficiency, and collaboration, and outlines the open‑source plan, Kitchen tool, and community initiatives for frontend development.

Ant DesignDesign OpsOpen-source

0 likes · 14 min read

Invisible Design System: Ant Design’s Engineering Approach to Design Asset Management

AntTech

Oct 28, 2020 · Frontend Development

Ant Design 4.0: Design Philosophy of Happy Work and the ETCG 2.0 Methodology

The talk explains Ant Design's core assumption that everyone seeks happy work, outlines its four design values, introduces the ETCG 2.0 methodology for consistent component design, and discusses how natural, deterministic interactions can make digital products feel more intuitive and enjoyable.

Ant DesignDesign PhilosophyETCG

0 likes · 14 min read

Ant Design 4.0: Design Philosophy of Happy Work and the ETCG 2.0 Methodology

Fulu Network R&D Team

Oct 22, 2020 · Frontend Development

Frontend Technology Stack and Project Structure Guide for React‑Based Merchant Applications

This article introduces the essential frontend technology stack—including React, Webpack, Ant Design, DVA, ES6, and Axios—explains the typical project directory layout, walks through source code organization, and provides practical steps and tips for building merchant‑side applications with a React‑DVA architecture.

Ant DesignAxiosDVA

0 likes · 15 min read

Frontend Technology Stack and Project Structure Guide for React‑Based Merchant Applications