Skip to content

HelloXiuXiu/react-js-snippets

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Sublime Text Snippets (React + Redux and JS)!

To use a snippet type the shortcut and press Tab. Use Tab to change $1, $2, etc. statements one after another.

List of snippets:

React + Redux

rfc

import React from 'react'

export const ${1:${file_name}} = () => {
  return (
    ${2:<div>Hello</div>}
  )
}

st

const [${1:'kek'}, set${1:'Kek'}] = useState(${2:'kek'})

ef

useEffect(() => {
  ${1:// ...}
}, [])

rmap

{${1:data}.map((item, ind) => (
  ${2:<div key={ind\}>Kek</div>}
))}

rcmap

{${1:condition} && ${2:data}.map((item, ind) => (
  ${3:<div key={ind\}>Kek</div>}
))}

memo

const ${1:SomeComponent} = memo(function ${1:SomeComponent}({ prop }) {
  return (
    ${2:<div>Hello</div>}
  )
})

usememo

const ${1:variableName} = useMemo(() => {
  return ${2:null}
}, [])

usecall

const ${1:functionName} = useCallback(() => {
  ${2: // ...}
}, [])

sel

import { useSelector } from 'react-redux'

const ${1:kek} = useSelector((state) => state${2:kekSlice?.kek})

disp

import { useDispatch } from 'react-redux'

const dispatch = useDispatch()

JS

log

console.log(${1:'kek'})

if

if (${1:condition}) {
  ${2:// ...}
}

ife

if (${1:condition}) {
  ${2:// ...}
} else {
  ${3:// ...}
}

tr

${1:condition} ? ${2:expresion} : ${3:expresion}

for

for (let i = 0; i < ${1:10}; i++) {
  ${2:// ...}
}

fore

for (let i = 0; i < ${1:10}; i++) {
  ${2:// ...}
} else {
  ${3:// ...}
}

wh

while (${1:condition}) {
  ${1: // ...}
}

sw

switch(${1:expression}) {
  case 'x':
    {2: // ...}
    break;
  case 'y':
    {3: // ...}
    break;
  default:
    {4: // ...}
}

afn

() => {
  ${1:// ...}
}

ael

${1:window}.addEventListener(${2:'click'}), ${3:'handleClick'})

rel

${1:window}.removeEventListener(${2:'click'}), ${3:'handleClick'})

stm

setTimeout(() => {
  ${1:// ...}
}, ${2:1000})

sin

setInterval(() => {
  ${1:// ...}
}, ${2:1000})

keys

Object.keys(${1:obj}).forEach((key) {
  ${2:// ...}
})

rndmax

Math.floor(Math.random() * ${1:5})

About

Sublime Text Snippets (JS, React and Redux)

Resources

License

Stars

Watchers

Forks

Packages

No packages published