Merge pull request #45 from mbti-nf-team/feat/react-hook-useUpdateEffect

.changeset/mighty-steaks-shave.md

@@ -0,0 +1,5 @@
+---
+"@nf-team/react": minor
+---
+
+feat(hook): useUpdateEffect, useIsFirstRender hook 구현

packages/react/src/hooks/index.ts

@@ -1,9 +1,11 @@
 export { default as useActionKeyEvent } from './useActionKeyEvent';
 export { default as useBoolean } from './useBoolean';
 export { default as useDebounce } from './useDebounce';
+export { default as useIsFirstRender } from './useIsFirstRender';
 export { default as useIsMounted } from './useIsMounted';
 export { default as useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';
 export { default as useLessThenScrollY } from './useLessThenScrollY';
 export { default as useResizeViewportHeight } from './useResizeViewportHeight';
 export { default as useThrottleCallback } from './useThrottleCallback';
 export { default as useTimeout } from './useTimeout';
+export { default as useUpdateEffect } from './useUpdateEffect';

packages/react/src/hooks/useIsFirstRender.ts

@@ -0,0 +1,15 @@
+import { useRef } from 'react';
+
+function useIsFirstRender(): boolean {
+  const isFirst = useRef(true);
+
+  if (isFirst.current) {
+    isFirst.current = false;
+
+    return true;
+  }
+
+  return isFirst.current;
+}
+
+export default useIsFirstRender;

packages/react/src/hooks/useUpdateEffect.ts

@@ -0,0 +1,16 @@
+import { DependencyList, EffectCallback, useEffect } from 'react';
+
+import useIsFirstRender from './useIsFirstRender';
+
+function useUpdateEffect(effect: EffectCallback, deps?: DependencyList) {
+  const isFirst = useIsFirstRender();
+
+  // eslint-disable-next-line consistent-return
+  useEffect(() => {
+    if (!isFirst) {
+      return effect();
+    }
+  }, deps);
+}
+
+export default useUpdateEffect;