🤖 AI로 몇 시간만에 개인 블로그 만들기

2025년 7월 6일

갑자기 무슨 블로그??

몇 년 전에 만든 기술 블로그가 있었고, 아주 가끔씩 글을 업로드하고 있었다. 많은 블로그 서비스 중에서 Velog를 이용하고 있었는데, 이 서비스가 마음에 들었던 이유는 개발 이야기에 특화되어 있고 마크다운을 지원해서 노션에 작성한 글을 그대로 복사 붙여넣기만 하면 내가 원하던 포맷대로 올라갔기 때문이다.

이렇게 보면 글을 열심히 쓰는 것처럼 보이지만, 실제로는 업로드 주기가 일정하지 않고 게시물 업로드가 2023년에서 갑자기 2025년으로 바뀌는 것을 보면 기술 블로그 작성에 신경 쓰지 않고 있다는 걸 알 수 있다. 솔직히 말하면, 귀찮기도 하고 무슨 글을 써야 할지에 대한 고민만 하다가 실천으로 이어지지 않는 게 스스로 아쉬웠다.

며칠 전, 사내 팀원분이 옵시디언(Obsidian)으로 기술 공부한 내용들을 쉽게 웹사이트로 배포한 모습을 보고 개인 블로그를 만들어야겠다는 자극을 받기 시작했다. 꾸준히 작성해야 한다는 부담감이 오히려 포기하기 쉽게 만들었던 것 같다. 그래서 꾸준히 작성할 수 있는 환경을 스스로 조성한다면, 개인 블로그 사이트를 유지보수하면서 자연스럽게 기술 블로그 게시물도 올리게 되지 않을까 하는 희망적인 생각을 하며 여러 개인 블로그들을 참고하기 시작했다.

내가 글 쓰는 건 귀찮아해도 읽는 건 꾸준하다고 말할 수 있다. 위의 기술 블로그들을 꾸준히 방문하면서 스타일이나 기능 구성들을 참고하여 개인 블로그를 어떻게 구성할지 쉽게 결정할 수 있었다.

Gatsby 및 Netlify 스택으로 배포

프로젝트 폴더를 생성하는 순간, 잠시 고민에 빠지게 되었다. React로 개발하는데 서버를 만들어야 할지, 어디로 배포해야 할지, 마크다운 기능은 언제 또 구현해야 할지 걱정이 되었다. 이러다가 또 포기하게 될 것 같아서 개인 블로그를 만든 후기들을 살펴봤다.

Jekyll이라는 정적 사이트 생성기(SSG)로 GitHub Pages에 호스팅해서 개인 블로그를 만들었다는 이야기가 많았지만, 초반 환경 구성이 너무 어렵다는 평이 많아 현재 트렌드에 맞게 Gatsby라는 React 기반 SSG를 이용한다고 한다. 처음부터 빈 프로젝트에서 작업하는 것보다 블로그 사이트에 특화된 프레임워크를 활용하면 작업 부담이 덜 될 것 같아서 Gatsby에 관심을 가지게 되었다.

Gatsby로는 결국 React 컴포넌트로 블로그 UI를 개발할 수 있고, SEO 최적화, 코드 분할, GraphQL로 데이터 쿼리 조회가 가능하며 PWA 기능이 내장된 점을 봤을 때 개인 블로그 개발에 최고의 선택이 아닐까라는 생각이 들었다.

Gatsby에서는 처음 입문하는 사용자들에게 특정 목적에 특화된 프로젝트 템플릿을 제공하는데, 그 중 “gatsby-starter-blog”가 마크다운 기능 구현에 대한 고민들을 해결할 수 있는 방안이었다. Gatsby로 블로그를 만든다면 거의 필수라는 이야기들이 있어서 간단한 명령어를 통해 Gatsby 설정에 적용할 수 있었다.

웹 호스팅도 선정해야 하는데, 가능하면 비용이 많이 들지 않는 선에서 진행하고 싶었다. 그래서 AWS나 국내 호스팅 업체는 바로 패스하고, Vercel이 Next.js에 좀 더 특화된 호스팅 서비스인 것처럼 Gatsby는 Netlify로 호스팅하는 게 특화되어 있다고 들었다. Vercel처럼 설정하고 배포하는 게 쉬워서 따로 설명서 같은 걸 볼 필요 없이 내 개인 블로그 소스들을 GitHub에 올리고 연동하기만 하면 된다. (😭 아쉬웠던 점은 배포 상태마다 Slack으로 알림이 오게 하고 싶었는데 유료였고, Webhook로 활용하려고 했는데 잘 안됐다…)

메인 브랜치에 올리면 자동으로 운영 배포가 되었고, 예전에 가비아에서 구매하고 안 쓰고 있던 커스텀 도메인이 있어서 그와 관련된 네임서버, DNS 설정을 모두 마무리하고 SSL 인증까지 완료해 정말 하루 만에 개인 블로그를 만들게 되었다.

Cursor로 부가 기능 만들기

단순하게 템플릿 스타일만 고치지 않고, 간단하게 태그 기반 게시물 필터링 기능도 넣었고 페이지네이션 처리, 다크 모드 정도의 추가 기능을 넣었다.

[사진 5] Cursor로 블로그 만들 때, 자연어로 쉽게 처리하는 상황

그림에는 다른 내용을 물어보고 있지만, 아래 채팅창 덕분에 페이지네이션 컴포넌트를 뚝딱 만들고, 한 번도 안 써본 GraphQL을 공부할 필요 없이 프롬프트 내용대로 알아서 쿼리를 수정해 주고, 디자인 고민 없이 색상 하나 던져서 팔레트도 만들어 주니 정말 만능이었다.

내가 기술 블로그 유지보수에 대한 걱정을 덜게 된 또 하나의 결정적인 부분이 아니었나 하는 생각이 들었다. 추후에는 GA 연동, 게시글마다 목차 표시 기능, 모바일 디자인 개선이 필요하겠지만, 개인 블로그를 만들면서 짧게 든 생각은 다음과 같다:

AI가 정말 대단하다 😮… 귀찮던 작업들을 정말 쉽게 보조해 주니까 작업할 맛이 난다!
이미지 및 폰트 로드 속도가 느린 것 같은데, 이것들을 어떻게 개선할지 파악이 필요하다 🤔
다른 블로그에 비해 약간 차별성이 있어서 블로그에 대한 애정을 가지기 시작했다 👏