Snippets for react

Extension with a snippet package for React development.

Features

Javascript

imr - import

  import React from 'react'

usf - useState

  const [, set] = useState()

uef - useEffect

  useEffect(() => {

  }, [])

fcd - Function Component export Default

export default function () {

  return (
    <>

    </>
  )
}

fc - Function Component export

export function () {

  return (
    <>

    </>
  )
}

cp - Context Provider

import { createContext } from 'react'

export const  = createContext();

export default function Provider({ children }){
  const  = {};

  return (
    <.Provider value={{}}>
      {children}
    </.Provider>
  );
}

Typescript

imr - import

  import React from 'react'

usf - useState

  const [, set] = useState<>()

uef - useEffect

  useEffect(() => {

  }, [])

fcd - Function Component export Default

type Props = {

}

export default function ({}: Props): JSX.Element {

  return (
    <>

    </>
  )
}

fc - Function Component export

type Props = {

}

export function ({}: Props): JSX.Element {

  return (
    <>

    </>
  )
}

cp - Context Provider

import { createContext } from 'react'

type Props = {
  children: React.ReactNode
}

export const  = createContext();

export default function Provider({ children }: Props){
  const  = {};

  return (
    <.Provider value={{}}>
      {children}
    </.Provider>
  );
}

tp - type

type  = {

}

itr - Interface

interface  {

}

Jest

dsc - Describe

describe('',()=> {})

it - It

it('',()=> {})

test - Test

test('',()=> {})

afta - AfterAll

afterAll(() => {})

aft - AfterEach

afterEach(() => {})

befa - BeforeAll

beforeAll(() => {})

bef - BeforeEach

beforeEach(() => {})

Jest

dsc - Describe

  ()=> {}