고등학교 홈페이지 개편기

해당 프로젝트는 종료된 후 후배들의 새로운 프로젝트로 대체되어 현재는 모습을 찾아볼 수 없습니다.

지금으로부터 2년 가까이 지난 일이지만, 제가 다녔던 고등학교의 홈페이지 개편은 지금까지 겪은 경험 중에 가장 중요한 일이었습니다. 홈페이지를 개편하며 있었던 일들을 간단하게 정리해서 올립니다.

개발 배경 – 학교

제가 다닌 고등학교인 한국디지털미디어고등학교(디미고)는 일반 인문계와는 많이 다릅니다.

IT특성화고등학교로 분류되어있는 이 학교는 실제로도 IT관련 교과목인 C언어, JAVA, 데이터베이스, 모바일프로그래밍 등 다양한 프로그래밍 관련 교과를 배웁니다. (이과 기준) 그만큼 프로그래밍을 하는 학생들이 많고, 학교에 대한 자부심이 많습니다.

하지만 제가 1학년일 때 학교의 홈페이지는 정말 오래되었고, 플래시로 범벅이 되어있는 데다가 크롬 브라우저도 잘 지원하지 않은 상태였습니다.

구 디미고 홈페이지

코딩에 미친 학생들이 학교에 대한 자부심도 있었는데, 자신들의 학교가 이런 오래된 홈페이지를 운영하고 있단 것에 많은 학생들이 불만을 갖고 있었습니다. 따라서 학생 주도하에 학교 홈페이지를 바꾸려는 시도가 예전부터 있었는데, 매번 중간에 프로젝트가 파탄 나고 중단되어 버렸습니다. 보통 입학 초기에는 학생 대다수가 홈페이지 좀 바꿨으면 하는 생각을 했지만, 시간이 갈수록 다들 그냥 체념했습니다. 이 중에는 저도 포함되어 있었죠.

그러다 어느 날, 학교 홈페이지를 개편해 보지 않겠냐는 연락이 왔습니다. 당시 저는 학교 내의 한 웹 동아리를 운영하고 있었는데, 학교 홈페이지 개편 프로젝트에 참가해달라는 것이었죠.

또 실패할지도 모르지만, 의지가 넘쳤던 저와 몇몇 동아리원들은 바로 프로젝트에 참가하였습니다.

당시 토즈에서 방 하나를 빌려 프로젝트 기획을 했던 모습

주된 내용은, 기존 홈페이지를 대체하고 대외용 메인 홈페이지(www.dimigo.hs.kr)와 인트라넷(intranet.dimigo.hs.kr) 2개로 분리하여 만든다는 것이었습니다. 프로젝트의 지도교사가 있긴 했지만, 학생들이 대부분의 기획부터 개발, 디자인까지 모두 도맡아서 하게 되었습니다. 프로젝트 매니저도 저와 같은 학년인 학생이었고, 영상 및 음원작업을 하는 학생까지 프로젝트에 참가하였습니다.

늘 실패하던 학생 주도의 홈페이지 개편 프로젝트였지만 이번엔 무언가 달랐습니다. 기획도 디자인도 체계적이었고, 무엇보다 이번에는 지도교사와 학교 측의 의지가 조금 있어 보였습니다. 프로젝트를 총대 멨던 학생이 학교에서 매우 신뢰를 받고 있었던 사실도 매우 컸죠.

1차 개발

프로젝트는 크게 1차와 2차 개발로 나눠졌습니다. 1차 개발 기간은 1학년 겨울방학부터 2학년 학기 초까지 진행되었습니다.

처음 프로젝트 기획 규모는 굉장히 컸는데, 일반적인 대학교 포털과 비슷한 수준의 규모였습니다. 물론 이 짧은 기간 동안 이를 다 개발할 수는 없었고, 대외용 홈페이지와 인트라넷의 필수적이며 급한 기능들만 개발하고 잠시 중단되었습니다.

이때의 프로젝트 인원은 15명 내외였고, 팀원 대부분이 팀프로젝트에 대해 경험이 많지 않았으므로 드롭박스와 USB를 통하여 자료 관리를 하였습니다. MVC 프레임워크도 없이 PHP와 자바스크립트로 구조도 없는 코드를 짜며 개발을 진행했죠.

대외용 홈페이지. 당시 Xpress Engine (XE)로 개발

