나의 웹사이트 개설기

March 4, 2024

웹사이트를 개설한 계기

성장과정이 담긴 ‘나의 웹 공간’을 가지고 싶다.

한 달 뒤면 웹 프론트엔드 개발자로서 만 1년이 된다. 외주 프로젝트를 하는 회사에 취업해 지난 기간 동안 4개의 프로젝트를 담당하였다. 다양한 프로젝트 경험을 통해 기술적으로 많이 성장했다고 느끼지만, 기한에 쫓겨서 놓치고 넘어가는 부분도 많았다.

외주 프로젝트는 마무리되면 내 손을 떠난다. 기한에 쫓겨 더 좋은 방법을 고민하기보다 작동이 우선인 안타까운 상황을 많이 만나게 된다. 분명 더 나은 방법 방법이 있었을텐데 말이다. 다음 프로젝트에서 같거나 비슷한 작업을 하게 되면서 더 좋은 코드가 내 머리 속에서 나올 때 아쉬움이 더 크게 느껴진다. (물론 이런 업무 프로세스를 지향하는 회사 입장도 백 번 천 번 이해한다. 회사는 이익을 추구하고 그 이익으로 나에게 월급을 주는 것이기에 말이다. 항상 감사합니다!)

지금 생각해 보면 가장 아쉬웠던 건 취직하고 들어간 첫 프로젝트였다. Next.js를 처음 쓰게 된 당시 서버 사이드 렌더링의 개념을 제대로 알지 못하여 hydration 에러나 window참조 에러에 대처가 미흡했다. 그러다 보니 localStorage, sessionStorage 그리고 외부 라이브러리를 제대로 활용할 수 없어 멀게 돌아 가야했던 일이 있었다.

mtseo.dev의 개설 계기는 위에 서술한 내가 겪고 있는 기술적 문제점과 해결 방법을 기록하고 한 층 한 층 성장해 나가는 과정을 담고 싶어 만들게 되었다. 그리고 mtseo.dev도 좋은 코드, 좋은 방식으로 리팩토링하며 지속적으로 애정을 담아 운영할 생각이다.

Next.js를 선택한 이유

내 웹사이트는 Next.js로 만들어 졌다. Gatsby, 티스토리, velog 등 여러 선택지가 있었지만 Next.js를 선택한 이유는 다음과 같다:

회사에서도 계속 써 와서 익숙하다.
SEO 최적화
Next.js 14와 App Router 방식을 경험하고 싶었다.

대단한 이유는 아니지만 실무에서는 계속해서 Next.js 13 Page Router 방식을 써 왔기에 App Router 방식이 어떤지 느껴보고 싶었다.

도메인 구입

금전적인 비용이 발생하면 더 열심히 할 것이라는 생각에 도메인도 구입했다. 이렇게 돈을 써가며 원동력을 얻기도 한다. 인프런에서 강의 지르면 아까워서라도 대부분 완강하게 되고 도서관에서 빌린 책보다 내가 돈 주고 산 책을 더 열심히 읽게 된다. 이것도 금융치료이지 않을까?

.dev이냐 .com이냐

결과적으로 .dev를 선택했지만 사실 이 선택에 기로에서 몇 시간을 고민했다.

.dev는 개발자로서의 정체성을 잘 나타내 주고 12달러로 합리적인 가격이었다.
.com은 가장 일반적이지만 company의 의미를 내포하고 있고 가격이 30달러로 비쌌다.

개발자로서 마음은 .dev 쪽이 끌렸지만 .com이 아무래도 가장 메이저하고 미래적 가치가 더 있어 보여 갈등이 있었다. 그 이유는 어디서 도메인을 사고 되팔아 수익을 냈다는 후기 글이 보아서다. 잠시나마 성공한 가치투자자가 되어 수익을 내는 헛된 상상을 했었다.

도메인은 namecheap이라는 해외 사이트를 통해 구매했다. 과정은 회원가입하고 도메인 선택 그리고 결제! 매우 간단했다. 국내 도메인 구매 사이트 가비아도 있었지만 같은 도메인에 가격이 더 비싸서 namecheap을 선택했다.

Vercel에 배포하기

.dev 도메인은 SSL인증서가 필수이다. SSL도 도매인 구입처에서 옵션으로 구매할 수 있지만 Vercel에서 배포하면 기본적으로 HTTPS/SSL를 지원해 줘서 별도로 구매할 필요가 없었다. Vercel은 React 프레임워크로 가장 유명한 Next.js을 만든 곳이며 클라우드 호스팅 서비스도 한다.

배포는 Vercel에 가입한 뒤 내 GitHub의 레포지토리를 연동하면 자동으로 빌드하고 프로덕션을 배포해 준다. 이후 원격 레포지토리에 푸시할때마다 자동으로 업데이트해서 배포해 준다. Built-in CI/CD 너무 좋다. 또한 이 모든 것이 무료이다. 과금 플랜도 있지만 내 웹사이트 규모에서는 과금 정책이 바뀌지 않는 이상 무료일 거 같다. (이런 좋은 서비스를 제공해 주는 Vercel 팀에게 감사드립니다.)

급 마무리 느낌이 강하지만 개설기는 이 정도로 마치고 mtseo.dev에 대한 다음 포스팅은 검색 엔진 최적화로 풀어 나가 보려한다.

긴 글 읽어 주셔서 감사합니다.