그럼 이제 AuthTemplate 컴포넌트를 작성합니다.

components/auth/AuthTemplate.js

import React from 'react';
import styled from 'styled-components';

/**
 * 회원가입/로그인 페이지의 레이아웃을 담당하는 컴포넌트입니다.
 */

const AuthTemplateBlock = styled.div``;

const AuthTemplate = () => {
  return (
    <AuthTemplateBlock>
      
    </AuthTemplateBlock>
  );
};

export default AuthTemplate;

---

 

컴포넌트를 만들 때 VS Code의 Snippet 기능을 사용하면 작업 시간을 줄일 수 있을 뿐 아니라 매우 유용합니다. 3장에서 확장 프로그램을 통해 Snippet을 설치하여 사용하는 방법을 알아보았는데요. 이 장에서는 Snippet을 직접 만들어서 쓰고 싶은 경우 어떻게 해야 하는지 알아봅시다.