소개

모든 프로젝트를 처음부터 빌드하는 것은 많은 시간이 걸리고 좌절감을 유발하며 기능을 개선하는 것보다 구성 요소를 배치하는 데 많은 시간을 할애하기 때문에 고통스럽습니다. 이미 작성되어 사용 가능한 코드를 작성하는 것도 시간 낭비입니다.

이러한 모든 문제에 대한 해결책은 프레임워크입니다.

A framework, or software framework, is a platform for developing software applications. It provides a foundation on which software developers can build programs for a specific platform.
-TechTerms

많은 목적을 위한 프레임워크가 있습니다.

오늘 우리는 다음 ReactJS 프로젝트를 개발하기 위한 최고의 UI 프레임워크를 살펴볼 것입니다.

머티리얼 UI

React components for faster and easier web development.

설치

 $ npm install @material-ui/core

용법

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

 function App() {
   return <Button color="primary">Hello World</Button>;
}

반응 부트스트랩

The most popular front-end framework. Rebuilt for React.

설치

 $ npm install react-bootstrap bootstrap

용법

import Button from 'react-bootstrap/Button';

// or less ideally
import { Button } from 'react-bootstrap';

 function App() {
   return <Button>Hello World</Button>;
}

원자로 하다

Atomize Design System is the most advanced UI design framework that helps designers create beautiful and consistent user interfaces for the web.

설치

 $ npm install atomize react-transition-group

용법

import { Button } from "atomize";

 function App() {
   return <Button>Hello World</Button>;
}

개미 디자인

A design system for enterprise-level products. Create an efficient and enjoyable work experience.

설치

 $ npm install antd

용법

import { DatePicker } from 'antd';

ReactDOM.render(<DatePicker />, mountNode);

마지막 메모

이 프레임워크가 멋진 UI가 있는 다음 프로젝트를 개발하는 데 도움이 되기를 바랍니다. "어떤 프레임워크를 사용합니까?"를 알고 싶습니다.

블로그 게시물을 읽어주셔서 감사합니다.