MATERIAL-COMPONENTS

github source 바로가기

docker repository 바로가기

docker로 빠른 실행 해보기

$ docker run -d --name react-app -p 80:80 lahuman/test-react-app

프로젝트 개요

오랜만에 진행하는 개인 프로젝트입니다. (간간히 짧은건 몇개 진행하였습니다.) 요즘 ReactJS를 활용하고 있는데요. 몇몇 컴포넌트들은 살짝 변경해서 공통으로 쓰고 있습니다. 이런 공통 컴포넌트들을 오픈소스화 해보려고 합니다.

ReactJS + MaterialUI 기반에서 동작합니다.

기본으로 제공되는 component를 변경하였습니다.

Datepicker

기존 datepicker에서 달력에 표시되는 포멧을 한글로 변경하고 삭제 등의 기능을 추가 하였습니다.

App.js에서 포멧이나 타임존에 대한 변경을 할수 있습니다.

주의 할점은 @date-io/moment 2.X에서는 오류가 발생합니다. 1.3.x를 사용해주세요.

// for MuiPickers only
MomentUtils.prototype.getCalendarHeaderText = date => {
  return MomentUtils.prototype.format(date, 'YYYY년 M월');
};
MomentUtils.prototype.getDateTimePickerHeaderText = date => {
  return MomentUtils.prototype.format(date, "M월 D일");
};

DataTable

기본 테이블에 정렬기능을 추가 하였습니다.

복잡하지 않고 정렬만 사용할 경우 유용합니다.

정렬되고 있는 컬럼에 정렬방식을 표기하고 다시 클릭하면 반대로 정렬합니다.