jgdesign

소개

UI 컴포넌트 라이브러리 입니다.

jgdesign은 프론트엔드 개발자들을 위한 실용적인 반응형 형식의 컴포넌트 UI를 제공합니다.

특징

• jgdesign은 Atomic Design Pattern을 지향합니다.
• jgdesign 라이브러리 자체에서 svg, 색상 등을 지원하지 않습니다(기본 검정, 하양) 하지만 svg, 색상 등을 직접 설정할 수 있게 설계 되어 있습니다.

설치 방법

npm install jgdesign
&
npm i jgdesign

사용 방법

jgdesign을 사용하기 위해서는 import로 사용할 컴포넌트를 받아와야 합니다.

import { TextButtonBlack } from 'jgdesign';

jgdesign의 컴포넌트들은 전부 인라인 스타일을 지향합니다.

<TextButtonBlack label="Example Text" />
//ADD라는 내용을 포함한 TextButtonBlack 생성

jgdesign은 색상을 바꿀 수 있는 자율성을 지향합니다.

 <TextButtonColor label="Example Text" bgColor="#FF5733" />

jgdesign은 react icon 사용을 지향합니다.

import { FaBeer } from "@react-icons/all-files/fa/FaBeer";

<LogoButtonBlack
  Icon={FaBeer}
  iconSize={32}
  iconColor="#8133ff"
/>

UI 종류

Button

• TextButtonBlack
• TextButtonWhite
• TextButtonColor
• LogoButtonBlack
• LogoButtonWhite
• LogoButtonColor