📝 개발자를 위한 Portfolist 제작기

21년도 9월부터 11월까지 제작한 Portfolist를 소개해보려고 합니다. 제작한지는 꽤~ 됐고 2월달에 글 써둔게 아까워 ㅎㅎ.. 이렇게 후기를 남겨보려합니다!
Portfolist는 portfolio + list 를 합친 합성어이며, “포트폴리오를 공유한다”라는 의미를 지니고 있습니다. 저희는 왜 Portfolist를 개발하였는지, 어떤 기능들이 있는지 여러분들께 소개할 것입니다. 그리고 실사용 유저를 받아보고 서비스를 운영해보기 위해 이 글을 포스팅합니다. (서버가 닫혔습니다....)

Portfolist는 어떤 서비스인가요?

포트폴리스트는 개발자들을 위한 포트폴리오를 간편하게 제작하고 공유할 수 있는 서비스 입니다.

개발 배경

포트폴리오의 중요성

개발자들은 취업하거나 이직할때 포트폴리오는 필수 조건입니다!
어떤 경험을 쌓아왔는지를 알기 위해 회사에 제출해야되는 필수적인 서류 중 하나로 포트폴리오를 요구합니다. 따라서 포트폴리오를 자신의 실력이 잘 드러나게 작성하는 것도 취업 성공의 많은 부분을 차지합니다. 그러나 처음 포트폴리오를 작성할 때에는 어떤 내용이 들어가야 하는지, 어떤 형식으로 작성해야 나를 잘 어필하고 표현할 수 있을지 막막하기만 하죠 😥

그래서 사람들은 다양한 포트폴리오 예시를 찾아 자신의 포트폴리오의 방향성을 잡고 제작에 들어갑니다.

떠올렸던 아이디어 🧐

포트폴리오의 예시를 찾아보게 될 때 포트폴리오 찾기까지의 많은 서치를 요구하여 매우 번거롭고 시간을 뺏기는 느낌을 많이 받았습니다. 그 후 포트폴리오를 한군데 모아서 볼 수 있으면 좋겠다 라고 생각했습니다.

또한 “개발 기술들에 대해서는 블로그도 있고 많은 소통을 하고 있는데 왜 포트폴리오를 공유하면서 소통을 요구하는 서비스가 없지?” 라는 의문에 빠지게 되었습니다.

그래서 저희는 포트폴리오를 제작하고 공유하여 소통을 할 수 있는 포트폴리오 공유 서비스를 만들어 불편함을 해결하고자 합니다.

Portfolist 개발 목표는 무엇일까?

✅ 포트폴리오 작성을 해야하는데 시작이 막막한 사람들에게 사용자가 올린 포트폴리오들을 공유하여 자신만의 독창성있는 포트폴리오 제작의 방향성을 잡을 수 있도록 도움을 줍니다.

✅ 포트폴리오에 대해 여러 사람들과 댓글, 터칭 기능을 통해 활발한 소통을 하며 정보 공유 또는 피드백이 이루어져 어제보다 더욱 성장한 나로 발전할 수 있는 기회를 만듭니다.

✅ 사람들이 스스로 발전을 하고 싶어도 무엇을 해야 하는지 방향을 잡지 못하는 사람들은 자신과 분야와 같은 사람들의 포트폴리오를 통해 자신만의 로드맵을 설정할 수 있도록 도와줍니다.

🛠 사용 기술

프론트엔드 : React, Emotion, React-query, Recoil

처음 개발을 시작했을때에는 Recoil을 사용하여 모든 상태를 관리했습니다.
하지만 점차 시간이 지날 수록 Recoil의 불편한 점도 생기기 시작했고, 유동적으로 데이터가 패칭되기를 원하는 저희 서비스와 달리 계속 리패칭을 해줘야 됐습니다.
그래서 후반에 React-query를 도입하게 되었고 포트폴리오가 등록됨에 따라 유동적으로 데이터가 변화될 수 있도록 데이터를 처리했습니다.

서비스 기능

포트폴리스트는 수 많은 기능들이 있지만 꼭 있어야 하는 대표 기능 3가지를 소개하려고 합니다.

• 포트폴리오 제작, 포트폴리오 공유, 포트폴리오 열람, 마이페이지

✏️ 간편하게 만들어보세요!

포트폴리오를 만들기 위한 탬플릿을 사용하여 사용자들이 자유롭게 포트폴리오를 제작할 수 있습니다.

Portfolist에서 제작한 포트폴리오가 아닌, 포트폴리오를 제작한 작품이 있거나 링크가 있다면 PDF 형식의 파일 혹은 링크를 첨부하여 자신의 포트폴리오를 쉽게 공유 할 수 있습니다.

📚 쉽게 공유해요!

