[Feat] 라우터 조건부 랜더링 기능 추가 & Do를 추가

[Dunkkkk]

조건부 Rendering

<Route path="/" isFullScreen={false} element={<div>0</div>}></Route>
<Route path="/1" isFullScreen={true} element={<div>1</div>}></Route>
<Route path="/2" isFullScreen={false} element={<div>2</div>}></Route>
<Route path="/3" isFullScreen={false} element={<div>3</div>}></Route>

위와같이 전체화면이 되고 싶은곳에 isFullScreen을 true로 해준다.

const Temp: React.FC<pp> = ({ str }: pp) => {
  const isShowing = useIsShowing();
  if (isShowing) {
    return <div>{str}</div>;
  } else {
    return null;
  }
};

조건부 랜더링이 되고싶은곳에서 isShowing을 통해 분기처리해준다.

Do

기존에 work process보다 조금 더 light하게 사용할 수 있는 부분으로써

import { createState } from "../State";
import { DoAction } from "../Actions";
import State from "../State";
import { makePayLoad } from "../Util/StoreUtil";

const Do_NAME = "Count";

// state type
interface CountPayLoad {
  count: number;
  text: string;
}

const initCountState = createState<CountPayLoad>(Do_NAME, {
  count: 0,
  text: "helloWorld",
});

// actions
const doAction = {
  countUp: (): DoAction<CountPayLoad> => {
    return {
      type: Do_NAME,
      doing: (state: State<CountPayLoad>): State<CountPayLoad> => {
        return makePayLoad(state, { count: state.payload.count + 1 });
      },
    };
  },
};

export { doAction, initCountState };

위와같이 action에 로직을 묶어주고 똑같이 dispath를 써주면 된다.

[minani-0621]

기존에 work는 reducer를 통해야만 state 변경이 가능했는데, do는 reducer 없이 코드가 경량화 된 점이 좋아 보이네요..!