SeongJae Oh

IDUCS

  • 규모: 팀 프로젝트
  • 팀 인원: 3명
학과 내 전공동아리 동기 2명과 함께 모여 학과 내 커뮤니케이션이 부족하다 생각되어 2020 노원구 창업대전에 출품할 학과 웹사이트를 제작했습니다.

Project Environment

  • JSP - Spring Framework
  • Apache Tomcat 8.5.65
  • MariaDB 10.1
  • MyBatis 3.4.4
  • Free Bootstrap Theme

프로젝트 개발 동기 및 개요

학과 내 LMS 웹페이지는 학생들끼리 적극적인 소통이 부족하다 생각되어 2020 노원구 창업대전에 출품할 겸 전공동아리 두명과 함께 스프링 프레임워크로 커뮤니티 웹앱을 제작해보자는 취지로 시작했습니다. 프로젝트 임시 이름이자 홈페이지 단추인 BeAmBi의 뜻은 야망을 가져라 라는 뜻의 Be Ambitious의 약자입니다.

현재 개발했던 이전 노트북의 자료가 전부 소실되어 프로젝트 개발 막바지의 임시 배포용 파일로 서버에서 구동중입니다.
메인페이지의 패널 일부의 수치가 정상적으로 표시되지 않습니다.
작업했던 팀원들과 최대한 자료를 끌어모아 중간 작업 소스를 지속적으로 수정중입니다.

프로젝트 스크린샷

image
image
image
image

프로젝트 코드 일부

1
2
3
4
5
6
7
8
9
10
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.js"></script>
...
<textarea id="summernote" name="content"></textarea> 
...
$('#summernote').summernote({
    placeholder : '이곳에 본문 작성 ',
    tabsize : 2,
    height : 230
});
cs

SummerNote 스마트에디터 적용을 위한 코드 일부분

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<bean id="dataSource" class="org.springframework.jdbc.datasource.DriverManagerDataSource"> 
    <property name="driverClassName" value="org.mariadb.jdbc.Driver" />
    <property name="url" value="jdbc:mariadb://localhost:3306/iducs" />
    <property name="username" value="(아이디)" />
    <property name="password" value="(비밀번호)" /> 
</bean>
<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
    <property name="dataSource" ref="dataSource" />
    <property name="configLocation" value="classpath:/mybatis-config.xml" />
    <property name="mapperLocations" value="classpath:/mappers/**/*Mapper.xml" />        
</bean>
<bean id="sqlSession" class="org.mybatis.spring.SqlSessionTemplate" destroy-method="clearCache">
    <constructor-arg name="sqlSessionFactory" ref="sqlSessionFactory"></constructor-arg>
</bean>
cs

MariaDB 접속을 위한 DataSource와 MyBatis를 사용하기 위한 config, mapper, sqlSessionFactory 설정

1
2
3
4
5
@Override
public List<BoardDTO> boardList(BoardDTO dto) {
    List<BoardDTO> boardList = sqlSession.selectList(namespace + ".selectBoardList", dto);
    return boardList;
}
cs

DB에 접근하는 DAO클래스 내부의 게시판 목록을 불러오는 함수(쓰기, 읽기 외에 게시판 이외의 부분의 입출력도 유사한 구조)
각 매퍼는 네임스페이스가 있으며 네임스페이스.ID값을 호출 시 해당 SQL문을 실행

1
2
3
4
5
<select id="selectBoardList" parameterType="BoardDTO" resultType="BoardDTO">
    SELECT board.*, member.name AS name FROM board 
    LEFT JOIN member ON board.member_no = member.no WHERE board.lang='${lang}' 
    AND board.devide='${devide}'
</select>
cs

게시판 Mapper의 리스트를 불러오는 부분이며 파라미터와 리턴타입을 직접 설정이 가능

프로젝트 후기

프로젝트 개발 자체는 매우 재미있게, 적극적으로 작업에 임할 수 있었던 프로젝트였습니다. 비록 JSP Tomcat cafe24 호스팅 비용과 기간에 대한 한계때문에 학과 내에서 홍보나 유저 유치까지는 하지 못했어도 많은 것을 배울 수 있던 프로젝트였습니다.

특히 기획 부분에 있어서 많은 것을 배울 수 있었습니다. git은 물론이거와 StackOverflow, PHPSchool등 메이저한 커뮤니티 사이트의 마음에 드는 기능들을 전부 구현해보고싶은 욕심에 창업대전 제출 기한을 신경쓰지 못하고 소켓을 이용한 채팅, 실시간 댓글 알림 팝업, 스마트에디터 편집 등 기획 자체를 엄청 크게 잡았었습니다. 그 결과로 시간 안에 제작이 불가능한 기능부터 빼는 과정에 디자인부터 꼬이기 시작해서 DB 설계의 구멍과 쓸데없이 리소스를 잡아먹고 있는 기능들이 곳곳에서 보이기 시작했고 결국 절반쯤 갈아 엎게 되었습니다. 현직에서 DB설계 등과 같은 기획쪽의 작업을 선임 개발자가 주도하는 이유가 납득이 되었습니다.

나름의 잘했던 점이라 생각되는 부분은 프로젝트 시작 전 미리 팀원끼리 작업 분량과 구역을 깔끔하게 나누고 코딩 규칙 등을 정해서 나름의 인터페이스를 만든 덕에 협업에 있어 각각의 프로젝트를 통합하거나 합치는 과정에 있어 발생하는 오류를 매우 쉽게 해결할 수 있었습니다.

다른 기발한 아이디어가 있으신가요?

신입 개발자로써 많은 것을 배우고 제작해보고싶습니다. 현재 프로젝트에 추가되었으면 하는 기능이나, 완전히 새 프로젝트에 대한 아이디어가 있으시면 저에게 연락주시면 감사하겠습니다.