Lock in $30 Savings on PRO—Offer Ends Soon! ⏳
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
antd at qcon2016
Search
yiminghe
April 22, 2016
Technology
1
230
antd at qcon2016
yiminghe
April 22, 2016
Tweet
Share
More Decks by yiminghe
See All by yiminghe
小程序终端技术架构
yiminghe
0
240
支付宝小程序的开放架构
yiminghe
0
190
gitc2016 react based architecture
yiminghe
1
170
react-based architecture
yiminghe
2
160
React Ecosystem At Ant Financial
yiminghe
4
2.3k
ant design preview
yiminghe
1
310
react best practice
yiminghe
3
220
react at alipay
yiminghe
43
4.4k
form validation in react
yiminghe
4
560
Other Decks in Technology
See All in Technology
M&Aで拡大し続けるGENDAのデータ活用を促すためのDatabricks権限管理 / AEON TECH HUB #22
genda
0
230
"人"が頑張るAI駆動開発
yokomachi
1
120
Oracle Database@Azure:サービス概要のご紹介
oracle4engineer
PRO
2
190
Oracle Database@AWS:サービス概要のご紹介
oracle4engineer
PRO
1
400
AI with TiDD
shiraji
1
270
シニアソフトウェアエンジニアになるためには
kworkdev
PRO
3
270
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
9.9k
通勤手当申請チェックエージェント開発のリアル
whisaiyo
3
440
Strands Agents × インタリーブ思考 で変わるAIエージェント設計 / Strands Agents x Interleaved Thinking AI Agents
takanorig
4
2k
日本の AI 開発と世界の潮流 / GenAI Development in Japan
hariby
1
360
事業の財務責任に向き合うリクルートデータプラットフォームのFinOps
recruitengineers
PRO
2
190
AWSに革命を起こすかもしれない新サービス・アップデートについてのお話
yama3133
0
500
Featured
See All Featured
sira's awesome portfolio website redesign presentation
elsirapls
0
89
Building Flexible Design Systems
yeseniaperezcruz
330
39k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
150
The agentic SEO stack - context over prompts
schlessera
0
560
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
akademiya2063
PRO
0
31
Optimising Largest Contentful Paint
csswizardry
37
3.5k
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
120
The Language of Interfaces
destraynor
162
25k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
69
Darren the Foodie - Storyboard
khoart
PRO
0
1.9k
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
0
100
Transcript
ᡶᡵᰂ๐ڹᒒૡᑕ 不只是组件库 React Ant Design ࣁᡶᡵᰂ๐ጱਫ᪢ ؇ݦ | afc163
不只是组件库 React Ant Design ࣁᡶᡵᰂ๐ጱਫ᪢ ᡶᡵᰂ๐ڹᒒૡᑕ 2011 ଙےفඪ՞ਪ ֛ḵದ᮱ᕣᒒದᕟ
؇ݦ | afc163
React 和 Ant Design 在蚂蚁金服的实践 ᡶᡵᰂ๐ڹᒒૡᑕ 2011 ଙےفඪ՞ਪ ֛ḵದ᮱ᕣᒒದᕟ ᳩ๗ᨮᨱڹᒒचᏐᔄପ
& ૡٍᎸݎ ؇ݦ | afc163
antd რᕪ០ԏ᭲ ݒᬢ Ӿݣᦡᦇ React ದ Ꮈݎཛྷୗ
Ꮈݎཛྷୗ փᕹ ڹᒒ ᦡᦇ Ծߝᕪቘ ၥᦶ ݸᒒ + + +
+ ဋ᭗౮ṛ ӧᭇݳӾݣᎸݎᜓॵ ᩒრኒ᷀
ڹᒒ ᦡᦇ Ծߝᕪቘ ၥᦶ ݸᒒ + + + ဋ᭗౮ṛ ӧᭇݳӾݣᎸݎᜓॵ
ᩒრኒ᷀ ӱۓࢫᴚ
+ + + ဋ᭗౮ ṛ + + + ဋ᭗౮ ṛ
+ + + ဋ᭗౮ ṛ + + + ဋ᭗౮ ṛ + + + ဋ᭗౮ ṛ + + + ဋ᭗౮ ṛ
+ + + ဋ + + + ဋ + +
+ ဋ + + + ဋ + + + ဋ + + + ဋ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
None
None
ᑏۖၵᄤᤪ PC ڹᒒݎ݄֜֜Ҙ
ᬩ០ଘݣ හഝଘݣ ਮಁӾݣ CRM ૡᑕଘݣ ૡᑕଘݣ մӱᓕቘ ๐ۓလቘ ᬩᖌᔮᕹ ਮ๐Ӿஞ
ݍḇଘݣ
մӱӾݣኼ ٩ઊԆᥝࣁᶎӥ
ই֜ࣁᩒრᔲᗌጱఘ٭ӥඪ೮य़ᰁӾݸݣԾߝ ّᶶᎸݎපሲአಁ֛ḵҘ Ӿ।᮷٬ਧԧ֦҅ժ؉ᶭᶎ “ ”
Ӿ।᮷٬ਧԧ֦҅ժ؉ᶭᶎ “ ” Ծߝᕪቘ قݎ +
Ծߝᕪቘ قݎ + Ӿ।᮷٬ਧԧ֦҅ժ؉ᶭᶎ “ ”
قᎸݎཛྷୗ Ծߝᕪቘ قݎ + ڹᒒ & ᦡᦇचᏐᦡෞ
ᩒრࣳࢫᴚ ๐ۓࣳࢫᴚ
चᏐڹᒒૡᑕ + ӱۓڹᒒૡᑕ ᦡᦇ + ದԾߝڹᒒૡᑕ + +
antd რᕪ០ԏ᭲ ݒᬢ Ӿݣᦡᦇ React ದ Ꮈݎཛྷୗ
Ant Design ӞӻӾݣᦡᦇ
ᡶᡵᰂᣟԯ ଠာጱӾݣԾߝ ᦡᦇᥢ ᦡᦇ ᕟկ ᦡᦇ ܻڞ ཛྷୗ ဃႚ ૡٍ
ङᦒ
ᕟկ ᦡᦇ ܻڞ ཛྷୗ ဃႚ ૡٍ ङᦒ ᡶᡵᰂᣟԯ ଠာጱӾݣԾߝ ᦡᦇᥢ
ᦡᦇ
ਫአԆԎ ੜᘒᗦ ᕹӞ Ի 50+ चᏐᕟկ ۖኮ
None
None
ᦡᦇದᕮݳ አݶጱᦾ +
ӥᭌೠ Select ӥោܔ Dropdown
Ԇᜋ @brand-color-1 ᴢ @shadow-1
᭦ᬋ۸ጱᦡᦇᥢڞ لୗ۸ ᜋ Յੂ ᪗ᐶ
Normal Hover Active
tint(@primary-color, 80%) shade(@primary-color, 80%)
None
None
AntD icons Alipay icons PNG 25 Alipay icons Alipay icons
Ant Desgin AntD for Mobile Ant Desgin 主按钮 次按钮 幽灵按钮 失效按钮 中号按钮 按钮一 按钮二 按钮三 请选择 请选择 请选择 请输入 请输入 开 开 关
ᔜߝཛྷୗ ᥢཛྷୗ ӫӱڹᒒ+ᦡᦇ᯿ଶ݇Ө ىဳአಁ֛ḵ ىဳԾߝᤒሿێ ૡᑕ҈PD ԅԆ҄ᦡᦇᬀ ๐ۓཛྷୗ ӫ ّ
᭽᭗አᦡᦇᥢ ىဳᎸݎපሲ ّᶶአಁ֛ḵ
None
antd რᕪ០ԏ᭲ ݒᬢ Ӿݣᦡᦇ React ದ Ꮈݎཛྷୗ
෯ጱದ ದᘌ۸ ᖌಷۖێӧ᪃ ᗌᐒ܄ Arale Alice spm Sea.js
ದᘌ۸ ᖌಷۖێӧ᪃ ᗌᐒ܄ Arale Alice spm Sea.js
ڹᒒದᄤၞ ೮ԋጱኞێ ᐒ܄ᕁڥ ಼ React რᐒ܄
ڹᒒದᄤၞ ೮ԋጱኞێ ᐒ܄ᕁڥ ಼ React რᐒ܄ ᭜ᭇݳقݎጱڹᒒचᏐᦡෞ
᭜ᭇݳقݎጱڹᒒचᏐᦡෞ ڹᒒದᄤၞ ೮ԋጱኞێ ᐒ܄ᕁڥ
ES2015
None
react-component antd UI ᕟկ
react-component antd UI ᕟկ
ਧ֖ ׀ବ੶ۑᚆ ਠ࠺ጱॺկ ୗ चᏐ݇ᘍୗ ᕹӞጱᦡᦇᥢ ᯈᗝ ୩य̵़॔ ᔜᓌ
ṛᴤ҅॔ ᔜᗦ҅ᶎݻڡᕆአಁ ಘ ṛ ֗ react-component antd
UI ᕟկ
ૡ֢ၞ ant-tool
ӥӞդᡶᡵڹᒒݎૡٍ ant-tool
HMR դቘ හഝ MOCK ୌ UI ၥᦶ හഝၞ ᓕቘ ᐶᕚ۱
ݎ դᎱ ᥢ ᚕಋຝ
ᚕಋຝ HMR դቘ හഝ MOCK ୌ UI ၥᦶ හഝၞ ᓕቘ
ᐶᕚ۱ ݎ դᎱ ᥢ
None
ݢൊጱ npm package
ֵአفݗ
ଫአຝ մӱᕆԾߝݎᵱᥝմӱᕆጱڹᒒଫአຝ ಅํጱդᎱ᮷ํᧆ݄ጱࣈො
ଫአຝ մӱᕆԾߝݎᵱᥝմӱᕆጱڹᒒଫአຝ ಅํጱդᎱ᮷ํᧆ݄ጱࣈො
API Server Data View URL Action routing react dispatch
react react-router-redux redux react-redux redux-saga reselect css-modules isomorphic-fetch
API Server Data View URL Action routing react dispatch isomorphic-
fetch async + awa it react-router react-router-redux redux-saga reselect css- modules
None
ङᦒ රᑕ ᦧړ ᬀާ ڹᒒದᴺ
قݎ ᬀާ قݎ قݎ قݎ قݎ ӱۓᕚ
None
ڹᒒದᴺ ङᦒ + රᑕ + ᦧړ + ᬀާ
antd რᕪ០ԏ᭲ ݒᬢ Ӿݣᦡᦇ React ದ Ꮈݎཛྷୗ
$ npm install antd Ant Design ጱ React ਫሿ +
4700+ ਥᗑྯ෭ᦢᳯᰁ Իහ 1400+ Issue Pull request හᰁ 69
ᨯሠᘏහᰁ 70/193 ᥟፍᡶᡵӾݸݣᔮᕹ 1w+ npm ྯ์ӥᰁ 2w+
մӱٖ᮱ই֜؉რҘ
რ ≠ නრᎱ ڊݗٖᲀ ӞᥤݶՌ ىဳᐒ܄ عᛔࡣ
ant.design ᦡᦇᥢ ڹᒒֵአ
դᎱ >
None
ᄍᐏྲ API ๅଉአ ׀ Changelog ܋ᕆ ׀ݎᘏ᧔ก ׀ग़ᇇ
— ᵨຎ ӥ᭲ฎӞଷउ૱ጱᜉஞ̶ “ ” — ؇ݦ ग़ᇇฎრጱᜉஞ̶
ग़ᇇฎრጱᜉஞ̶ ӥ᭲ฎӞଷउ૱ጱᜉஞ̶ “ ”
໐ஞੜᕟ ٖ᮱ռ۱ + ݎᩒრ
None
ᳯ᷌ݍḇ ᵱᦎᦞ ᥠᵞ ձۓᓕቘ Issues ӧളݑ๚ Issue ጱᵱ
ӧളݑ๚ Issue ጱᵱ ᳯ᷌ݍḇ ᵱᦎᦞ ᥠᵞ ձۓᓕቘ
ٌ՜ਫሿ ّ ݢአ ᇙୌᦓ դᎱᷚ໒ ग़ ඪ೮ ๐ۓᒒ ວ ᚕಋຝ
ᐒ܄ᨯሠ
None
ӾݣӱۓԾߝ ದԾߝ & ᥢ Ant Design, antd, Roof, G2 etc.
ದ๐ۓ ֛ḵದ᮱
๚ TypeScript antm ᑏۖᒒ ๐ۓᒒ Ի ӱۓཛྷ ୗପ ࢵᴬ۸ …
Question is welcome
None
None
None
None
Semantic Version
ݎᇇғbeta ᑞਧᇇғstable
ݎᇇғbeta ᑞਧᇇғstable
develop-1.0.0 ݎᇇғbeta ᑞਧᇇғstable master
None
Commit ىᘶ issue