Material-UI

Material-UI는 React 애플리케이션을 위한 UI 라이브러리로, Material Design 컨셉에 기반하여 디자인된 React 컴포넌트들을 제공합니다. Material-UI를 사용하면 UI 개발이 더 쉽고 빠르게 이루어질 수 있습니다.

Material-UI를 사용하기 위해서는 먼저 @material-ui/core 패키지를 설치해야 합니다.

👉 // with npm npm install @material-ui/core

// with yarn
yarn add @material-ui/core

SVG Icons 사용시

👉 // with npm npm install @material-ui/icons

// with yarn
yarn add @material-ui/icons

예제 코드

import React from 'react';
import { Button, TextField } from '@material-ui/core';

const Material = () => {
  return (
    <div>
      <h1>Material-UI Example</h1>
      <TextField label="Username" variant="outlined" />
      <TextField label="Password" variant="outlined" type="password" />
      <Button variant="contained" color="primary">Login</Button>
    </div>
  );
};

export default Material;