미국 CS 유학 준비 10편: 5분만에 완성하는 초간단 Resume/CV 작성 툴

안녕하세요!

지난 시간에는 resume에 넣을 재료에 대해 설명했습니다. 오늘은 resume를 예쁘게 만들어주는 툴을 소개해드리려고 합니다. 아직 resume에 무엇을 써야 할지 모르겠는 분들은 이전 편을 읽고 내용을 준비한 다음 다시 돌아와 주세요.

---

Resume 작성 툴

라떼는... 마이크로소프트 워드로 resume/cv를 작성했지만, 이젠 이런 새로운 툴도 있더라고요. 최근에 알게 되어 마침 여러분과 공유할 수 있게 되었습니다. 바로, resume.lol 라는 사이트입니다. 이 사이트는 markdown 파일과 css를 결합해 예쁜 레쥬메를 만들어줍니다. 예를 들면, 다음과 같은 모양을 쉽게 만들 수 있습니다.

적당히 대충 만들어본 예시 레주메

자, 그럼 이 툴을 어떻게 써야 하는지 함께 따라해 봅시다.

일단, 이메일 주소를 이용해 회원가입을 하시면 자동으로 My Resume라는 파일이 생깁니다. Open in Editor 버튼을 클릭해 에디터로 들어가시면, markdown 문서(resume.md)와 CSS 파일(resume.css)이 보일 거예요. CSS 파일은 예쁘게 만들어주는 스타일 지정 파일이며, 우리는 잘 건드리지 않을 거예요. 진짜 내용이 들어가는 문서는 resume.md 파일이고, 이걸 사용하기 위해서는 markdown 형식의 파일을 어떻게 사용하는지 조금 공부를 해야 합니다. 하지만 겁먹지 마세요, 전혀 어렵지 않아요.

My Resume 에디터를 오픈하면 다음과 같은 화면이 보입니다. 우리는 현재 켜져있는 파일 (resume.md)만 건드릴 거에요.

 

Markdown syntax 배우기

이 문서를 잘 사용하기 위해서는 딱 두 가지만 알면 됩니다. 헤딩과 리스트입니다.

헤딩은 # 으로 표시합니다. #은 첫 번째 수준, ##은 두 번째, ### 세 번째 순서대로 #를 하나 더 붙일 때마다 더 하위 레벨의 제목으로 설정됩니다. 예를 들어, 다음과 같은 markdown 문서가 있다고 한다면, Experience는 두 번째 레벨의 제목으로, Software Engineer, TikTok은 세 번째 레벨의 제목으로 들어가는 것입니다.

## Experience

### Software Engineer, TikTok

 

 

조금 헷갈릴 수 있지만, 오른쪽이 렌더링 된 모습을 보면, 샾을 두 개 혹은 세 개 붙였을 때 어떤 스타일로 글씨가 써지는지 비교할 수 있습니다. 중요한 것은, ## 다음에 꼭 띄어쓰기를 한 칸 추가해주셔야 한다는 것입니다.

 

다음은 리스트입니다. 리스트는 짝대기(-) 로 쓸 수 있습니다. 그럼 오른쪽 렌더링 된 화면에 동그란 bullet point를 볼 수 있을 거예요. 다음과 같은 markdwon에서 첫 번째 문장(You can~)은 plain text로, 두 번째와 세 번째 문장 (Built out ~, Worked on~)은 bullet point 뒤에 그려집니다.

 

You can include a blurb here explaining a bit about what you worked on
- Built out some feature on the For You Page
- Worked on a feature related to User Profiles

 

마찬가지로 왼쪽 markdown 문서와 오른쪽에 렌더링 된 결과물을 비교하면서 익혀보세요. 짝대기도 물론 - 뒤에 항상 띄어쓰기를 한 칸 추가하셔야 합니다. 이 정도만 알면 resume.lol 사이트에서 제공하는 서식을 충분히 활용할 수 있을 거예요.

더 자세한 markdown 사용법이 궁금하신 분들은 여기서 더 확인하실 수 있습니다. 저는 언제나 더 궁금해서 extra mile을 가는 분들을 응원해요 :)

CSS syntax 배우기

markdown 문서를 보면 대부분 그냥 읽고 넘어갈 수 있을 거예요. 문법도 아주 직관적이라서 모르는 것이 나오더라도 당황할 일이 없습니다. 다만, 가끔씩 소리 내어 읽기 어려운 코드 같은 것이 나올 거예요. 예를 들면, 이런 겁니다.

<span class="spacer"></span>
<div className="vertical-spacer"></div>

이런 것들은 CSS에서 넘어온 html 코드예요. 자세히 이해할 필요는 없고, 우리는 프로그래머 방식대로 이 친구들을 이해하면 됩니다. 어떻게요? 실험을 통해서요.

1. 예시로 주어진 markdown 문서에서 잘 모르겠는 코드를 지워 본다.
2. 오른쪽 렌더링에 어떤 변화가 생기는지 관찰한다.
3. 다시 지웠던 코드를 넣어본다.
4. 원래 있던 모양으로 되돌아가는지 관찰한다.

이렇게 실험해 보신다면 "<span class="spacer"></span>"는 코드를 중심으로 왼쪽과 오른쪽 글씨를 종이의 맨 왼쪽과 오른쪽으로 밀어붙이는 역할을, "<div className="vertical-spacer"></div>"는 위쪽 문단과 아래쪽 문단 사이에 여백을 만들어준다는 것을 알아낼 수 있습니다. 첫 번째 것은 보통 날짜/연도를 오른쪽 정렬로 보내기 위해 쓰고, 두 번째 것은 보통 섹션과 섹션 사이에 공백을 더 만들어주기 위해 쓰입니다.

손쉬운 템플릿으로 Resume 작성하기

자, 이제 templates 탭으로 이동해 봅시다. 그러면 다양한 resume tempalte이 보일 거예요. 잘 둘러보고 여러분 마음에 드는 것으로 복사해서 본인의 것으로 만들어 보시면 됩니다. 저는 이 템플릿을 추천해요. 이 템플릿을 기반으로 acadmeic용 resume/cv를 만들어 보았는데, 여기서 확인하실 수 있습니다. 링크로는 미리보기 혹은 pdf만 공유가 되던데, 이 소스파일을 혹시 원하시는 분이 계시다면 댓글로 이메일 주소를 남겨주시면 공유해 드리도록 하겠습니다.

---

이제 정말 입시 원서가 하나둘씩 완성되어 가네요. 석사과정 지원하실 분들은 요즘 마감일이 하나둘씩 다가오고 있던데, 제 글이 조금이나마 도움이 되길 바랍니다. 더 일찍 자주 올릴 것을 이제 와서 후회하네요..ㅎㅎ 내년 입시를 미리 준비하는 여러분들께 도움 될 수 있도록 남은 시리즈는 꼭 올해 안에 완성해 보겠습니다. 지켜봐 주세요 :)