Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Ant Design antd vs antd-mobile for non-native mobile web development

Reading about Ant Design I am getting confused about which library to use for mobile web development. There are two libraries, antd and antd-mobile. While it is clear that antd-mobile supports react-native on iOS and Android, it is unclear which one is best suited for plain mobile (non-native / SPA) web development.

Reading the antd introduction you see statements like "Ant Design which is specially created for internal desktop applications, ...", while reading the antd-mobile introduction you will see "Support Web / iOS / Android platform (Based on React Native)"

From this I would think that ant is somehow not very suitable for web development other than web based desktop (i.e. Elektron) apps.

But trying to build a normal web app with ant-mobile I couldn't get it to work. For example the Button is showing but DatePicker is not. Switching to ant everything seems to work fine.

Am I right to assume that for any non-native mobile development you need to use ant instead of ant-mobile?

If so, what is this supported "Web" platform that antd-mobile is mentioning?

like image 461
Thijs Koerselman Avatar asked Oct 24 '17 22:10

Thijs Koerselman


People also ask

Is ANTD mobile responsive?

Ant Design, referred to as Antd in this context, is a pretty great library. It contains all the components I could need in nice wrapper components that makes developing a UI very simple. One major omission, however, is a responsive mobile header.

What is ANTD mobile?

Ant Design MobileEssential UI blocks for building mobile web apps.

Who uses ANTD?

Created by Chinese conglomerate Alibaba, Ant Design is used by several big names: Alibaba (of course), Tencent, Baidu, and more. While Material-UI remains the most popular React UI library with over 40k stars on Github, Ant Design is currently at a close second, and is quickly closing-in the gap.

Is ANTD a framework?

Ant Design - The world's second most popular React UI framework.


1 Answers

From my experience:

Antd:

Intended for full browser web only (or electron) development, they are no mobile first design, some cases you have to tweak to make you web page look good in mobile.

Antd-mobile:

Antd mobile exports 2 versions of components, the web one (which uses DOM) and the react native version (uses View, Text etc...)

Web version: You can think it's like jQuery Mobile, Sencha Touch etc, it's intended to build pure mobile web page/application, the application that you are going to see in a mobile browser. example, go and open facebook.com, amazon.com with a mobile browser (they look really different then the desktop one).

React Native version: You will use this to build a Mobile App (a hybrid app) that sits in Google Play store/App Store, an app that needs to be installed.

Hope it helps. If I made mistakes please let me know.

like image 147
Yichaoz Avatar answered Sep 19 '22 18:09

Yichaoz