서론

저는 이력서를 하나 갖고 있습니다. 모든 개발자가 그렇지는 않지만, 개발자라면 왠지 깃헙 페이지로 이력서를 만들어야 한다는 생각이 있었기 때문일지도 모르겠습니다. 그동안 로켓펀치나 원티드 등의 자체 이력서를 좀 더 활용하는 편이였는데, 코드 베이스가 파편화되면 유지보수하기 번거로운 것처럼 이력서도 그러했습니다.

그래서 약 6개월 전에 템플릿 엔진 기반으로 뚝딱뚝딱 만들었습니다. 나름 예쁘게 보이기 위해 스케치로 고민하고, 제플린으로 확인하는 작업을 통해 '그럴싸하게' 만들었었죠. 디자인은 나름 최대한 예쁘게 하려고 노력했습니다.

image.png

그리고 최근, 이력서는 틈틈히 관리해야 한다는 의견을 자주 접했기에 이력서를 유지보수하기로 했습니다. 템플릿 엔진을 걷어내고 리액트로 새로 만들고는 싶지만 가장 쉽게 할 수 있는 도메인부터 연결하기로 했습니다.

도메인 구입

최근에 닷데브(.dev) 도메인을 연 12$에 구매할 수 있게 되었습니다. 개발자로써 정말 탐나는 도메인이 아닐 수 없습니다. 먼저 get.dev 에서 도메인을 구매할 수 있는지 확인했습니다. 여러 도메인을 검색해봤는데 괜찮은건 이미 사용중이고, 사용중이 아니면 프리미엄이었습니다.

image.png

저는 제 아이디를 따서 iamchanii.dev 라는 도메인을 구매하려다, CNAME 이나 A레코드를 붙여서 사용하자니 너무 긴 것 같아서 짦은 것을 고민하다 imch.dev 라는 도메인으로 구입했습니다. 약간의 팁을 드리자면, 하이픈이 붙은 도메인은 세글자여도 프리미엄이 아니더라구요. 개인적으로 선호하지는 않았지만 하이픈이 붙어도 괜찮다면 상관 없을 것 같습니다.

최종적으로 결정 후 도메인 구매는 godaddy.com에서 했습니다.

네임서버 변경

고대디에서 도메인 구입을 마치면 DNS 관리도 할 수 있지만, 개인적으로 고대디에서 관리하는게 편리하지는 않고 조금 느린 것 같아서 다른 DNS 서비스를 이용하기로 했습니다. dnszi.com 에서 관리하기 위해 dnszi 네임서버 주소로 변경 해 줍니다.

image.png

깃헙 페이지 도메인 연결

이력서 프로젝트 리포지토리 Settings → Option 에 가면 사진과 같이 커스텀 도메인을 등록할 수 있는 곳이 있습니다. 저는 resume.imch.dev 라는 주소로 연결하기 위해 Custom Domain 에 입력 후 Save 버튼을 눌렀습니다.

image.png

저장된 이후, master 브랜치를 살펴보면 CNAME 이라는 파일이 커밋되어 있음을 확인할 수 있습니다.

DNS 관리

깃헙 페이지 설정에서 저장한대로 resume.imch.dev 주소로 연결하기 위해서 DNS 관리가 필요합니다. dnszi에 접속 후 CNAME 관리 페이지에서 사진과 같이 추가했습니다.

image.png

CNAME 값에는 resume 을, 목적지(연결) 도메인에는 iamchanii.github.io 를 입력했습니다. 커스텀 도메인 도움말 페이지를 참고해보면 루트 도메인(apex domain)의 경우 A(ALIAS, ANAME)레코드로 등록하고, www 또는 커스텀 서브 도메인은 CNAME으로 연결하라고 나와있습니다. 이걸 모르고 서브 도메인에 A레코드를 추가하고 접속하니 https 인증서 오류가 발생하여 접속할 수 없는 이슈가 있었습니다.

DNS 관리 이후 최대 24시간정도 지나야 적용될 수 있다고 하는데 저는 약 10분정도 이후부터 정상적으로 도메인이 연결되었습니다.

접속해보자

한번 연결된 도메인으로 접속 해 봤습니다.

image.png

안타깝게도 index.html 파일을 제외한 statics 파일들이 정상적으로 요청되지 않는 문제가 발생했습니다. (참고로 이 문제는 저한테만 발생하는 이슈입니다. 아마 다른분들은 정상적으로 작동하실거에요.)

image.png

네트워크 탭을 확인 해 보니 올바르지 않은 주소로 요청하고 있음을 확인했습니다. 아마 다음편은 이 문제를 해결하는 작업을 해야 할 것 같습니다. 아니면 일단 두고 리액트로 다시 작업하는 이야기가 될 지도 모르겠습니다.