본문 바로가기

개인 프로젝트/포트폴리오 프로젝트

[200927] 웹 포트폴리오 개발 일지 01

(27일에 작성하였으나, 29일에 업로드)

- 서론


3학년 때 웹 프로그래밍 과목을 수강하면서 만든 웹 포트폴리오 사이트가 있는데, 1년이 지난 지금 다시 열어보니 아쉬운 점이 많이 보였다. 어거지로 때려넣은 materialize 코드는 물론이고, 취업에 대해 깊이 고민해보지 않고 작성한 내용들도 썩 만족스럽지 않았다. 웹을 갓 배우던 시절에 연습처럼 만든 프로그램이라 더 그랬던 것 같다. 무엇보다 백엔드 개발자를 희망하는 나로썬... 이대로는 부족하다는 느낌이 들었다. 그래서 웹 포트폴리오를 시작부터 다시 만들기로 하였다. 

 

블로그에 개발과정을 하나부터 열까지 기술하고자 한다. 이렇게 하면 내가 생각을 정리하기에도 좋겠다는 생각이 들었고, 동기부여에도 도움이 될 것 같다. 

 

 

- 왜 웹 형식의 포트폴리오를 선택하였는가?


난 아무것도 모르는 취준생이라 먼저 포트폴리오를 어떻게 작성해야하는지부터 찾아보았다. 자주 작성되는 형식은 pdf(한글 파일을 포트폴리오로 첨부하는건 비추라고 한다!), 구글 docs, 웹 사이트, 최근에는 Notion을 사용하는 경우도 많다고 한다.

이 중에 웹을 만들어서 내 포트폴리오를 만들기로 한 이유는... 첫 번째는 단순히 그게 멋져보인다는 이유다! 내가 전공 공부를 하면서 가장 만들어보고 싶었던 건 웹이었다. 3학년 때 만든 포트폴리오도 지금은 별로라고 느껴지지만, 당시에 사이트를 만들면서 뿌듯하고 만족스러웠던 기억은 생생하게 남아있다. 내 웹 사이트가 있다는 게 멋지지 않은가. (이 말은 그때 강의를 진행하셨던 교수님이 하신 말이기도 하다.) 취준에 급한 마음에 시간이 덜 걸리는 방법으로 포트폴리오를 정리할까 하는 생각도 들었지만, 한편으로는 그렇게 하고싶진 않았다. 두 번째로는 지난 학기에 배운 jsp를 다시 복습해보고 싶기도 해서이다. 

 

 

 

- 프로그램 분석


 

- 요구사항 

  • 나를 소개하는 메뉴가 있다. (소개)
  • 내가 보유한 기술 스택을 알려주는 메뉴를 만든다. (기술 스택) 
  • 내가 참여한 프로젝트를 정리하는 메뉴를 만든다. (프로젝트)
  • 프로젝트는 이름, 제작 기간, 사용 도구, 간략한 설명, 나의 역할(거의 모든 프로젝트가 팀 프로젝트이기 때문에...), 이미지, 시연 동영상이 있다면 그것과 깃허브 주소를 함께 보여준다. 
  • 내 연락처를 알려주는 메뉴를 만든다. (연락처)
  • 관리자 인증 기능이 있다. (회원가입 기능이 있는 건 아니다.) 
  • 관리자는 자신의 계정 정보를 수정할 수 있다. 
  • 관리자는 기술 스택 메뉴에서 기술 스택을 추가, 수정, 삭제할 수 있다. 
  • 관리자는 프로젝트 메뉴에서 프로젝트를 추가, 수정, 삭제할 수 있다. 

 

또한, 개발 도중에 새로운 요구사항이 생기면 추가될 수 있다. 

 

요구사항을 생각하면서 구글링을 통해 전 세계 개발자 분들의 웹 포트폴리오에 방문하고 참고해보았다. 감사합니다. 

또한 아래 블로그가 많은 도움이 되었다. 감사합니다. 

geonlee.tistory.com/9 

 

[포트폴리오] 👨‍💻 나만의 개발자 포트폴리오 만들기

👋 들어가며  나는 취업을 준비하면서, 네이버 핵데이 인턴 이후 채용에 필요한 서류를 준비하면서 개발자용 포트폴리오를 만들고 기획해왔다. 컴퓨터 공학과 대학생들은 대부분 취업시기가 �

geonlee.tistory.com

 

- 사용 도구

  • java, servlet/jsp, spring
  • html, css, javascript, bootstrap
  • mysql
  • github

excel 파일을 사용해서 요구사항에 번호를 매기고 완성도를 기록한다. 

웹 호스팅은 카페24를 사용할 것 같으나... 이건 더 찾아보고 결정하게 될 것 같다. 

 

 

- 어떻게 구현할건지?

  • 부트스트랩을 사용하되, 템플릿을 그대로 사용하지 않고 고쳐가면서 웹 UI를 제작할 예정. 
  • 기술 스택, 프로젝트 메뉴는 게시판 기능과 유사하게 구현할 예정. 변경이 잦은 메뉴에 대해 웹 코드를 직접 고치지 않고도 내용을 추가하는 것이 목적이다. 
  • 관리자 계정이 존재한다는 점에서 보안에 유의한다. 
  • 단위 테스트를 진행한다. 

 

 

- 개발 일정


전체 개발 기간은 3달, 65일로 계획한다. 더 늦어지는 일이 없었으면 좋겠다... 

 

간단한게 간트차트도 만들어보았다. 

 

 

간트차트는 항상 이 블로그를 참고해서 만든다. 알기 쉽게 설명이 되어있고 완성품도 예쁘다. 감사합니다. 

ttend.tistory.com/530

 

엑셀차트] 엑셀로 간트 차트 만들기

엑셀을 이용해서 간트 차트를 만들어보자. 간트 차트를 만들어주는 전문적인 프로그램도 있지만, 엑셀의 차트 기능으로 간단하게 만들어보자. 아래 그림처럼 일정이 있을 경우 표 전체를 선택��

ttend.tistory.com

 

 

- 향후 계획


먼저 UI 설계를 하고, 카카오 오븐을 사용해서 프로토타입을 만들어 볼 생각이다. 다음 포스팅이 카카오 오븐 사용 후기가 될 수도 있겠다. 

 

이후에 블로그에 해당 프로젝트 관련 글을 올리는 건 프로젝트 진행에 문제가 생겼거나, 문제 해결법을 정리해서 올리거나, 프로젝트가 크게 진행되었을 때일 것 같다. 지금 넘치는 열정만큼 끝까지 잘 마무리지을 수 있으면 좋겠다.