블로그를 시작합니다

2026.05.26

오랫동안 미뤄왔던 개인 기술 블로그를 드디어 만들었습니다.

왜 만들었는가

배운 것을 정리하지 않고 넘어가면 결국 휘발됩니다. 글로 옮겨두면 나중에 다시 찾아볼 수도 있고, 무엇보다 정리 과정에서 이해가 정돈됩니다.

어떻게 만들었는가

Gatsby 기반으로 만들었습니다. 디자인은 최대한 덜어내는 방향으로 잡았고, 본문에 집중할 수 있도록 폰트와 여백만 신경 썼습니다.

폰트는 Pretendard
본문은 흰 배경 + 텍스트
드래그 셀렉션은 민트색

코드는 이렇게 씁니다

마크다운에 언어 이름만 붙여주면 syntax highlighting이 자동으로 들어갑니다.

type Post = {
  title: string;
  date: string;
  slug: string;
};

const formatDate = (date: string): string => {
  return new Date(date).toLocaleDateString("ko-KR", {
    year: "numeric",
    month: "long",
    day: "numeric",
  });
};

// gatsby-node.js 에서 페이지 생성하는 부분
exports.createPages = async ({ graphql, actions }) => {
  const { createPage } = actions;

  const result = await graphql(`
    query {
      allMarkdownRemark {
        nodes {
          frontmatter {
            slug
          }
        }
      }
    }
  `);

  result.data.allMarkdownRemark.nodes.forEach((node) => {
    createPage({
      path: node.frontmatter.slug,
      component: require.resolve("./src/templates/post.js"),
      context: { slug: node.frontmatter.slug },
    });
  });
};

.container {
  max-width: 640px;
  margin: 0 auto;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

자주 쓰면서 천천히 채워가 보겠습니다.