react에서 color 상수화해서 사용하기

이번 프로젝트에서 자주 사용하는 주요 색 2가지를 config라는 폴더 안에 constants라는 파일에 상수화해서 저장한 뒤 필요한 곳에서 import 해오는 방법을 사용했다.
이는 오타를 방지하고 더 많은 색을 사용할 경우 구분이나 작성이 한결 편해진다.

src/config/constants.js

export const PRIMARY_COLOR_GREEN = "#425f57";
export const PRIMARY_COLOR_WHITE = "#f8f5f1";

src/components/shelter/ShelterList.style.js

import styled from "styled-components";
import {
  PRIMARY_COLOR_GREEN,
  PRIMARY_COLOR_WHITE,
} from "../../config/constants";

export const ListTable = styled.div`
  background: ${PRIMARY_COLOR_WHITE};
  border-color: ${PRIMARY_COLOR_GREEN};
`;