더북(TheBook)

20.2.1 컴포넌트 만들기

간단한 컴포넌트를 세 개 작성합니다. components 디렉터리를 생성하여 그 안에 다음 파일들을 하나하나 순서대로 작성하면 됩니다.

components/Red.js

import React from 'react';
import './Red.css';

const Red = () => {
  return <div className="Red">Red</div>;
};

export default Red;

 

components/Red.css

.Red {
  background: red;
  font-size: 1.5rem;
  color: white;
  width: 128px;
  height: 128px;
  display: flex;
  align-items: center;
  justify-content: center;
}

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.