[TIL] react snippet

Snippet Generator

---

Extensions에서 Snippet generator 설치

1. 원하는 코드 작성 후 우클릭 → Generate snippet

2. 언어 선택

3. snippet name 작성

4. snippet trigger 작성

5. snippet description 작성

placeholder

$1 : snippet 사용 시 자동으로 커서
$2 : $1 작성 후 tab 누르면 이동

🧊 component 생성 snippet

import styled from "styled-components";

function $1() {
  return (
    <$1style>
      <h1>$1</h1>
    </style>
  );
};

const $1style = styled.div``;

export default ;

🧊 useEffect snippet

useEffect(() => {
  
}, []);

🧊 flex snippet

display: flex;
align-items: start;
justify-content: space-between;
gap: $1;

🧊 theme snippet

${({ theme }) => theme.$1};

🧊 Title snippet

<Title size="" color="">
  
</Title>