포트폴리오를 공유하게되면 공개 희망한 사용자만 포트폴리오 트랜링에 표시됩니다.

🔎 분야 필터링 검색

자신이 보고 싶은 분야를 선택하여 포트폴리오를 필터링 할 수 있습니다.

포트폴리오는 최신순, 오래된순으로 정렬하여 볼 수 있습니다.

포트폴리오 카트에 있는 터칭 아이콘을 선택하여 나의 반응을 표현 할 수 있습니다.

🔎 검색

특정 단어 검색이나, 사용자의 이름을 작성하여 포트폴리오를 검색 할 수 있습니다.

📜 포트폴리오 열람

👀 다양한 포트폴리오를 상세하게 열람할 수 있습니다.

🧡 터칭(좋아요) 기능을 통해 가장 많은 터칭을 받은 사용자에게는 이달의 포트폴리오에 등록 될 수 있습니다.

💬 포트폴리오에 대하여 댓글과 대댓글 작성/삭제 할 수 있습니다.

⚠️ 부정적인 댓글은 신고 기능을 통하여 댓글을 신고 할 수 있습니다.

주요 타겟 고객은?

주요 타겟 고객이 누가 될 것 인지에 대하여 여러가지 가설을 세워 보았습니다!

포트폴리스트의 주요 타겟 고객을 설정하여 가설을 세워보았습니다.

취업 준비생 - 자신에 대한 정보를 공유함으로서 자신을 알리고, 다른 포트폴리오을 보며 자신의 로드맵을 설정하며 취업에 준비할 포트폴리오를 제작할 수 있습니다.

ex) 현재 개발자로 취업을 원하는 A씨가 다른 사람들의 포트폴리오를 통해서 자신의 부족한 점을 알고, 그 점을 보완하기 위해 새롭게 로드맵을 설정하고, 공부를 하였다.

학생 - 다양한 포트폴리오를 통해 자신이 나아갈 방향을 설정할 수 있습니다.

ex) 현재 대마고에 다니는 B학생은 개발자로서의 성장을 원하여 개발자의 포트폴리오를 보며 자신이 어떤 것을 공부해야 하는지 깨닫고 자신이 나아갈 방향을 설정하였다.

ex) 현재 대마초에 다니는 초등학생 A학생은 대마고에 다니는 B학생의 포트폴리오를 보고 개발자의 꿈을 키워나가, 개발자가 되기 위해 대마중을 졸업하고 대마고에 들어갔다.

기업 - 많은 사람들의 포트폴리오를 간접적으로 접하여 인재를 구할 수 있습니다.

ex) 좋은 인재를 원하는 S사에서 재직하는 C 팀장이 평소에 포트폴리스트를 자주 보는데, 어느날 포트폴리오를 보고 좋은 인재가 있는 것을 발견했다, S사에 지원해보지 않겠냐고 지원을 권유하였다. 그 인재는 S사에 지원하여 합격을 하였고, S사는 좋은 인재를 구했다.

재직자 - 자신의 경험을 통해서 다른 사람들에게 조언을 줄 수 있고 자신의 포트폴리오를 공유하여 자기 만족, 성취도를 얻을 수 있고 좋은 조건으로 이직을 권유 받을 수 있습니다.

ex) 대마 회사에 다니는 D씨는 포트폴리스트에 자신의 포트폴리오를 게시하게 되었다. S사 회사에서 D씨의 포트폴리오를 보고 이직을 권유하여, 좋은 조건으로 D씨는 S사으로 이직했다.

회고

3개월 동안 회의하고 개발하면서 아이디어가 너무 좋다고 생각했습니다. 그래서 꼭 배포해서 실사용해보자라고 다짐했지만 방학이 된 저희는 흐지부지하게 흩어지는 것 같아 지금이라도 배포하게 실서비스를 도입해보자하여 이렇게 배포까지하게 되었습니다. 배포를 하면서 스스로 QA도 해보게 됐고 QA가 정말 중요하다는 것을 알게 되었던 프로젝트였던 것 같습니다. 무작정 개발을 한것이 아니라 제안서, 기획서, 디자인, 개발 다같이 진행했던거라 어렵고 힘들긴 했지만 모두 열심히 만들어 뿌듯했던 것 같아요. 팀 전부 실사용 서비스도 처음이고 열심히 제작하고 만든 것이니 여러분 모두 한 번씩 사용해 주시고 피드백 남겨주시면 좋을 것 같습니다. 그리고 기회가 된다면 코드리뷰까지 남겨주시면 정말 감사할 것 같습니다!!

긴글 읽어주셔서 감사해요!

https://github.com/DSM-Portfolist
https://www.youtube.com/watch?v=TE1TaYrIe44