Skip to content

Instantly share code, notes, and snippets.

View qkreltms's full-sized avatar
💖
Happy coding

JungHoonPark qkreltms

💖
Happy coding
19 followers · 19 following
View GitHub Profile
@qkreltms
qkreltms / awd.md
Created February 12, 2021 12:24 
export const destroyFns: Array<() => void> = [];

export const destroyAll = () => {
  while (destroyFns.length) {
    const close = destroyFns.pop();
    if (close) {
      close();
    }
 }
@qkreltms
qkreltms / sefs.md
Last active April 18, 2021 12:20 
export interface ConfirmProps {
  afterClose?: () => void;
  onClickClose?: (
    event: React.MouseEvent<HTMLButtonElement, MouseEvent>
  ) => void;
  onOk?: (
    event:
      | React.MouseEvent<HTMLButtonElement, MouseEvent>
@qkreltms
qkreltms / rser.md
Last active April 18, 2021 12:19 
const useModal = (
  isVisible: boolean
): [
  boolean,
  React.Dispatch<React.SetStateAction<boolean>>,
  (event: React.KeyboardEvent<any>) => void
] => {
  const [isOpen, setIsOpen] = useState(isVisible);
@qkreltms
qkreltms / estet.md
Last active April 18, 2021 12:17 
interface Factory {
  Component?: any;
  onClosed?: () => void;
  onAfterClosed?: () => void;
  [x: string]: any;
}

export const factory = ({ Component, ...config }: Factory) => {
  const div = document.createElement("div");
@qkreltms
qkreltms / gist:ea2a5a23ba26e98ec69ddb50d97d7bb1
Last active February 12, 2021 12:21
test.md 
   import "bootstrap/dist/css/bootstrap.min.css";
@qkreltms
qkreltms / gist:593fce65e1089272a8e3ed058cb3812b
Created February 12, 2021 12:17
etset.md 
export default function confirm(config: ModalFuncProps) {
  const div = document.createElement('div');
  document.body.appendChild(div);
  // eslint-disable-next-line no-use-before-define
  let currentConfig = { ...config, close, visible: true } as any;

  function render({ okText, cancelText, prefixCls, ...props }: any) {
    /**
 * https://github.com/ant-design/ant-design/issues/23623
@qkreltms
qkreltms / gist:eecd70c1c58919bdc17c63b8c8f0c622
Last active February 12, 2021 12:16 
const initialState: State = {
  user: {
    id: '',
    nickname: '',
    photoURL: '',
    statusMessage: '',
  },
  deleteMode: false,
  // ref를 주입받을 modal state입니다.
@qkreltms
qkreltms / index.html
Last active October 22, 2020 08:30
my first three js
<head>
<title>threejs - basic setup</title>
</head>
<body>
<canvas id ="c"></canvas>
</body>
@qkreltms
qkreltms / gist:29af1ea5c1c00c2e27386a03faff7aff
Created October 21, 2020 01:12
캐시
참고: https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/http-caching?hl=ko
1. CDN에서는 어떤 데이터를 캐시하는가?
api의 content-type에 따라서 (image, pdf, js, css, html 등등...)
주의: CDN이 데이터를 캐시하기 때문에 원하는 때에 최신화된 데이터가 오지 않올 수 있으므로 주의가 필요하다.
2. 어떻게 해야 캐시 데이터를 지정할 수 있는가?
HTTP 해더 설정 (ETag, Cache-Control)
참고: https://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.9
@qkreltms
qkreltms / readme.md
Last active July 21, 2021 01:37
Redux Persist

Redux Persist를 소개합니다.

Redux Persist란 무엇인가?

흔히 여러 컴포넌트를 거치지 않고 손쉽게 state를 전달하기 위해 혹은 분리해서 중앙화 하기 위해 Redux를 사용합니다. 하지만 이 state는 인터넷창의 새로고침 버튼을 누르거나 종료하는 순간 초기화 되고 맙니다. 초기화를 방지하기 위해서 흔히 Web storage(이하 storage라 지칭)에 저장하는데요. 이 것과 삭제 기능을 포함해서 Redux안에서 간편하게 하게 할 수 있는 라이브러리가 바로 Redux Persist입니다. 실제로 코드를 살펴보면 Redux store을 하나 더 만들어서 여기에 특정 state를 저장하고 특정 액션이 발동되면 직렬화(serialize)해서 storage에 저장, storage에서 역직렬화(deserialize)후 불러와 사용합니다.

사용법:

1.먼저 기존의 Reducer에 persistConfig를 만들고 persistReducer함수로 감싼다.