나눔(Nanum) 프로젝트 설명서
정구범 jgb625@naver.com https://github.com/GubeomJeong
이성온 dltjddhs@gmail.com https://github.com/so3500
프로젝트 개요
프로젝트 명 나눔(Nanum): 개발 프로젝트 관리 웹 서비스
프로젝트 소개 나눔(Nanum)프로젝트는 프로젝트 관리를 지원하는 웹 서비스 입니다.
Nanum은 팀의 구성원들이 효율적으로 프로젝트(소스코드, 이슈)를 관리할 수
있도록 설계되었습니다.
프로젝트 세부 내용
프로젝트의 목적과 핵심기능, 주요 사용자를 말씀해주세요.*
Nanum의 핵심 기능은 개발 프로젝트 관리입니다. 사용자들은 프로젝트 소스를 작성하고, 서버에
결과가 반영됩니다. 프로젝트 팀원들은 실시간으로 프로젝트 소스코드를 수정할 수 있으며, 현재
누가 접속해서 어떤 소스를 수정하고 있는지 알 수 있습니다.
프로젝트를 진행하면서 이슈가 발생할 시 게시판을 통해 이슈를 공유할 수 있습니다.
프로젝트 구조
프로젝트에 사용한 언어, 아키텍쳐 등 전반적인 기술사항에 대해 설명해주세요.*
Front-end
Vue.js 라이브러리를 사용하여 single page application을 구현하였습니다. Vue.js의 vue-router를 사
용하여 하나의 페이지에서 많은 path를 사용할 수 있었습니다. Vue.js에서의 single file component
라는 것을 사용하여 .vue 파일 하나당 하나의 컴포넌트를 만들어 좀 더 유연하게 개발을 할 수
있었습니다. Axios를 이용하여 서버와 ajax통신을 구현하였습니다. ace editor를 사용하여 실시간 코
드 하이라이팅을 구현할 수 있었습니다. 다른 사람들과 실시간으로 코드를 수정할 수 있는 기능
을 구현하기 위해 sockjs와 stompjs를 사용하여 websocket을 통해 서버와 양방향 통신을 하였습
니다. 한 파일을 수정할 때 그 파일을 수정하고 있는 사람들에게 websocket으로 데이터를 전달해
주었습니다. 하나의 프로젝트가 가지고 있는 코드들을 관리하기 위해 파일 구조를 구현하였습니
다.
npm을 사용하여 버전관리와 패키지 관리를 하였으며, webpack을 사용하여 모듈을 효율적으로 관
리 하였습니다.
Back-end
Spring boot를 이용하여 개발을 진행하였습니다. Spring mvc를 사용하여 mvc 디자인 패턴으로 프
로젝트를 개발하였습니다. Database는 mysql을 사용하였습니다. Spring-jpa-data를 사용하여 객
체중심으로 개발을 할 수 있었습니다. Restful 규격에 맞게 api를 구현하도록 노력하였습니다.
Google oauth를 사용하여 좀 더 효율적으로 유저를 관리할 수 있게 하였습니다.
Gradle을 사용하여 빌드를 하였고, swagger를 사용하여 rest api에 문서를 좀 더 손쉽게 확인할 수
있었습니다. Docker를 이용하여 아마존 ec2서비스에 효율적으로 배포를 할 수 있었습니다.
프로젝트 활용분야 및 향후 발전 방향
 프로젝트 빌드 기능 추가
 깃허브와의 연동을 통하여 개발중인 소스코드 공유 활성화
 이슈 관리 기능 추가 주제 관련 tag, 사용자 언급 tag 기능 추가(github 참고)
 알림 기능(프로젝트, 이슈 관련)
 실시간 채팅(음성채팅)
 프로젝트 유저들의 활동 기록을 저장하고 분석하여 의미 있는 자료를 도출

d2_5th_나눔 프로젝트 설명서

  • 1.
    나눔(Nanum) 프로젝트 설명서 정구범jgb625@naver.com https://github.com/GubeomJeong 이성온 dltjddhs@gmail.com https://github.com/so3500 프로젝트 개요 프로젝트 명 나눔(Nanum): 개발 프로젝트 관리 웹 서비스 프로젝트 소개 나눔(Nanum)프로젝트는 프로젝트 관리를 지원하는 웹 서비스 입니다. Nanum은 팀의 구성원들이 효율적으로 프로젝트(소스코드, 이슈)를 관리할 수 있도록 설계되었습니다. 프로젝트 세부 내용 프로젝트의 목적과 핵심기능, 주요 사용자를 말씀해주세요.* Nanum의 핵심 기능은 개발 프로젝트 관리입니다. 사용자들은 프로젝트 소스를 작성하고, 서버에 결과가 반영됩니다. 프로젝트 팀원들은 실시간으로 프로젝트 소스코드를 수정할 수 있으며, 현재 누가 접속해서 어떤 소스를 수정하고 있는지 알 수 있습니다.
  • 2.
    프로젝트를 진행하면서 이슈가발생할 시 게시판을 통해 이슈를 공유할 수 있습니다.
  • 3.
    프로젝트 구조 프로젝트에 사용한언어, 아키텍쳐 등 전반적인 기술사항에 대해 설명해주세요.* Front-end Vue.js 라이브러리를 사용하여 single page application을 구현하였습니다. Vue.js의 vue-router를 사 용하여 하나의 페이지에서 많은 path를 사용할 수 있었습니다. Vue.js에서의 single file component 라는 것을 사용하여 .vue 파일 하나당 하나의 컴포넌트를 만들어 좀 더 유연하게 개발을 할 수 있었습니다. Axios를 이용하여 서버와 ajax통신을 구현하였습니다. ace editor를 사용하여 실시간 코 드 하이라이팅을 구현할 수 있었습니다. 다른 사람들과 실시간으로 코드를 수정할 수 있는 기능 을 구현하기 위해 sockjs와 stompjs를 사용하여 websocket을 통해 서버와 양방향 통신을 하였습 니다. 한 파일을 수정할 때 그 파일을 수정하고 있는 사람들에게 websocket으로 데이터를 전달해 주었습니다. 하나의 프로젝트가 가지고 있는 코드들을 관리하기 위해 파일 구조를 구현하였습니 다. npm을 사용하여 버전관리와 패키지 관리를 하였으며, webpack을 사용하여 모듈을 효율적으로 관 리 하였습니다. Back-end Spring boot를 이용하여 개발을 진행하였습니다. Spring mvc를 사용하여 mvc 디자인 패턴으로 프 로젝트를 개발하였습니다. Database는 mysql을 사용하였습니다. Spring-jpa-data를 사용하여 객 체중심으로 개발을 할 수 있었습니다. Restful 규격에 맞게 api를 구현하도록 노력하였습니다. Google oauth를 사용하여 좀 더 효율적으로 유저를 관리할 수 있게 하였습니다. Gradle을 사용하여 빌드를 하였고, swagger를 사용하여 rest api에 문서를 좀 더 손쉽게 확인할 수 있었습니다. Docker를 이용하여 아마존 ec2서비스에 효율적으로 배포를 할 수 있었습니다.
  • 4.
    프로젝트 활용분야 및향후 발전 방향  프로젝트 빌드 기능 추가  깃허브와의 연동을 통하여 개발중인 소스코드 공유 활성화  이슈 관리 기능 추가 주제 관련 tag, 사용자 언급 tag 기능 추가(github 참고)  알림 기능(프로젝트, 이슈 관련)  실시간 채팅(음성채팅)  프로젝트 유저들의 활동 기록을 저장하고 분석하여 의미 있는 자료를 도출