[react] button, input box 예쁘게, 쉽게, 빠르게 ant design 사용하기

* ant design 라이브러리 추가

$ npm install antd --save

 

 

* 고유 css를 적용시키기 위해 index.js에서 antd.css를 import

import 'antd/dist/antd.css';

 

* ant design의 사용하는 기능을 import

> 현재 적용하려는 것은 Pagination

적용하려는 컴포넌트에 Pagination 기능을 import

import {Pagination} from "antd";


...

<Pagination defaultCurrent={1} total={50} />

 

 

> 그밖에 input box 등 기능들 사용하기 (버튼, input, form 등... )

import {Typography, Button, Form, message, Input, Icon} from "antd";

function loadPage() {
    const {Title} = Typography;
    const {TextArea} = Input;
    
    
    return ( <div>
    ...
    
    <TextArea
                onChange={onDescriptionChange}
                value={Description}/>
	<Title level={2}>Upload Video</Title>
    
    ...
    </div>
    
    ) }
    
    
export default loadPage;