하지만 이렇게 체계적인 계획 없이 프로젝트를 진행하는 것은 불가능하다는 생각이 중간에 들었습니다. 따라서 1차 개발을 완료하고, 일정 기간 동안 휴식 후 사람을 더 모아 2차 개발을 진행하게 됩니다.

2차 개발

2차 개발 시작 시기에는 1차 개발에서 개발 총괄을 맡았던 선배가 고3이 되어, 제가 이어 전체 개발팀을 이끌어야 하는 상황이 되었습니다. 체계적인 프로젝트 관리를 위해 프로젝트 매니저 학생과 개발 총괄이었던 저는 각자 조직적으로 프로젝트를 진행할 수 있는 계획을 세웠습니다.

우선 부서를 만들었습니다. 개발부와 미디어디자인부, 보안지원부 3개의 부서를 만들고 그 밑에 팀을 꾸려서 팀별로 독립적인 작업 수행이 가능하게 하였는데, 이는 1차 개발 기간동안 실질적으로 작업 한 시간보다 다른 사람을 기다리며 보낸 시간이 더 많았기 때문입니다.

개발부 내에서도 각 팀마다 모듈단위로 개발할 수 있게끔 MVC 프레임워크를 직접 개발하여, 잉여 시간이 최대한 발생하지 않도록 계획하였습니다. 3학년이 된 학교 선배들에게 없는 시간 뺏어가며 조언을 듣기도 했고, 구조화된 소스코드를 받아서 우리 것으로 녹이기도 했죠.

소스코드도 확실히 관리하기 위해 Git을 사용하였고, 디자이너도 ‘디자인 스튜디오’라는 툴을 사용하여 체계적인 관리가 될 수 있도록 노력하였습니다.

Github로 관리하였던 인트라넷 프로젝트. 현재는 오픈소스로 공개되어 있습니다.

홈페이지 2차 개발 프로젝트는 30명 이상의 인원이 참가하였고, 3개의 부서와 10개 이상의 팀을 꾸리며 고등학생 치고는 상당히 체계적으로 프로젝트를 진행했던 것 같습니다. 결과적으로 많은 페이지들을 만들고, 개선된 인트라넷을 성공적으로 런칭할 수 있었죠.

물론 잘못된 결정과 오만함도 많았습니다. 시중에 나와있는 Codeigniter와 같은 프레임워크를 사용하지 않고, 직접 MVC 프레임워크를 만들며 개발하였는데 이 결정 때문에 너무 많은 시간이 프레임워크 개발에 소모되었습니다. 또한 동아리 내부 인원 위주로만 개발을 진행하며 타 개발 동아리와 거의 협력하지 않았는데, 이 때문에 프로젝트에 추가로 인원을 투입하기 어려웠으며, 우리 동아리에서 관리를 잘 못하게 되는 상황이 되자 프로젝트가 사라져버리는 결과를 낳기도 하였습니다.

인트라넷의 화면 일부. 주말 잔류를 신청하는 페이지로, 당시에는 매우 파격적인 디자인으로 많은 학생들의 환영을 받았습니다.

이후

비록 고등학생 치고 상당한 규모의 팀을 꾸려 체계적으로 개발했지만, 프로젝트를 주도했던 대부분의 학생들이 3학년으로 진학하면서 프로젝트는 중지되었습니다. 수능이 끝나고 일부 문제를 손보긴 했지만 얼마 후 졸업을 하게 되면서 팀원 대부분은 프로젝트와 인연을 끊게 됩니다.

그렇게 홈페이지를 관리할 수 있는 사람이 적어지자, 학교에 재학 중인 후배들이 다시 한번 새로운 인트라넷을 개발하게 되었고, 현재 인트라넷은 없어지게 되었습니다.

물론 개발한 인트라넷이 사라지긴 했지만, 이 프로젝트를 진행하며 프레임워크를 만들어보기도 하고, 많은 사람들과 함께 공동 프로젝트를 진행해 보는 값진 경험을 해볼 수 있었습니다. 비교적 어린 나이에 많은 교훈을 얻을 수 있었고, 아직까지도 이때 얻었던 경험들이 저를 더욱 발전시킨 것 같다고 느끼고 있습니다.

교내에서 열심히 일하는 모습.. 표정이 어두워 보이지만 그래도 정말 재미있었습니다^^