Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Show HN: Antd – A set of high-quality React components

ant.design

Post reply on HN
Print view View original

71–80 of 107 posts

Re: Show HN: Antd – A set of high-quality React components

#71

Post by just-boris »

mxstbr wrote: post #62
just-boris wrote: post #60

Earlier quoted context omitted.

Hello! I've been using Antd components for the last year in some my project. All components are also available here[0] as single modules for better reusability and customization. Currently, I have solved all my theming goals with Plain CSS. For each component, that I'd like to customize I created a wrapper import Slider from 'rc-slider'; function StyledSlider(props) { return } Then in CSS .my-slider .rc-slider-track…

We're currently writing some documentation specifically pertaining to theming third-party component libraries, which you can read the WIP of here: https://github.com/styled-components/styled-components-exper... The TL;DR is that this customization guide will suddenly become really easy. Antd can specify a default theme and users can override the parts of the default theme they want! All the user has to do is pass a s…

The ability to apply different overrides for some branches in a component tree is powerful. Sure, I will come back to styled-components when I will get that issue.

Currently, I (as well as most users, I suppose) just need to apply some global color overrides to match with company's brand guidelines that I can solve it with old good plain CSS.

Also, for big projects, like Antd, transition to some other CSS-tooling almost impossible, because CSS/LESS code is spread across several repositories and will take a lot of efforts and time.

And finally, the current implementation is better because it doesn't mention styles in Javascript at all, so the library users are able to choose any way to style components without extra efforts from the side of library authors.

Re: Show HN: Antd – A set of high-quality React components

#72

Post by benjy_c »

chrismorgan wrote: post #70

This stuff is horrible to use from the keyboard visually, because outlines have been removed without an adequate replacement. Please fix the styles for :focus et al. Make it all obvious, like Microsoft have done in Windows 10 (they have what is pretty much just a 2px solid black outline).

a11y optimization is in progress, but it is not a high priority job.

Re: Show HN: Antd – A set of high-quality React components

#73

Post by Keats »

griffinmichl wrote: post #35
Illniyar wrote: post #32

Earlier quoted context omitted.

SCSS (and to a lesser degree LESS) are basically industry standard now, if you are using react, you are almost certainly using one of the two preprocessors. I don't think your complaint is relevant here, especially since you provide no solution. It bothers me that this reply is at the top of the comments.

I don't really see much of a need for preprocessors w/ css modules, post css, css in js, etc. It seems like preprocessors are becoming less popular, not more.

Looks like their (at least node-sass) popularity is growing: https://npm-stat.com/charts.html?package=node-sass&from=2015...

I use libsass and postcss combined and pretty happy about it.

Re: Show HN: Antd – A set of high-quality React components

#74

Post by mxstbr »

just-boris wrote: post #71
mxstbr wrote: post #62

Earlier quoted context omitted.

We're currently writing some documentation specifically pertaining to theming third-party component libraries, which you can read the WIP of here: https://github.com/styled-components/styled-components-exper... The TL;DR is that this customization guide will suddenly become really easy. Antd can specify a default theme and users can override the parts of the default theme they want! All the user has to do is pass a s…

The ability to apply different overrides for some branches in a component tree is powerful. Sure, I will come back to styled-components when I will get that issue. Currently, I (as well as most users, I suppose) just need to apply some global color overrides to match with company's brand guidelines that I can solve it with old good plain CSS. Also, for big projects, like Antd, transition to some other CSS-tooling alm…

You can choose to style styled components any way you want too! You can pass in class names, inline styles, whatever you want just works. No need to be aware of styled-components from the user side at all.

Imagine Button being a styled component, all of the usual methods work perfectly fine:

    import Button from 'antd';
You say "just" apply some global color overrides, but to "just" apply some global color overrides you need to use webpack (using another bundler? Sorry, antd is not for you) and use atool-build or have to configure webpack to work the way they need it to.

Or you create a custom less file, but that means you'll load all the styling for all components even though you really only wanted to use e.g. the Button.

That's not really "just" overriding a global color, is it? ;-)

I'm not saying this is a trivial change at all by the way, I understand the cost of it since I'm doing it for ElementalUI. I don't know if the antd maitainers will consider it worth it, that's another discussion.

Re: Show HN: Antd – A set of high-quality React components

#75

Post by mlsarecmg »

z3t4 wrote: post #59

The design is good. It look nice! But it is very heavy compared to native HTML and CSS. It's like taking a space ship, to go visit your neighbor.

It's actually super light, i don't know where you got the impression that it's heavy. This is not a monolith but a modular kit - you only load what you use which makes it different from many other UI kits which give you megabytes of CSS on first load.

Also, this is native HTML and CSS of course, with proper definition, types and handlers laying out what the component can do:

https://github.com/ant-design/ant-design/blob/master/compone...

https://github.com/ant-design/ant-design/blob/master/compone...

Resulting in: https://ant.design/components/button/

Re: Show HN: Antd – A set of high-quality React components

#77

Post by iampherocity »

I like it, there have been a couple projects where this would have cut time in half.

Some of the controls were hard to navigate on an iPad Pro. Time in particular was hard to use, not enough space. This is a fault of the resolution of the pro, but if the targets aren't big enough, I'm scrolling the page instead of the hours.

Re: Show HN: Antd – A set of high-quality React components

#78

Post by kimshibal »

gustix wrote: post #69
floatrock wrote: post #8

For those wondering who it comes from, https://ant.design/docs/spec/introduce#Who-are-using-Ant-Des... The first (and presumably namesake) company is Ant Financial https://www.antgroup.com , which is described as: > Ant Financial Services Group ("Ant Financial"), was officially founded in October 2014 and originated from Alipay which is the world's leading third-party payment platform founded in 2004. So basically if…

Alibaba is also working on a ReactNative competitor for Vue, called Weex: https://alibaba.github.io/weex/

we are using Weex for our app on production. Weex is pretty solid platform

Re: Show HN: Antd – A set of high-quality React components

#79

Post by mlsarecmg »

dczot wrote: post #28
electic wrote: post #12

I was wondering if someone who is good at JS can compare this to BluePrint[1]? [1] https://github.com/palantir/blueprint

Blueprint is meant for desktop applications. For example, Electron apps. You'll notice Blueprint tries to give that desktop app feel, versus Antd, which does not.

I don't know, i think antd is easily suitable for desktop-like applications: http://i.imgur.com/5WN5WHE.jpg

Re: Show HN: Antd – A set of high-quality React components

#80

Post by [deleted] »

secoif wrote: post #11

These components look and work great, but unfortunately are a real headache to retheme unless you want to pull in a sass/less toolchain in addition to what you're currently using. This is a pain in the ass if you already have your theme variables set up in one compiles-to-CSS language. There is a standard for CSS variables and a very functional subset of their functionality can be compiled for older browsers at build…

[deleted]
Post reply on HN