Ant Design 4.0 rewrites components for easier web app designing

Share
  • February 28, 2020
Technology

Ant Design is a UI design system and React UI library written in Typescript used for building enterprise-level web applications. Its newest release, Ant Design 4.0, is the result of collected feedback, developer contributions, and over a month of work.

Used by companies such as Alibaba, Tencent, and Baidu, Ant Design includes React components out of the box for easier app development.

Take a brief tech tour and see what the latest version brings to the table.

SEE ALSO: Ionic 5: Develop cross-platform apps with new, custom animations

Version 4.0 changes

Ant Design 4.0 released on February 28, 2020, adding new updates with only a few breaking changes.

The highlights introduced include:

  • Visual improvements: Base rounded corners are reduced from 4 pixels to 2 pixels for streamlined visual efficiency and cleaner visuals. Shadows also receive a visual upgrade and are now more consistent.
  • Dark theme: Change to the new color system by clicking the switch theme function.
  • New borderless style
  • Minimum React version upgraded: React 16.9 or newer required
  • Ended support for IE 9/10: All modern browsers and IE 11 (with polyfills) are compatible
  • Rewritten Form component: Simplify your code with a form instance by directly binding data through the name property of Form.Item
  • Smaller size: Reduced default package size and gzipped bundle size
  • Virtual scrolling component: View the live demo
  • New calendar: Rewritten date component introduces new DatePicker, TimePicker, and calendar with an optimized range selector
  • sticky style tables: New table style reduces performance consumption
  • New summary API
  • Discarded legacy icons

Refer to the 4.0 changelog for further information about all the new changes.

     

    International JavaScript Conference
    Manfred Steyer

    The Future of Angular and your Architectures with Ivy

    by Manfred Steyer (SOFTWAREarchitekt.at)

    Andrey Goncharov

    React: Lifting state up is killing your app

    by Andrey Goncharov (Hazelcast)

    IJS 2020 Program »

     

    Ant Design overview

    According to its README, the main features of Ant Design:

    🌈 Enterprise-class UI designed for web applications.

    📦 A set of high-quality React components out of the box.

    🛡 Written in TypeScript with predictable static types.

    ⚙ Whole package of design resources and development tools.

    🌍 Internationalization support for dozens of languages.

    🎨 Powerful theme customization in every detail.

    Its design values prioritize design standards that encourage natural user behavior and an object-oriented approach. Ant Design aims to avoid complicated, messy designs and focuses on ensuring user certainty with consistent appearances.

    Leverage libraries such as Ant Motion, a library for creating smooth, concise animation and motion.

    Browse some of its cases and examples to see how businesses use it and be sure to read up on its design values and discover what design solutions it can provide.

    Upgrade to v4

    For previous Ant Design users, follow the migration guide and upgrade from antd 3.x to antd 4.x. Refer to the incompatible changes introduced in v4, as some incompatible APIs from v3 have been removed. You will need to upgrade to React 16.12.0 or newer in preparation.

    New users can follow the getting started guide, complete with examples. Read the documentation for information about its components, such as buttons and vector icons.

    Newcomers to the tool should also check out the list of Ant Design resources on GitHub and begin creating your own app with the help of tools, utilities, and theme templates.

    The post Ant Design 4.0 rewrites components for easier web app designing appeared first on JAXenter.

Source : JAXenter

You may also like...