본문 바로가기

취업과 기본기 튼튼

내 이력 하나씩 정리해보기

1. Data driven map 웹 어플리케이션 개발

기술 스택 : Mapbox GL JS, html5, css3, Flask, PostGIS, Navermap API
기간 : 2017. 12 ~ 2018. 01

  • 주차장 정보 제공 및 공유 어플리케이션을 운영하는 ‘모두의 주차장’이라는 회사에서 방학 한 달 동안 3명이 한 팀이 되어 진행한 프로젝트였습니다.
  • NSDI(국가공간정보포털)와 국토해양부에 오픈된 공공 데이터를 가지고, 서울에 있는 모든 주차장 데이터와 건물 데이터를 연결하여 데이터 간의 지리적 연관성을 분석할 수 있게 3D 데이터맵을 만드는 것이 목표였습니다.
  • 이후, Carto 와 같은 웹 어플리케이션에 영감을 받아, 유저가 직접 다양한 데이터를 올릴 수 있도록 하고 레이어 층을 만들 수 있게 하였습니다. 각 레이어의 색 지정을 통해 레이어간 구분하여 볼 수 있고, 데이터 값에 따라 색의 명도를 달리하여 보고자 하는 데이터의 범주를 구분하여 분석할 수 있도록 하였습니다. 이 과정 중, 데이터 조작과 렌더링을 위해 Mapbox GL JS울 사용하였고, 유저가 올린 데이터를 직접 관리해야 했기 때문에 PostGIS를 사용하게 되었습니다.
  • 한편, 어플리케이션을 보다 차별화하자는 목표로, 국내 지도 데이터를 가장 크게 보유하고 있는 Navermap DB와 API를 활용하여, 지역 검색과 스트릿 뷰 기능을 추가 하였고, 검색된 네이버 데이터를 공공건물 데이터와 연결하여 맵에 렌더링하고 레이어로 다룰 수 있게 하였습니다.
  • 매일 아침 저녁으로 팀원들 간 해야할 일, 완료된 일을 정리하는 시간을 가지며 프로젝트 내용을 공유하며 진행하였고, 저는 주로 JS와 jQuery, Mapbox GL JS를 이용하여 데이터 뷰와 렌더링 및 어플리케이션 UI 설계를 담당하였습니다.
  • 성공적인 팀 워크를 위한 프로세스를 느낄 수 있었고, 무엇보다 GeoData Visualization 및 Location Intelligence 에 관심을 갖게 되었습니다.

2. 나만의 지도 만들기 모바일 앱 개발

기술 스택 : Android, SQLite, Navermap SDK
기간 : 2018. 05.

  • 네이버 썸머 핵데이에서 1박 2일동안, 3명의 대학생과 1명의 현직 개발자분를 멘토로 둔 한 팀을 이루어 진행한 프로젝트였습니다.
  • 네이버 지도팀의 비공개된 SDK를 가지고 '나만의 지도 만들기' 안드로이드 앱을 만드는 것이 목표였습니다. 네이버지도의 검색기능을 통해 장소를 검색한 후, 해당 장소를 나만의 리스트로 만들고, 지도에 marker를 찍는 것이 주된 기능인 앱이었습니다.
  • 전체 UI 및 시나리오 설계, 검색 기능과 리스트 생성 그리고 지도에 리스트에 생성된 마커를 찍기로 나누어 개발을 진행하였습니다. 저는 전체 UI 및 시나리오 설계 파트를 담당했습니다.
  • 각 뷰 및 그에 대한 요구사항을 정확히 정의해야 했고, 계속해서 팀원들과 논의해야 했습니다. 보드에 그림을 각 뷰의 그림을 그리며, 1차 목표 기능설정을 합의하였고, 이후 2차 목표로, 3차 목표 설정까지 정하였습니다.
  • 생각보다 제 파트가 먼저 끝나, 1.5차 목표였던, SQLite 를 이용한 DB 연결을 담당하게되었습니다. 앱이 꺼져도 사용자가 저장한 리스트 내용이 사라지지 않도록 하는 작업이었습니다. 안드로이드에서 DB 관련 작업은 처음이었는데, 멘토님의 도움으로 네이버 SDK 소스에서 DBHelper 사용법을 익혀가며 제 코드에다가도 적용시켰습니다.
  • 시간이 부족하여 1.5차 목표까지 진행한 후, 프로젝트를 성공적으로 마무리 지었습니다. 앱이 목표한대로 성공적으로 실행되어 팀원 모두가 보람을 느낄 수 있었습니다.
  • 프로젝트 협업/관리 도구는 Source tree와 github를 이용하여 진행하였는데, branch, pull request, merge 는 이렇게 사용하며, 개발 협업은 이렇게 하는 것이구나 라는 것을 정말 깊이 느낄 수 있었습니다.
  • 한편, 매 pull request 마다 멘토님이 코드 리뷰를 달아주셨는데, 여기에서 내 코드가 어떤 것이 문제가 있는지, 현업 개발에서는 어떤 것이 중요한지 조금이라도 알 수 있었고, 이런 과정이 매우 즐겁고 가장 큰 배움이었습니다.

3. 실시간 환경정보 시각화 웹 대시보드 개발

