Community

개발자 99% 커뮤니티에서 수다 떨어요!

← Go back
Project Tracker w/ Gantt Chart
#to_do_list
3년 전
636
2

1. 결과물 URL + 캡쳐 이미지 2~3장

https://todo-web-2e4dc.web.app/

undefined

*오늘 입력한 투두리스트는 차트에 표기는 되지만 그래프는 나타나지 않습니다(하루 이상 경과한 리스트에 한하여 나타남)

2. 자기소개

저는 대학교 졸업반 학생입니다. 컴퓨터 분야를 전공하기 때문에, 다양한 프로그래밍 언어 및 데이터 구조에 대한 이론 공부를 많이 했는데요, 졸업반이 되어보니 막상 내가 실제로 구현할 수 있는 서비스는 없다는 것을 깨닫고 크게 좌절하였습니다. 뭐라도 해야겠다는 조바심이 들었고, 결국 웹 프로젝트를 수행해보기로 정하였으며 친구의 권유로 클론코딩을 접하게 되었습니다.

3. 서비스 소개

프로젝트 트래킹을 위한 직관적인 간트 차트(Google API)를 제공하여 진행사항을 직관적으로 확인할 수 있습니다. 투두 리스트를 flex를 활용하여 세가지 부분으로 나누고, 중간에는 오늘 시작한 프로젝트/과제를 나열하며 왼쪽에는 전날 이전에 시작한 프로젝트를 나열합니다. 오른쪽에는 프로젝트를 시작한 날에 맞추어 간트차트를 시각화하여 제공합니다. 시각자료를 통해 프로젝트 진행상황을 쉽게 확인할 수 있습니다.

4. 개발 과정 (어려웠던 점과 해결방법)

로컬 스토리지에서 불러온 데이터를 Google API에 보내야하는데, 호출 순서가 뒤엉켜서 간트 차트가 아무런 시각자료를 제공하지 못하였습니다. 이를 해결하기위해서 스크립트 호출시 defer 기능을 활용하였습니다. 또한, 함수명이 모든 파일에 전역으로 적용되는 지 몰라서 같은 함수를 여러 스크립트파일에 나눠서 구현했었는데 나중에 깨닫고 하나의 파일에 정의된 함수를 여러 스크립트에서 사용할 수 있었습니다.

5. 앞으로 계획

취업에 대한 정보를 찾다보니 풀스택 개발자의 매력에 완전히 매료되어 진로를 그 분야로 정했고, 아직은 프론트엔드만 조금 배웠지만 node.js를 비롯한 다양한 언어를 사용해봐야겠다는 생각이 들었습니다.

p.s. 노마드 코더의 훌륭한 클론코딩 덕분에 새로운 분야에 눈을 떴습니다. 정말 감사드립니다.

2 comments