Usage

After install this snippets add this inside your settings

"editor.snippetSuggestions": "top"

README Map

• Import Snippets

• Start Snippets

• Hook Snippets

Snippets List

Import Snippets (ri)

Start Snippets (rs)

Hook Snippets (rh)

Snippets Content

Import Snippets

Import react | ri-r

import React from 'react';

Import useState | ri-us

import { useState } from 'react';

Import useEffect | ri-ue

import { useEffect } from 'react';

Import useContext | ri-uc

import { useContext } from 'react';

Import number of hooks | ri-h[1-5]

• ri-h1

  • import { use$1  } from 'react';
    

• ri-h2

  • import { use$1, use$2  } from 'react';
    

• ri-h3

  • import { use$1, use$2, use$3  } from 'react';
    

• ri-h4

  • import { use$1, use$2, use$3, use$4  } from 'react';
    

• ri-h5

  • import { use$1, use$2, use$3, use$4, use$5  } from 'react';
    

Start Snippets

Start function component | rs-f

import '.$2/$1.css';

function $1() {
  return (
    <>

    </>
  );
};

export default $1;

Start arrow function component | rs-af

import '.$2/$1.css';

const $1 = () => {
  return (
    <>

    </>
  );
};

export default $1;

Start class component | rs-c

import React from 'react';
import '.$2/$1.css';
				
class $1 extends React.Component {
  render() {
    return (
	  <>
      
	  </>
    );
  };
};
				
export default $1;

Hook Snippets

Hook useState | rh-us

const [$1, set$1] = useState($2);

Hook useEffect | rh-ue

useEffect(() => {
  $2
}, [$1]);

Hook useContext | rh-uc

const $1 = useContext($2);