Get started with ant-design-pro CDN
MIT licensed
Ant Design Pro is a high-performance, enterprise-level React component library for building data-intensive UIs.
Tags:- antd
- react
- redux
- css
- design
- desktop
- enterprise
- boilerplate
- admin
- admin-dashboard
Stable version
Copied!
How to start using ant-design-pro CDN
<!DOCTYPE html>
<html>
<head>
<title>Get started with ant-design-pro CDN - cdnhub.io</title>
<link rel="stylesheet" href="https://cdn.antdesign.pro/2.3.2/antd.min.css" />
<link rel="stylesheet" href="https://cdn.antdesign.pro/2.3.2/antd.themes.min.css" />
<script src="https://cdn.jsdelivr.net/npm/react/umd/react.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/react-dom/umd/react-dom.production.min.js"></script>
<script src="https://cdn.cdnhub.io/ant-design-pro/2.3.2/ant-design-pro.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
import { Layout, Content } from 'antd/pro';
ReactDOM.render(
<Layout>
<Layout.Header>
<div className="logo" />
<menu theme="dark" mode="horizontal">
<Menu.Item key="home">Home</Menu.Item>
<Menu.Item key="about">About</Menu.Item>
</menu>
</Layout.Header>
<Layout>
<Layout.Sider>
<Menu mode="inline">
<Menu.Item key="1">Option 1</Menu.Item>
<Menu.Item key="2">Option 2</Menu.Item>
<Menu.Item key="3">Option 3</Menu.Item>
</Menu>
</Layout.Sider>
<Content style={{ padding: '0 50px' }}>
<div style={{ padding: 24, background: '#fff' }}>
<p>Welcome to Ant Design Pro!</p>
</div>
</Content>
</Layout>
</Layout>,
document.getElementById('root')
);
</script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
All versions
0.0.16
0.0.6
0.1.10
0.1.3
0.1.4
0.1.5
0.1.7
0.1.8
0.1.9
0.2.0
0.2.0-rc.1
0.2.1
0.2.1-rc.1
0.2.1-rc.2
0.2.2
0.2.2-rc.0
0.2.2-rc.1
0.2.3-rc.0
0.2.3-rc.1
0.2.3-rc.2
0.2.3-rc.3
0.3.0
0.3.1
1.0.0
1.0.1
1.0.1-rc.0
1.1.0
1.2.0
1.2.1
1.3.0
1.4.0
1.4.1
1.4.3
1.4.4
2.0.0
2.0.0-beta.1
2.0.0-beta.2
2.0.0-beta.3
2.0.0-beta.4
2.1.0
2.1.1
2.2.0
2.2.1
2.3.1
*** 2.3.2