이직 준비
올 초부터 이직을 준비했고 상반기에 진행했던 프로그래머스의 Dev-Matching에 지원하여 새 보금자리를 구했다.
이 과정에서 가장 고민했던 내용은 '포트폴리오를 어떻게 구성하느냐' 였던 것 같다.
누구나 따라할 수 있는 포트폴리오 제작 기법을 공유하고자 이 글을 작성하게 되었다.
포트폴리오는 무엇으로 만들까?
처음 취업을 준비했을 땐 대부분 대기업 신입 개발자 공채에 지원했고 포트폴리오는 크게 중요하지 않았다.
하지만 지금은 경력직으로 지원하는 것.
잘 짜여진 개발자 포트폴리오가 필요했다.
무엇으로 만들까 고민은 했지만 결국 전형적인 선택지밖에 없었다.
- Power point
- Github.io 블로그
처음에는 파워포인트로 시도했다.
괜찮다는 템플릿을 받아서 작업했는데 뭔가 맘에 들지 않는다.
내가 디자인 감각이 없다는 것을 다시 한번 깨달으며 문서를 삭제한다.
개발자로서는 github.io 블로그가 좋은 선택일 수 있으나 이미 티스토리를 운영하고 있는 시점에서
단지 포트폴리오를 위해 하나 더 운영하고 싶지는 않았다.
다른 선택지가 있을까?
데브매칭 신청 가능 기업 목록 중 당근마켓이 눈에 띄었다.
보통 회사들은 전용 홈페이지를 하나씩 구축하지만 특이하게도 당근마켓은 노션을 사용하여 회사 소개용 홈페이지를 제작했다.
나는 지금까지 노션을 마크다운 에디터로만 사용했다. 당근마켓 팀 페이지에서 아주 좋은 영감을 얻게 되어 작업을 시작했다.
시작하기
먼저 왼쪽 페이지 탭에서 Add a page를 눌러 새 페이지를 만든다.
노션에서 기본으로 제공하는 템플릿 중 Job Applications가 있는데, 이 것을 활용해도 된다. 나는 직접 만들었다.
제목 부분에 마우스를 대면 팝업으로 Add icon, Add cover 가 나타난다.
icon엔 본인 사진을, cover는 적당한 배경 사진을 하나 구해서 올려보자.
나는 개발자스러운 느낌의 배경 화면을 활용하였다.
배경 사진과 아이콘을 넣었다면 프로필을 만들어보자.
프로필 만들기
개발자가 프로필에 쓸 수 있는 항목은 무엇이 있을까?
- 간단 소개
- 학력
- 연락처
- 경력
- 수상
- 자격증
- 블로그
- 깃허브
본인이 원하는대로 마음껏 추가해보자.
이모지를 넣고 Heading 2 크기의 글씨로 제목 행을 표현했다.
구분선 하나를 넣은 뒤 원하는 내용을 기입한다.
그리고 드래그하여 제목 행 + 구분선 + 내용을 선택하면 왼쪽에 + 아이콘, 점 여섯개 아이콘이 나타난다.
점 여섯개 아이콘을 누르고 위치를 옮길 수 있다.
위 사진은 각 항목들을 드래그하여 횡으로 구성한 결과이다.
프로젝트 정보
포트폴리오를 검토하는 사람이 가장 눈여겨볼 항목이다.
개인 프로젝트 / 경력 기술서를 횡으로 배치하고 하위 항목은 Subpage를 활용했다.
Subpage는 클릭하여 새로운 페이지로 이동할 수 있다.
노션에서 /를 입력하면 할 수 있는 명령의 목록이 나타나는데, 두 번째 메뉴(Page)를 선택한다.
밑 줄이 있는 나의 프로젝트 1 (Android)를 클릭하면 새로운 페이지로 이동한다.
노션으로 만든 웹페이지가 익숙하지 않을 수 있는 포트폴리오 검토자를 위해 클릭하여 이동한다는 메시지도 기입해보자. 😀
서브 페이지
클릭하여 넘어갈 수 있는 서브 페이지에도 내용을 채워준다.
필요하다고 생각되는 항목을 마구마구 채워넣으면 된다.
필요하다면 서브 페이지에서 또 서브 페이지로 연결하는 등 유기적으로 구성하여 보기 좋게 꾸며준다.
나는 프로젝트 보고서 항목에 기존에 작성했던 프로젝트 보고서를 PDF로 만들어 첨부했다.
/를 눌러 PDF 항목을 생성하고 그 위에 PDF 파일을 드래그하여 옮기면 끝이다.
이미 만든 문서가 있다면 꼭 활용해보자.
기술 스택
자기소개서를 작성하다 보면 사용할 줄 아는 기술을 상/중/하로 표현하라는 회사가 있다.
기술 스택 표현에도 단계를 표현해주는 것이 좋겠다고 생각했다.
내가 가진 기술을 3단계로 표현하되, 가장 잘 쓰고 있는 기술을 눈에 띄게 보이고 싶었다.
노션에는 데이터베이스라 불리는 블록이 있다.
기능이 매우 출중하여 노션의 꽃이라고도 불린다.
그 중 Board가 3단계를 표현하는 데에 가장 보기 좋다고 생각했다.
취향에 따라 Table 등 다른 선택지도 고려할 수 있다.
여기도 클릭해서 읽을 수 있으므로 꼭 메시지를 남겨주자. 😄
각 항목들도 Subpage와 유사하다고 보면 된다.
왼쪽부터 상/중/하의 순으로 나열했는데, 상/중/하로만 표현하면 밋밋해서 조금 바꾸었다.
인프라는 ⚙️, 프로그래밍 언어나 기술은 ✔️ 이모지를 사용하여 표현했다.
포스팅을 하며 안 사실이지만 ✔️는 윈도우에선 녹색의 이쁜 V표시라서 사용했는데 맥에선 검은 색이라 잘 안보인다.
운영체제에 따라 아이콘의 모양이 다를 수 있다는 점, 꼭 주의하도록 하자.
마무리
간단히 감사인사 정도를 남기고 포트폴리오 작성을 끝낸다.
잊지 말아야 할 것은 내 포트폴리오를 타인에게 공유하는 것이다.
열심히 작성했는데 타인이 볼 수 없다면? 😅 만들 이유가 없지 않을까?
상단의 Share 버튼을 눌러 외부에서 접속 가능하도록 설정할 수 있다.
공유는 생성되는 URL을 활용한다.
후기
포트폴리오를 만드는 건 참 어렵고 귀찮은 일이다.
보기도 좋은 떡이 먹기도 좋다고, 잘 정리한 포트폴리오가 눈에도 잘 들어온다.
반대로 내용이 좋아도 가독성이 영 나쁘다면 내 경험을 올바르게 알리기가 어려울 수 있다.
노션은 키보드에서 슬래시(/)를 입력하기만 하면 사용할 수 있는 모든 요소들을 나열해주고,
적절한 요소를 적절하게 사용하여 적절하게 배치하기만 해도 꽤 보기 좋은 웹페이지를 뚝딱 만들 수 있다.
필자는 매우 간단한 요소들만을 사용하여 구성했지만 테이블이라거나 리스트를 활용하여 더 다채롭게 꾸미는 방법도 있다.
원래도 노션을 매우 좋아했지만 포트폴리오 작성 이후 노션의 활용 빈도가 굉장히 높아졌다.
그리고 주변 사람들에게 노션을 적극 추천하고 있다. 😆
사용했던 포트폴리오 양식은 아래 링크를 눌러 확인해볼 수 있다.
우측 상단의 Duplicate를 누르면 본인의 계정으로 복사할 수 있다.