기술 스택 : Mapbox GL JS, thinkspeak, html5, css3
기간 : 2018. 4 ~ 2018.5
링크 : https://github.com/Capstone-Design1

  • 학교 '캡스톤 디자인1' 수업에서 진행한 IoT 프로젝트로, 4명이 한 팀이 되어 진행한 프로젝트였습니다.
  • 교내 강의실에 아두이노 센서를 부착하여 환경 데이터를 모으고, 이를 기반으로 강의실의 환경 정보 및 비어있는지 유무를 학생들, 그리고 학교측 관리자가 보기 쉽도록 만드는 것이 목표였습니다.
  • 센서 코딩, 서버 개발, 학생들을 위한 웹프론트 개발, 그리고 관리자를 위한 대시보드 개발, 이렇게 총 4개의 파트로 나누어 진행하였습니다. 저는 관리자를 위한 대시보드 파트를 담당하였습니다.
  • 이전에 데이터 맵을 그려본 경험이 있었지만, 이번에는 교내의 강의실을 지도에 그려야 하므로, 직접 교내 강의실에 대한 지도 데이터를 만들어야 했습니다.
  • 각 강의실은, 건물별로, 층별로, 위치별로 다르므로, 각 데이터를 구분할 필요가 있었습니다. 또한 실제로 유저 차원에서도 보고싶은 강의실이 각각 다르므로, 건물 > 층 > 위치 로 depth를 두어 UI 설계를 진행하였습니다. 이에 대해 보여주는 지도도 다르게 설정하였습니다.
  • Mapbox api를 통해 아두이노 센서로 부터 데이터를 실시간으로 받아와 지도에 그려낼 수 있었습니다.
  • 보다 직관적인 시각화를 위해, 각 환경정보에 등급을 매겨, 지도 위쪽에 Legend로 표시하였고, 실시간으로 건물, 층, 강의실의 색상이 등급 색상에 맞춰 바뀌도록 하였습니다. 또한, 강의실 클릭 시, 해당 강의실 클릭시 해당 환경정보의 실시간 차트를 볼 수 있도록 하였습니다.
  • 이번 프로젝트에서는 데이터 시각화에 대한 고민, 그리고 직접 데이터 마이닝을 하여 실시간으로 데이터를 받아오는 것에 집중하였습니다.
  • 최종 발표날, 11개의 팀 중 4등을 수상하였습니다.

4. 스피드-데이팅 데이터 분석 및 매칭 예측 서비스 개발

기술 스택 : Jupyter notebook, seaborn, flask, html5
기간 : 2018. 7
링크 : https://github.com/Kaggle-Study-in-SV

  • 교내 해외 인턴십 사업으로 선발되어, 한 달동안 미국에서 3명이 팀이 되어 진행한 프로젝트 입니다.
  • 남녀 매칭에 대한 심리실험인 Speed dating experiment 데이터를 가지고, 실제로 유저로부터 필요한 정보를 입력받아, 해당 유저를 가장 만나고싶어할 것 같은 사람을 예측하여 알려주는 서비스를 만드는 것이 목표였습니다.
  • 저희 모두 데이터 전처리, 분석, 예측 모두 처음이었기에, 기간 4주 중 3주 정도가 jupyter notebook 을 이용하여, 데이터 사이언스 공부와 분석하는 시간이었습니다.
  • 데이터 전처리에 대한 내용 (결측치 처리)에 대해서 알 수있었고, 각 분석모델 (회귀 모형, 분류 모형), 그리고 피처분석 (correlation, lasso, ridge), 그리고 sci-kit learn을 이용한 예측모델 (decsion-tree, random-forest, svm, knn 등), 모델 검증(ROC Curve, loss function) 등에 대해서 알 수 있었습니다.
  • 사용한 데이터는 speed dating experiment 로, 약 6000개의 행과 190개의 col로 이루어진 설문조사 데이터였습니다. 여기서 적당한 데이터를 뽑아내, 어떤 상대가 나를 만나기를 원할까? (클래스 값은 0~1 까지의 실수 값) 를 예측하는 것이었는데, auc 값이 97% 정도 나오는 실험 값을 발견하여, 이를 서비스 단계로 올리는 작업으로 진행하였습니다.
  • python을 이용하면 편하기 때문에, flask 를 이용하여 서버를 프로그래밍 했습니다. 웹 페이지에서 사용자 데이터를 입력하면 이를 서버에서 받아 학습된 모델에 입력값을 받아 다시 웹페이지로 결과를 보내주도록 구현했습니다.
  • 학습된 모델을 서버에 올리고, 실시간으로 입력받아 예측 값을 출력해보는 재미있는 경험이었습니다.

5. 얼굴인식 제비뽑기 카카오톡 플러스친구 앱 개발

기술 스택 : MS Azure Face api, kakao 플러스친구 api, Facebook API, node.js, mongodb
기간 : 2018. 8
링크 : https://github.com/2018-sogang-hackathon

  • 서강대 해커톤 경진대회에서, 2박 3일동안 4명이 한 팀이 되어 진행한 프로젝트 입니다.
  • 카카오 플러스 친구를 통해 사진을 입력받고, 이를 MS azure face api의 얼굴인식 기능을 사용하여 감정분석 후, 특정 기준으로 한 명을 뽑아 그 한 명의 얼굴만 유저에게 출력해주는 것이 목표였습니다.
  • Node.js 서버 설계, Face api 탑재 및 페이스북 공유기능, Face api의 다른 기능 탐색 및 개발, 얼굴부분만 크롭하는 기능으로 파트를 나누어 진행하였습니다. 저는 Face api 탑재 및 페이스북 공유기능을 담당하였습니다.
  • MS Azure의 Face api를 어떻게 사용하는지 알게 되었고, 이를 서버에서 어떻게 탑재할 수 있는지 알게되었습니다. 더불어, facebook api 를 통해, 페이지를 어떻게 유저의 타임라인에 공유할 수 있게 하는지 배울 수 있었습니다.
  • Github와 Source tree를 이용하여 협업하였습니다.
  • 목표했던 모든 기능이 성공적으로 완성되어 카카오톡 플러스친구를 통해 배포하였고, 마지막 발표 날에 시연도 할 수 있었습니다. 결과적으로는 'Best Engineering' 상을 수상하였습니다.