handy-snippets| Zustand

Features

1. provides zustand snippet(prefix -zs) with typescript, middleware(persist, devtools, immer)

Snippets

Export Default Components

Snippet	Renders
edc	export default component
edcp	export default component with props
edf	export default function

Zustand Stores

Note: persist, devtools, and immer are from the official libraries, while history is implemented using Zundo.

To use immer, you need to download the immer library, and for history, you need to download zundo.

Snippet	Renders
zs	zustand store
zsp	zustand store with persist
zsd	zustand store with devtools
zsi	zustand store with immer
zspi	zustand store with persist, immer
zsdi	zustand store with devtools, immer
zsdpi	zustand store with devtools, persist, immer
zsh	zustand store with history
zsih	zustand store with immer, history
zspih	zustand store with persist, immer, history

Market Place

go to Market Place.

Rule(원칙)

1. Use lowercase letters only | 소문자만을 사용한다.
2. Combine the first letters of the word. | 단어의 첫문자들을 조합한다. export default component => edc

Example(예시)

{
  "export default component": {
    "prefix": "edc",
    "body": [
      "const ${1:${TM_FILENAME_BASE}} = () => {",
      "  return <>$2</>;",
      "};",
      "",
      "export default ${1:${TM_FILENAME_BASE}};"
    ],
    "description": "export default component"
  }
}

TIP

snippet generator